Tell me more ×
User Experience Stack Exchange is a question and answer site for user experience researchers and experts. It's 100% free, no registration required.
up vote 0 down vote favorite

I have Fullscreen image. This creates problems for mobile browsing for the images are large and hi-res.

Next problem is with things like retina display how does a design/programmer prepare to deal with this issue? I see lot of article about how to switch between images. But then I get overly confused with pixel density vs resolution. The when and where it is needed and the how and why to target them.

Example:

*Fullscreen image at 1900x1080 resolution & 72dpi. For best optimization, How many images should there be per resolution/pixel density? Furthermore, Given this scenario which library/plugin/symantics would be best on tackling this situation?

Lastly, If i use media queries to target and switch background images will it download all the images? or just when the requirements have been met?

share|improve this question
Requests for libraries / plugins etc or for technical advice are off-topic for this site, I'm afraid. User Experience as a field is technology-agnostic. There are other Stackexchange sites where you can get advice on how to implement something (programmers.stackexchange, stackoverflow.com etc - depending on the nature of your request. Check the various FAQ sections on those sites for more guidance. – JonW♦ Jul 14 '12 at 12:31

closed as off topic by JonW♦ Jul 14 '12 at 12:31

Questions on User Experience Stack Exchange are expected to relate to user experience within the scope defined in the FAQ. Consider editing the question or leaving comments for improvement if you believe the question can be reworded to fit within the scope. Read more about closed questions here.

1 Answer

up vote 0 down vote

With media queries you can manage the use of different image resolutions, when using retina some users recommend ratio or intial-scale to 2 in the @media tag, for gradient, shadows and other elements use CSS

media queries docs: http://www.w3.org/TR/css3-mediaqueries/

share|improve this answer

Not the answer you're looking for? Browse other questions tagged or ask your own question.