Image size and resolution for responsive site

I’m looking to set up a responsive portfolio website, of course, with larger images to impress.

The images need to be content so they can be managed through a CMS, i.e. cannot be specified as CSS background images.

I want to get the balance right: make them large and HD, but don’t make it all too slow to load on a mobile network connection.

I think that I don’t have the scope to develop a solution where the device is detected a different version of the image is served depending on screen/browser size.

If I cater for Retina display on Macbook Pro, for example, I would have to double the pixel dimensions of an already large image. If these images had to load through a mobile network, I guess this would noticeably slow down page load. Is it even worth catering for large HD screens, maybe it’s enough if they’re large enough to be HD on a mobile…

What is your line of thought? How have people compromised so far? Many thanks.

This recent thread has some information and links that I think you will find useful.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.