Viewing the wiki in different resolutions
Moderator: English moderators
Forum rules
Please keep the forum rules and guidelines in mind when creating or replying to a topic.
Please keep the forum rules and guidelines in mind when creating or replying to a topic.
Viewing the wiki in different resolutions
When viewing the wiki from different screens with different resolutions I've notices how it re-positions certain things in rather odd ways. On my 1080p display the Rayman page has the images in the wrong places, making it look rather messed up. But when viewed on a 720p display (which seems optimal for most pages on the wiki) it looks really organized like how I first set it up. Image tables, which are usually set out with 3 on each row, don't even go to the end of the screen on 1080p displays like on 720p ones. Perhaps it's better to switch to using the gallery with a set resolution as it's responsive to the display size?
Also, when viewing on my phone the wiki looks more or less completely messes up, with everything trying to fit in to a really thin page. The text font (especially on the "Recent changes" page) is also messed up with it changing pretty much each time I reload the page. I've tried on Chrome on iPhone and Android, Safari on iPhone and the Samsung Browser on Android with very similar results. It was worse on Chrome on Android and best on Safari on iPhone, but still not good on any of them.
Rayman page on a 1080p display - Notice how the table with the three Rayman images appears to high up here.
Rayman page on Chrome on Android - Notice how the table now goes beyond the page area. This is worse on some pages where the third image can barely be seen.
Recent pages on Chrome on Android - Notice how the second recent change appears smaller (like it should) than the rest of the text. Reloading the page continuously will sometimes have all the text appear small.
Also, when viewing on my phone the wiki looks more or less completely messes up, with everything trying to fit in to a really thin page. The text font (especially on the "Recent changes" page) is also messed up with it changing pretty much each time I reload the page. I've tried on Chrome on iPhone and Android, Safari on iPhone and the Samsung Browser on Android with very similar results. It was worse on Chrome on Android and best on Safari on iPhone, but still not good on any of them.
Rayman page on a 1080p display - Notice how the table with the three Rayman images appears to high up here.
Rayman page on Chrome on Android - Notice how the table now goes beyond the page area. This is worse on some pages where the third image can barely be seen.
Recent pages on Chrome on Android - Notice how the second recent change appears smaller (like it should) than the rest of the text. Reloading the page continuously will sometimes have all the text appear small.
-
- Posts: 83836
- Joined: Thu Aug 07, 2003 6:50 pm
- Location: Paris, France
- Contact:
- Tings: 609359
Re: Viewing the wiki in different resolutions
Yes, we're probably better off using galleries whenever possible now that they support multiple options (widths, CSS classes, etc.).
-
- Posts: 50143
- Joined: Sun Aug 21, 2011 10:14 am
- Location: Somewhere specific, I'd assume.
- Tings: 404084
Re: Viewing the wiki in different resolutions
In which case, should we attempt converting current articles to use galleries instead of invisible tables?
-
- Posts: 12343
- Joined: Tue May 29, 2012 8:15 pm
- Location: Uh, well, I don't really know
- Tings: 52095
Re: Viewing the wiki in different resolutions
Why not keep the invisible tables that contain 3 images and just reduce the count to 2? When there's only 2, the images look organized and they don't reach the end of the phone screen.
FC: 37.699 | CF: 107.954 | BOM: 94.827 | LOTLD: 121.385 | DOTK: 109.831 | LS: 41.270 | SBTC: 94.755 | HH: 107.339 | TOTL: 104.496
Total: 819.556
Total: 819.556
Re: Viewing the wiki in different resolutions
If we do that we'll still have the problem of how they look on 1080p computers, in which case it won't even go to the half way point of the screen and will look rather odd when there are a lot of images in the table. I think a gallery will be better in these cases since it will auto-adjust the number of rows depending on the screen.
As for replacing existing tables with galleries, I'm all for doing that if everyone's fine with the change.
As for replacing existing tables with galleries, I'm all for doing that if everyone's fine with the change.
-
- Posts: 37007
- Joined: Fri Jul 31, 2009 9:00 pm
- Location: https://www.youtube.com/watch?v=cErgMJSgpv0
- Contact:
- Tings: 102730
Re: Viewing the wiki in different resolutions
Wasn't sure about the policy on galleries versus tables, but now it makes sense. I'm all for replacing all tables with galleries!
Sig with Dora made by R4Y_ANC3L; others made by me
Android: How to block an image you don't like
It's good to learn from the past: read the Pirate-Community Documentary!
Other things you should know about this site
-
- Posts: 50143
- Joined: Sun Aug 21, 2011 10:14 am
- Location: Somewhere specific, I'd assume.
- Tings: 404084
Re: Viewing the wiki in different resolutions
Wonder if we could get a bot or make a script that can automatically convert existing invisible Wikitables into galleries. Either ways, should we attempt to change articles, or not bother and just change them as we edit onwards?
-
- Posts: 83836
- Joined: Thu Aug 07, 2003 6:50 pm
- Location: Paris, France
- Contact:
- Tings: 609359
Re: Viewing the wiki in different resolutions
We could, but that's probably more work than doing it manually.Master wrote:Wonder if we could get a bot or make a script that can automatically convert existing invisible Wikitables into galleries.
Probably the latter, unless someone feels motivated enough.Master wrote:Either ways, should we attempt to change articles, or not bother and just change them as we edit onwards?
One thing though, we might not be able to put galleries everywhere. I've found a way to add the sprite class to all images in a gallery, but I'm not sure if it can be done for a single image. If not, then we can't use galleries where there's a mix of sprite-based and other images.
In fact, we might have the same problem with sizes. While almost all images are rendered at 320 pixels, those from the original game are usually 316 or 318 pixels, Game Boy Advance screenshots are 240 pixels wide, and there's more formats. A gallery would have to respect those sizes.
Re: Viewing the wiki in different resolutions
On the Rayman 2 early production page I managed to make a gallery-like thing with different resolutions with the help of the MediaWiki help pages. Not sure if that type of gallery has any different properties though or if that can be used in future situations as well. As for making a bot etc., I think this can be done manually over time as we edit articles. I've already begun implementing it as I've been uploading images to the Legends level articles.
-
- Posts: 83836
- Joined: Thu Aug 07, 2003 6:50 pm
- Location: Paris, France
- Contact:
- Tings: 609359
Re: Viewing the wiki in different resolutions
Are you referring to the gallery where images are shown at their actual size? Not sure if that'd work for higher-resolution screenshots.
Re: Viewing the wiki in different resolutions
I tried it out a few times now and since it supports thumbnails which can be resized it works perfectly fine. So I think we should use galleries when they are all the same resolution, and the responsive thumbnail alignments when they are different resolutions or require the sprite class.Hunchman801 wrote:Are you referring to the gallery where images are shown at their actual size? Not sure if that'd work for higher-resolution screenshots.
-
- Posts: 83836
- Joined: Thu Aug 07, 2003 6:50 pm
- Location: Paris, France
- Contact:
- Tings: 609359
Re: Viewing the wiki in different resolutions
Sure, that makes sense!
-
- Posts: 34039
- Joined: Sat Mar 24, 2018 6:15 am
- Location: The realm of Mario Karting
- Tings: 78135
Re: Viewing the wiki in different resolutions
*deleted*
Always be true to yourself.
Sigs by Steo and R4Y_ANC3L
Sigs by Steo and R4Y_ANC3L