image - Recommended max photo size for full screen width, responsive slideshow -
i build responsive sites travel industry , our clients wanting follow trend of having huge photo slideshows show off local area. these slideshows take full width of browser.
i looking recommended maximum pixel width images uploaded these slideshows (fyi i'm using plugin camera wordpress). client asked me because concerned load time, , i've considered on own before, haven't ever come solid conclusion (and haven't found yet in hours of searching already). example, on 1 site have uploaded photos each 1700x565 pixels. files on 200k each! admittedly, optimize bit better, can optimize point without losing quality.
i have 2 concerns:
1) users on big resolutions, 1920px or larger? photo going pixelated when grows responsively resolution 1700px 1920px (or whatever).
2) load time desktop users? (i'm not planning on loading slideshow @ mobile devices, that's non-issue). don't want end crappy google page speed score.
are there best practices regarding issue? articles on refer me to?
surprised hasn't been answered best.
rule of thumb image optimization web & code, in training, has been upload image size preferred , adjust per device using media queries ( more info here: https://developer.mozilla.org/en-us/docs/web/guide/css/media_queries ).
typically, i've been taught keep file sizes 50-70kb(dependent on format) lower number better. shopify's article on image optimization says best:
http://www.shopify.com/blog/7412852-10-must-know-image-optimization-tips#axzz2hk4nxlan
hope helped!
Comments
Post a Comment