Forum Moderators: open
Which do you prefer and why?
I like specifying px because I understand pixel height.
Can anyone explain what em units designate? Has anyone ever heard of x-height or ex units?
An em is a variable unit and the base unit (1em) is whatever the user has there browser set to. IE their preference.
Read this: http://www.alistapart.com/stories/dao/
I hope it will enlighten. Fixed units stop many people with less than perfect vision (like me) from enjoying your work and who are we to dictate?
The web is a flexible, liquid media and I'd argue against trying to exercise a print media type control.
Hooray for em's ;)
Nick
i've always assumed that it works on a similiar way to using em in that the base 100% is whatever the system font is set to.
<added> of course there are issues especially with nn4
This is (and will) remain a controversial issue with "multiple camps" epousing their own preferences. Good points can be made all around. Perhaps the most important deciding factor is the type of layout used: fixed (with multiple sized containers, divs, etc.) or fluid with limited use of defined containers (div-right {width:200px; height:330px;})
First, try doing a SITE SEARCH for font-size, there have been some great threads on the subject not long ago.
Ultimately, px, may be the most "consistant" across browsers and platforms, though that does not equate to the "best." Em would certainly be in the running here, but there can be unexpected results when using this unit in predefined containers. Cross-browser/cross-platform testing is a must.
The advantage of px is that it scales along with all the other page elements... most of which are also defined using px (images, divs, tables, etc).
(edited by: papabaer at 7:20 pm (utc) on May 21, 2002)
Can anyone explain what em units designate?
A character that is the size of an "m", so usually "ems" are used as a measure of spacing (as in em-dash, em-space). Printers also use "ens" as a unit of measure.
As for other measures, there are advantages/disadvantages. Warning - I'm not a design person. Anyway...
Points are a printers measure - basically 72 points per inch
PCs typically render at 96 pixels per inch, while Macs render at 72 pixels per inch.
If you're good at math, you have noticed that this means that pixels = points *at the default resolution* on a typical Mac, whereas that will not be true for a PC.
Most people say that pixels give you better control than points on a CRT, though depending on user settings, everything can change from one screen to another, even with identical hardware and software, just based on what the user settings are.
The main disadvantage of absolute font sizes (points or pixels), is that you exclude visually impaired users from your site. Create a page with no font size set and then in IE select View ¦ Text size ¦ and change it. The text should change in size. With absolute fonts, this won't happen. Strictly speaking, this is *illegal* if you you are based in the US and receive federal money (at my university, if you want a university domain, you must not use fixed fonts because it is a public institution).
Designers love fixed fonts because they want to force everyone to see their site exactly as it looks in their vision. IMO this violates basic principles of web accessibility, usability and portability. It's also a quixotic task, since you can never know whether you have some crazy user is going to run his 15" CRT at 1200x1600.
Of course, this could all be wrong. I would suggest reading some of the articles on typography at A List Apart (and note that the recent articles have a different take than some of the older ones that still recommended pixel-sized fonts).
Cheers,
Tom
Tom
I had always thought that PCs were 72ppi and Macs were 96ppi.
Great post!
It does get confusing when discussing units of measure.
px is technically a "relative" unit since it scales "relatively" with the resolution of the viewing device.
pt however is an "absolute" unit of measure.
Relative
em: font-size is relevant to the parent element font- size
ex: font height relevant to the parent element font- size. ex is determined by the x-height or height of the lowercase "x".
px: font-size relative to the resolution of the viewing device.
Absolute
in: inches -- 1 inch is equal to 2.54 centimeters.
cm: centimeters
mm: millimeters
pt: points -- the points used by CSS2 are equal to 1/72th of an inch.
pc: picas -- 1 pica is equal to 12 points.
You are correct when you point out that font-size should be left to the user's preference.
IE will not allow a user to increase the font display size of a page using px, Mozilla and NS6 will however through TEXT ZOOM. Opera does it best with the "everything" ZOOM, which as implied, zooms the entire content of a page while retaining element alignment.
The web is a flexible, liquid [medium] and I'd argue against trying to exercise a print media type control.
Is this an opinion or a generally accepted concept?
I here so many comments about too many people being stuck in their print fixed mentality. The Web is fluid.
;)
any hoo, I would like to create more liquid pages, I understand the theory behind it but I am rusty on some CSS, thus the question.
Frankly, I have 2 jobs and run freelance web design on the side and I have 4 children, so my pages are only as liquid as my clients are willing to pay for them. I have a learning curve right now with CSS so creating anything new requires time and we all know that TIME=$$.
Maybe the wrong attitude, and it is contrary to my beliefs as I am a people pleaser, but I have limited time and resources.
I would like to thank all here at Webmaster World for helping me conserve some of my resources. I hope to contribute more than I request.
Is this an opinion or a generally accepted concept?
Fact.
People access pages in all kinds of ways on all kind of media, I'd say it was pretty flexible ;)
im sure pageoneresults will remember it, due to the fact he covered much of the issue himself :) cant find the thread though, is def nearby if someone would be so kind to find it.
I hope to contribute more than I request.
pcguru333, asking the right questions is the most important process of problem solving. Both questions AND answers are very important components of a good discussion.
Good questions.... are GOOD! ;)
The important thing here is that we are going to come to the realization the it's not just a "standard web-broswer" world anymore. Web-enabled cell phones, PDA's and more.... It's a good wake-up call to be sure.
An artist wants to control every aspect of the presentation - if a couple of elements change their relationship (as might well happen in a fluid layout), the "perfection" of the design would be ruined. Indeed, artists and graphic designers may spend hours playing with fonts, sizes, and positions to get everything just right.
For information delivery, though, it doesn't really matter if a headline spills onto a second line or if the user likes extra-large text - a fluid layout is fine.
In the print world, artists and copywriters can coexist since the final product can be reviewed, revised, etc. until everyone (or at least the boss) is happy. In the web world, things are a lot less certain - hence the tension between the fixed & fluid camps.
I don't think there's a "right" answer to fixed vs. fluid question. Even pure info delivery sites have some fixed elements (like the WMW logo in the upper left). And artistic sites (e.g., architecture & design firms) will continue to keep almost everything firmly fixed. Most of us will probably fall somewhere in the middle - fluid text blocks with a variety of fixed elements to create a consistent and pleasing design.
px is technically a "relative" unit since it scales "relatively" with the resolution of the viewing device.
-- Papabaer
My mistake. I think the general point is correct in that it is "fixed" at a given resolution and closes out visually impaired users.
whole fixed vs. fluid debate
One thing about the web is that almost every rule (no frames, tables for data only....) has exceptions. The important thing, in my opinion, is to start from good principles of usability and then, with full (or at least some!) knowledge of those principles, you can decide that your site is an exception, but you should have good reason. If your site is a portfolio of your video editing skills which you are selling only to people with T1 lines, clearly you will have a lot of pages that are over 40KB, maybe even over 40MB. I think even Jakob Nielsen could accept that (though he might say the web is not yet ready for that).
asking the right questions
Indeed! I don't ask many questions, but I sure learn a lot here. I wouldn't learn anything of people didn't have questions.
Tom
ergophobe, you are certainly correct from a practical viewpoint. "Relative" is a matter of perspective... relatively speaking! ;)
Without a doubt we all face a sort of "balancing act" in trying to achieve an optimal design for our target audience as well as the general surfer.
It's all too easy to get trapped into a single perspective and overlook the diversity that the comprises the population of the Web.
Even when we strive to provide scalable fonts and liquid designs, do we also consider those using screen readers? What about navigation for those using pointing devices or keyboards? Are our menus easy to navigate? Or do they require multiple flyout layers or scrolling dropdown menus to locate a page?
I know I am guilty of some of these things... though not for much longer. "Changes are a comin'."
fixed size design is not a matter of art...it is a matter of graphic design...you'll find a lot of the serious artists using the web as a medium (as opposed to those simply using it to sell their work in other media) are creating very flexible designs...largely perhaps because they tend to be conceptual artists and interested in doing more with the web than making a pretty picture on their own monitor
the simple fact is that you can't fully control the way a site is displayed...so the choice is to make a site that bends or make a site that breaks...I choose the former
I have yet to see a single convincing reason why fixed size designs have any inherent advantage over flexible designs...all the reasons I have heard basically boil down to "I am used to making a static visual design, I am not used to a dynamic medium"
I am one of the many people who has difficulty with sites using a small px font size...I am diabetic and my eyesight can vary significantly from hour to hour...sometimes I have to dramatically increase my default sizes...this makes a number of badly designed sites become completely unusable...I often have no way of using the site until my sight returns to normal
My personal and rather unbending view of this is simple:
Build for the medium, flexibility is not a weakeness it is a strength.
Or....
just stick all your text and images in a 600px wide table, break out the <font> tags and pretend it's 1996
hehehe ;)
Nick
