What parameters does css media type deal with? Handheld?

Question

I need to change the style on the page depending on whether it is a handheld device (such as a cell phone) or a large screen device such as a laptop, desktop computer or tablet.

I know that I can determine the resolution at the request of max-width css and the like, but this does not seem convincing. Mainly because smartphones today have such high-resolution screens. I.E. Sony Xperia S, it has a 720p screen at 1280, but it is only 4.3 inches. Due to this, the 10px font, which will be readable on a regular computer screen, will become too small to read.

So I need to know a little more than just letting me know if this is a small screen device or not. (and I suppose media = "handheld" css style is the way to go. Please correct me if I am wrong).

So: what parameters does css media type “handheld” have?

• Device screen size?
• Browser window size?
• Bandwidth
• Is the information about whether the device is "pocket" and not just a parameter passed by the client?
• Are tablets included as “pocket” devices?

and etc.

Thanks!

Answer 1

The media type handheld is pretty much useless because modern smartphones and similar devices (at least Android browsers for Android and iOS) do not use it to avoid getting the minimum minimum formatting designed for older devices.

I recommend using media queries. Please note that you can request a resolution, as well as a size, and you can request a size in physical units (in, pt, cm), as well as in pixels. (However, I do not know if the devices report sufficiently accurate physical unit sizes.)

However , when appropriate, you should not be designed for specific devices, but for your site to work well at any scale (the current buzzword for this is responsive design, and a lot has been written about the methods for this). My personal approach is to write a stylesheet almost completely in terms of em (units of measure for line height), and then use media queries to switch the layout in cases where a particular layout only works in a certain size range; and since size is defined in terms of em , the media request must be recorded in terms of em . The advantage of this is that the font size is a reasonable proxy for a reasonable screen size for the elements on the screen, which reflects the viewing distance and (if the user spent time setting up his browser) the user's eye / hand capabilities.