Bureaucrats, content-moderator, emailconfirmed, Administrators (Semantic MediaWiki), Curators (Semantic MediaWiki), Administrators, threadmoderator
85,404
edits
Tardis:Infobox images: Difference between revisions
From Tardis Wiki, the free Doctor Who reference
→Mobile is when everything changes, and we've got to be ready.
(Created page with "{{mosnav|p=Infoboxes|c=Infobox policies}} {{moss|Choose '''Infobox''' images wisely. And make 'em at least 420px wide, please.}} {{sc|T:IBOX PICS}} Inf...") Tag: sourceedit |
Tag: sourceedit |
||
| Line 6: | Line 6: | ||
Portable infobox code allows the infobox image to be as wide as the device on which it's viewed. Ironically, this means infobox pictures can be bigger on phones than they are on desktop! | Portable infobox code allows the infobox image to be as wide as the device on which it's viewed. Ironically, this means infobox pictures can be bigger on phones than they are on desktop! | ||
For the benefit of our sizable mobile audience, infobox images should have a minimum '''natural''' width of 420px wide. This allows the infobox code to automatically resize the picture so that it will fill the width of most phone screens. See the difference, below, between an image that's naturally | For the benefit of our sizable mobile audience, infobox images should have a minimum '''natural''' width of 420px wide. This allows the infobox code to automatically resize the picture so that it will fill the width of most phone screens. See the difference, below, between an image that's naturally 301px and one that's 420px. | ||
[[File:InfoboxComparison.jpg|center|500px|thumb|See how Arthur Darvill completely fills the space, creating a bold "hero image", against which the article title can be easily read.]] | [[File:InfoboxComparison.jpg|center|500px|thumb|See how Arthur Darvill completely fills the space, creating a bold "hero image", against which the article title can be easily read.]] | ||
__TOC__ | __TOC__ | ||
== Widescreen preferred == | == Widescreen preferred == | ||
Furthermore, it's preferred that images be cropped to a widescreen {{w|aspect ratio}}. For best results, and relatively easy math, a good one to use is 2.35:1. So, if you're aiming for a 420px width, you know that your height would be 420 / 2.35, or 179px. A pic that's 420px wide x 179px tall will fit these requirements. Make a blank template with those dimensions in an image editor, and you can easily achieve exactly the right size, every time. Easy! | Furthermore, it's preferred that images be cropped to a widescreen {{w|aspect ratio}}. For best results, and relatively easy math, a good one to use is 2.35:1. So, if you're aiming for a 420px width, you know that your height would be 420 / 2.35, or 179px. A pic that's 420px wide x 179px tall will fit these requirements. Make a blank template with those dimensions in an image editor, and you can easily achieve exactly the right size, every time. Easy! | ||
