Web Development

Ask something
Discussion Locked

The trouble with using ems

0 helpful
4 replies

by maryweilage

Closed to new repliesThis discussion is closed. It stays readable, but it takes no new replies.

This week's Design and Usability Tactics e-newsletter examines the trouble with using ems and percents for font sizing. Do you agree with author Michael Meadhra that using relative measurements for font sizing sounds good in theory but not in reality? Did this tip teach you something new? If so, please let us know.

If you aren't subscribed to the Design and Usability Tactics e-newsletter, visit our e-newsletter subcenter to subscribe:
http://nl.com.com/MiniFormHandler?brand=builder&subs_channel=bldr_front_door&list_id=e614

* Please delete any extra spaces that appear when you paste this link into your browser.

4 replies

by pixelsurge

While it is true that using relative font sizes is difficult and can cause problems if not used with care, I found this article misleading overall in that it seemed to suggest that using absolute font sizes was safer. This is just not true. Even if you use an absolute unit like pixels or points to size your text, I can still resize that text in just about every browser except IE. Also, if I have changed my system font size or browser default font size, this will affect web page text as well whether the designer likes it or not.

As unpleasant as it sounds, web developers just need to accept that you can't control how users will view your page (it is not print) and thus need to design with flexibility in mind. Use relative sizes and build your site in a way that you can make the text much bigger or much smaller without breaking the layout. It's the safest way to go.

I also really dislike the author's comments that "diehard Mac users" are stubbornly refusing to adopt to "normal" text. Who is he to say what is normal text? Every web user has a right to set text to a size that is comfortable to him or herself. Your design should accomodate the user. Mr. Meadhra, I've seen you write articles on useability before, and therefore would have thought you would not be so dismissive of user preferences.

by meadhra

Actually, I think we probably agree more than we disagree, and I certainly don't want to start a flame war over the disagreements. However, I do feel compelled to respond to the points that you categorize as "misleading".

<>

I didn't say absolute sizes were "safer". They're easier to use and offer the most consistency across browsers and platforms, but they have accessibility problems, so they're not any "safer" than relative measurements or keywords.

<>

Exactly! Although most browsers can resize pixel-sized fonts, IE/Win can't. That means that the overwhelming majority of Web visitors have potential accessibility problems with pixel-sized text.

<>

Normal text size is dictated by the standards committees and browser manufacturers when they set the browsers' text defaults. Similarly, the default settings for the operating system fonts are set by the manufacturer. Whether you or I like and agree with those default settings or not, they are the defacto standard and most web users never change them. Web builders who habitually view their creations on systems with significantly different settings risk losing touch with the way typical web visitors view their sites. This is a potential problem for Web builders using both Windows and Macs, but it's noticeably more prevalent among the Mac users -- especially those coming from a print production background. I'm not saying that you shouldn't use whatever screen resolution and settings you find comfortable -- but if you create Web sites using a system that differs significantly from the typical visitor, then you'll need to do extra testing with more typical system settings to view your site the way your visitors do.

<> and <>

I agree completely! In fact, I'm planning a future article to discuss this very point. And speaking of future articles, some of the other points above are mentioned in next week's column.

The main point of this article is that using relative measurements for font sizes can create major problems in real-world usage. Sizing fonts relative to an arbitrary norm doesn't work well if we can't agree on that norm, but the bigger problem is the compounding effect that results from nesting elements with relative font sizes within other elements with relative font sizes. The resulting exaggeration of the relative sizes can quickly reach outrageous levels, and it's very difficult for most Web builders to anticipate and control.

by lawrephord

a page that senses the system then prints a gif menu to let users choose what font and size they want

by mikiel

I agree with the author (Michael Meadhra). It can be very difficult to apply relative sizes to fonts. It's unfortunate that the W3C committee made relative sizing inherited. It would have been much better if relative sizes were based on the browser/user's default font size rather than the current element's CSS parent's size. (Or perhaps had one set of CSS attributes for inherited relative sizing and another for not-inherited relative sizing.)

As the author indicated, NN 4.x (and probably other browsers') different DOM (wherein stuff in the tag is not inherited by certain elements and

s are often immune to CSS inheritance from ?above?) makes it so you can't just whip a font-size style into the tag and be done with it.

Applying relative sizes to

s and

s which'll have sub-elements leads to just the problems the author mentions (rapidly growing/shrinking text). The effect can be so dramatic that it leads to illegibility which, IMHO, falls out of the ?looks a bit different in some browsers but still works? category. Currently we've tried applying our standard font (which includes a relative size) to the

tag. But then you have to remember to slap a

tag around all your standard fonted text. (But a

is easier to type than ...)

I agree with Pixelsurge's suggestion that one should build his/her pages so to they can endure the varieties of the users' setups. This is especially true of font-sizes.

I'd be interested to hear how others have tackled applying site-wide relative fonts.

This discussion is closed to new replies.