Pixels or Ems? Which Works Best For You?

There’s a pretty strong debate among web designers: which is the best unit of measure for font size; is it Pixels or Ems? I think most of you will agree, there is no right or wrong, rather a matter of design preference. But lets take a look at both units and hopefully you will be able to chose the one that suits your needs.

First, a quick definition of each:

Ems: A font height or size that is relative to the parent element. In most Web pages this would be the body of the page - and so the parent element is the default font size for the browser settings. Also, this is pronounced ehms, not E-M-S.

Pixel: A font height or size that is based on screen pixels or dots.

Now, here’s what each measurement can do for you:

Using Ems as your font size measurement ensures that your pages will be accessible to most browsers and platforms. Plus, if your readers choose to change the default font size on the fly, your page will scale to that new size.

The problem with using the Ems measurement is that you lose control over the precise look of your page. Some users may have a much larger or smaller default size than you do, and with Ems, your fonts will scale relative to the size on their operating system. This can result in sporadic font sizes and a site that does not look quite the way you intended.

Pixels, on the other hand are the measure of resolution, and the resolution of a user’s monitor can affect the readability of your type. For example, the standard settings for most Mac’s are set at 72 dpi, while most Windows are set at 96 dpi. So, a font set at 72px will be 1 inch (approximately) tall on a Macintosh and three quarters of an inch tall on a Windows machine.

Most designers do their layouts in pixels - which works is fine if all your visitors have the same display size; but what about the users with large displays?

There is so much to consider when designing a web page that anyone on any machine can use. And at times it seems as if the speedy advancement of technology, which by the way, was meant to make our Internet life simpler, has actually made it a little more complex. When deciding on a dynamic page layout, keep in your end-user in mind; that in itself might make it simple again!!

Looking for more information on professional web design? Visit us on the web at MandarichMediaGroup.com!