Build Your Own Business Website header image

Should I Use em or px When Customizing Thesis?

Difficulty Level -

Filed Under Topics -

Listed Under Lesson Subjects -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

In this session we discuss the use of em or px when customizing the Thesis theme as potential size choices and the difference between the two. The more complicated the design is, the less useful ems are because they are calculated differently by the pc and mac. If you have exacting dimensions for things, we suggest using px rather than em. One reason for using ems is for accessibility because it can be a way of making a simple site scale nicely when you zoom.

Video Transcript

Member: To start a web design, what is your best advice to have a website designed to fit most screen sizes? For example, I’m not too worried about small devices like mobile phones, stuff like that. But at least the 417 inces screen and bigger, what is your best advice for size-wise? Should I go with absolute sizes when I design it or should I do like a relative to… like a em. Do you know what I’m talking about?

Rick: I do know what you’re talking about. And because what your choice is do you use pixels, percentage, picas or ems for things because those are all different potential size choices you have. And I would say that the more complicated the design is, the less useful are anything but pixels because ems are calculated differently by PCs and by Macs. So what you see often is somebody says, “Well, my menu is the perfect size in a PC but it’s way too big in the Mac.” and I haven’t changed anything, they’re exactly the same and that’s because the Mac calculates ems differently than the PC does. And so if you have a really exacting dimensions for things, you should really use px rather than em.

Now the thing is that Thesis uses em and the main reason, I think that Thesis uses em and it uses it throughout, because it’s actually not very complicated. The layout of Thesis is not complicated and you can create menus that don’t work properly or that are too big in the Mac but are just fine on a PC with Thesis. And then there’s no solution to that. You just have to live with it. But the reason for doing em is for accessibility because if you use ems then when you zoom, then it just increases those ems by that percentage. And well, zooming regularly breaks the site anyway but it can be a way of making a relatively simple site scale nicely when you zoom. But otherwise, if your site design isn’t very simple, I would use px.

Member: So you’re saying because Thesis is using em system then my design… because I am following your classes to design my website. And I’m a real estate agent and my audience is general public with all kinds of people with all kinds of devices. So it’s better off for me to have an em system to go along.

Rick: No, I don’t think so. Unless you have a real simple site, a real simple site layout, it’s probably better off for you to use px because the em will look different in different devices. Whereas the px is still a uniform calculation based on the resolution of the monitor.

Comments on this entry are closed.

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
Subscription Options

Comments on this entry are closed.