3

The current practice of using media queries via pixel-thresholds is fine, but what if someone decided to use their 50-inch 4k tv as a vertical monitor and actually sit really close to it?
I could see that happening if their work revolves analyzing or referencing really longs lists as constant scrolling would get tedious.

How then, would you style a webpage that only has a really long list? Others may visit the site via a smartphone, and since resolution is comparable between all types of devices now, how could you differentiate the two?

Do you have to rely on user-agent headers and such?

Improve this question
3
  • A person can still only see one part of the screen at a time. A long list all in their field of vision is still overwhelming even if they can easily read the text of each individual item.
    – Axesilo
    Aug 28, 2016 at 20:06
  • what about a display board in some retail shop? There are scenarios where the user would rather 'scroll' with their head and eyes rather than the screen.
    – House3272
    Aug 28, 2016 at 20:09
  • What sort of board do you mean? You have me thinking of the "Starbucks learning curve," when someone who has never really gone to Starbucks walks in, sees their boards with 100 drink options printed on them, and just gives up and orders a small black coffee. Maybe you meant more technical oriented things though in which case I can see it being all right.
    – Axesilo
    Aug 28, 2016 at 21:23

2 Answers 2

Reset to default
1

You should let the operating system and browser handle it. Media queries are based on CSS pixels rather than physical pixels. For example most of the smart phones report their screen width in range of 300-400 CSS pixels even though they might actually have a Quad HD display. Therefore the image is roughly the same size on most the smartphones regardless of the actual resolution.

Same applies to the Macs and desktop PC:s as well. Most of the computers with high resolution display come out of the box configured with 150% - 200% scaling. Of course the scaling is configurable by the user but you should respect the users' choice and not try to override it with some custom behavior.

Improve this answer
0

Not sure about the ‘current practice’ you refer to, as there are there are many units that can be, and are, used in media queries.

I design around content, so I always set media queries in em. That way the design is responsive to the content size and it makes no difference what physical size the display medium is, only how much content it can display.

Don't fall into the trap of trying to design for specific screen sizes, it's a game you can never win and a problem that responsive design can easily solve if you allow it.

Improve this answer

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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