11 re: Printing size

Yes, a print style sheet should use pts. to specify its font sizes.

posted at 03:44 pm on January 9, 2004 by apartness

12 using ems for elastic sites

I recently redesigned a site using em’s as the basis of the site layout. It seems like it worked out fairly well. Instead of using a percentage as the base font-size, however, I used a pixel size.

Thanks for the informative article. It gave me some more stuff to go on and let me know that my design decisions on the layout were on the right track.

posted at 06:27 pm on January 9, 2004 by rick

13 elasticity can be useful

Like Dris and rick, I did something very like Patrick’s elastic layout for a redesign last year (http://www.nthposition.com/). Judging from user reactions, it is a very useful method for a site that has a heavy reliance on large bodies of text that necessarily have to be easy to read at just the size the user wants.

It certainly cut down on the copious “I don’t like your fontsize/linelength/font” feedback that had been a drawback of the previous (fixed) design.

Thanks for the article, I think it’s really good to have a definition of a third option to throw in to the ever-challenging fixed v fluid debate.

posted at 03:32 am on January 10, 2004 by Markus

14 Great article, thankyou.

That’s an excellent and well written summary of stuff I’d read elsewhere but hadn’t quite grasped the reason for doing. This is far and away the best article I’ve read on ala since the latest re-design.

I shall certainly be revisiting all my ems based stylesheets…

posted at 05:18 am on January 10, 2004 by Adrian Simmons

15 From the CSS file:

(How are you achieving that :hover effect on your links on that CSSZenGarden design you linked in the article?)

a { color: #fe6; background: url(underline1light.gif) bottom repeat-x; text-decoration: none;
}

a:hover { background-image: url(underline2light.gif); }

I’m guessing the background image in the hover is an animated gif.

posted at 06:32 am on January 10, 2004 by Robert

16 shift the onus to the browser?

Any comments about pressuring the browser makers to provide proper accessibility tools, such as Opera’s page zoom? I do think that designers have their plate full, and it seems to me this issue is best handled by the user agent, using its wonderful system-level programming. It’s a little crazy that web content developers have to hack their way through this.

If Opera can do it, the others can too.

posted at 11:19 am on January 10, 2004 by chris

17 Totally agree

Great article. After reading Zeldman’s excellent book recently, I disagreed on one point: font sizes. I’ve used the percent-base + rest-em method for a while on different sites now with nothing but good response.

For some reason I have’nt visited the HTML Dog site before reading this article – a diamond of a resource!

(Btw, I’m a grandmaster noobster on blogging, so don’t expect much valuable content om my site if you happen to visit it :)

Cheers!

posted at 01:57 pm on January 10, 2004 by Kenneth Solberg

18 Let the users in control

A)
I think the bigger issue about large resolutions is not too-wide-text lines, but rather really small text sizes.

If the line length is too long on a fluid or ‘relative’ layout, the window can be resized to acomodate the user. The problem’s cause here is that many users always have their browsers’ windows maximized, but it’s a solvable problem.

On the other hand, if the text is too small and the size is specified in pixels (or other fixed unit), then there is no way to change the text size (at least in some browsers).

B)
Marcel (and others), you say you want your site to look good at all times, then think about text resizing as taking a sheet of paper closer or farther to look at it comfortably. And also: if people aren’t comfortable reading your content (however beautiful it may be), they may not come back.

C)
If a designer is afraid that their users don’t know that they can change the text size in their browser, then educate them. Add a note on a help page, at the top of each page, on the FAQ, whereever.

D)
Isn’t em a width unit and ex an height unit? Just asking.

posted at 03:05 pm on January 10, 2004 by curobosqui

19 Resizing images

I’m impressed by the way images can also be resized with ems, not just text. Hence the layout can be preserved. But stop. Is enlarging an image the way to go? Let’s think:

1) The image becomes blurry – users might not find it as pleasing, or think you can’t use good images.

2) People who have trouble reading small text will – in theory – also have trouble with fine detail in small images. Therefore to enlarge them could be an excellent idea.

3) Although Opera enlarges images as well as text, sometimes the result is messy. There is also an option in the Preferences to “Smooth zooming of images”. I think it’s off by default.

Jeffrey Zeldman once posted a link to a page that used a background image covered by an adjacent column. On large screens you were able to see more of the image. But on smaller screens you missed out on the detail covered up. Plus there was no way of knowing that there was more detail to see.

A great example using JavaScript to resize the whole layout can be seen on the Smoking Gun code demos:

http://www.smokinggun.com/code/scale.php

Certainly an interesting area. A good article. Thanks ALA.

posted at 03:36 pm on January 10, 2004 by Chris Hester

20 max-* in IE

There is a workaround for the max/min- CSS properties bug in IE. Using JavaScript expressions inside your style-sheet, you can simulate what other browsers support natively:

http://www.svendtofte.com/code/max_width_in_ie/

I haven’t test whether or not the code works when JavaScript is disabled, since the code goes into the CSS rather than a seperate .JS file (or inline or whatever.)

posted at 05:40 pm on January 10, 2004 by Conan