Facebook Cover Images On Mobile Devices
Did you know that approximately 90% of Facebook users access the platform predominantly on mobile? So it’s best to design your images & content to allow for that.
So often I see companies design a visually beautiful cover image without testing what it looks like on mobile where most people view it. The result? Important copy and parts of their image is cut off. Yikes!
Dimensions that your designer needs to know
Facebook DISPLAYS Page cover images at 820 pixels wide by 312 pixels tall on computers, and 640 pixels wide by 360 pixels tall on smartphones. But for fastest loading, Facebook recommends 851 x 315 (and less than 100 kbs).
However, cover images show up differently on mobile. And, ideally, you want nice crisp, high-resolution images and clear text. To ensure the *same* content is displayed on mobile, one option is to use an expanded height, e.g. 828 x 465 pixels. You could use custom dimensions on your favourite image editing tool, like Photoshop.
Where to place text
To ensure any text also displays on mobile, place it in the ‘middle third’.
Another option is to leave a margin on either side of 134px and place your text in a ‘mobile safe area’ - the middle 560px.
Email me at firstname.lastname@example.org to find out more about my services.