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

Popular posts from this blog

php - Calling a template part from a post -

Firefox SVG shape not printing when it has stroke -

How to mention the localhost in android -