To up my game in 2020 I am researching mobile image size best practices.
My theme of choice is Themify Ultra. This theme as unique functionality that disables (does not download) content for the device category that is NOT used. Mobile phone download only the mobile content, tablets download only tablet content and desktop does the same.
The greatly decreases the size of the page in comparison to standard responsive techniques of hiding the content, while still downloading all the content.
For those of you building your sites for one device category and using the desktop view as the primary design focus and expecting responsive design to force the desktop into the appropriate mobile area, this is an outdated practice. Instead, build for mobile and allow the responsive design to resize up to tablet and desktop.
In the cases where I have been limited by budget for site creation, the practice of building for mobile first has greatly increase the average performance of the site. In the majority of the cases desktop visits were not impacted negatively.
With the functionality in the Ultra theme building for two device categories is quick and simple. The theme uses module which you can copy, edit and then set for up to four device categories. Quick and simple process to copy a module, set to mobile view (and exclude mobile view from the original.) and replace the image with the mobile image. Since the desktop image will now not download the page speed score for mobile should now increase and the image fit properly on mobile devices.
Until recently I have resized mobile images to 480 width. I have read today that 640 width is better. For images withing content 200 - 250 width.
Of course, when using a predefined image location in your theme, use the exact size the theme is expecting.
Defining and then using the correct image size is very important and can decrease the time it takes the page to load and become functional.
Please share your thoughts about images size for desktop, tablet horizontal, tablet vertical and mobile devices.
What it the max width and height you use?
Please ask additional questions about this subject and/or share your best practices.
Discussion Of Everything Legal Is Good
2 posts • Page 1 of 1