Pixel Measurements in CSS Considered Harmful?
October 19, 2013 5:49 PM Subscribe
Are (or should) web designers move away from pixel measurements in style sheets?
I'm in an awkward spot between "graybeard computer guy" and "hipster web designer." I know (or can figure out adequately) how things work, but I don't know what Teh Current Hotness is.
I have a WordPress website with a commercial theme, and some of the font weights, sizes, and leadings don't look good on all the devices I've tried. I've been poking around, trying to improve things, and I keep running into dimensions and sizes specified in px. I suspect (but don't know for sure) that px is a bad unit to use -- given the wide range of display resolutions, it seems like it'd be smarter to specify in percentages [of "regular" size], or points.
If there are a LOT of pixel-sized dimensions, should I start looking for a new theme? Or is there a way to fix a pixel-dimensioned theme (that is generally attractive) so that it looks good wherever it's displayed?
I'm in an awkward spot between "graybeard computer guy" and "hipster web designer." I know (or can figure out adequately) how things work, but I don't know what Teh Current Hotness is.
I have a WordPress website with a commercial theme, and some of the font weights, sizes, and leadings don't look good on all the devices I've tried. I've been poking around, trying to improve things, and I keep running into dimensions and sizes specified in px. I suspect (but don't know for sure) that px is a bad unit to use -- given the wide range of display resolutions, it seems like it'd be smarter to specify in percentages [of "regular" size], or points.
If there are a LOT of pixel-sized dimensions, should I start looking for a new theme? Or is there a way to fix a pixel-dimensioned theme (that is generally attractive) so that it looks good wherever it's displayed?
Best answer: Percentages, ems or a combination are preferred nowadays. Responsiveness is one reason (you can scale all fonts without having to change every rule that specifies a size if you write your css to permit it) and accessibility is another (fonts specified in pixels won't be scaled if a user tries to zoom fonts in their browser).
If most of the dimensions on the theme you're using are in pixels it very well might be better to get a different theme. To adapt the existing theme could take a lot of fiddly work (depending on how the css is organized) and you could end up creating gaps or flow problems in the design. To me it just sounds like a big headache. I'd look for a responsive theme.
posted by under_petticoat_rule at 6:15 PM on October 19, 2013 [1 favorite]
If most of the dimensions on the theme you're using are in pixels it very well might be better to get a different theme. To adapt the existing theme could take a lot of fiddly work (depending on how the css is organized) and you could end up creating gaps or flow problems in the design. To me it just sounds like a big headache. I'd look for a responsive theme.
posted by under_petticoat_rule at 6:15 PM on October 19, 2013 [1 favorite]
Response by poster: It's amazing how often you just need to know the search keywords, which in this case are "responsive web design."
Thanks, everybody!
posted by spacewrench at 6:25 PM on October 19, 2013 [3 favorites]
Thanks, everybody!
posted by spacewrench at 6:25 PM on October 19, 2013 [3 favorites]
This thread is closed to new comments.
posted by oceanjesse at 6:01 PM on October 19, 2013 [1 favorite]