A LIST Apart: For People Who Make Websites

No. 167

Discuss: Elastic Design

Pages

 1 2 3 >  Last »

1 True image scaling

First, great article. I have been covering the issue of liquid web design since about 1999 following Glenn’s theory and it’s good to see a twist to the method.

Also, perhaps consideration to emerging standards should be given. In specific SVG. We all know that this won’t work with photographs but the W3C has some pretty good examples of illustrated, line-drawn images that scale very well using SVG. Sure, mainstream adoption is quite a ways off for SVG, but something to consider for the future.

Another thing that is not covered in the article is an accessability feature of some browsers and OSs: zoom. I think what this Elastic Design accomplishes is quite simular to a zoom effect. Consider the demand for this type of design if the major browsers all supported the zoom accessibility feature.

posted at 08:54 am on January 9, 2004 by Nick Finck

2 Opera's Page Zoom

A reference to Opera existed in a previous version of the article. It is quite a good comparison – the difference being that this method can’t (currently) expand or contract background-images.

I don’t use Opera for anything other than testing, but those people I know who do do seem to like the page zoom functionality.

posted at 09:21 am on January 9, 2004 by Patrick Griffiths

3 Excellent Article, However...

Your article is well-done and helpful, and the area of text size is one that is very important to be left customizable to the user.

However, I take issue with your (and many other’s) general statement that “enforcing anything on a user is bad for usability and therefore detrimental to the success of the website.”

It is, in some areas, up to the designer, as a trained individual (hired, presumably, because he has skills that the end users don’t) to make and enforce design decisions for the end users.

This is not arrogance as a designer, but rather, confidence in the justification for there to be design as a paid, skilled occupation.

Again, text size is an appropriate place for end user customization, and this article is an admirable analysis of where we are, technologically, on the issue, but a blanket statement that designers should not be enforcing design decisions on a user maligns our occupation.

posted at 10:23 am on January 9, 2004 by Dave Bug

4 Zen Garden Design

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

Nice design, too, by the way. And yet another helpful article from ALA.

clap

seth

posted at 10:46 am on January 9, 2004 by Seth Thomas Rasmussen

5 em is not a character

> whereas an em is equivalent
> to the size of one character

No, it is not.

http://www.w3.org/TR/CSS21/syndata.html#length-units

“em: the ‘font-size’ of the relevant font”

I’ve been reading misconceptions about the em unit in print and online typography for nearly 20 years now. An em isn’t the width of an M or any other character. It is a unit equivalent to the point size (or other ‘font-size’), and it is a square with that dimension.

posted at 10:51 am on January 9, 2004 by Joe Clark

6 Re: em is not a character

Abolutely right. I was trying to keep things simple, but I should have worded it better.

posted at 10:57 am on January 9, 2004 by Patrick Griffiths

7 Re: em is not a character

Copy changed; thanks, Joe.

We snagged on that line while editing, but couldn’t think of a more precise formulation that wouldn’t require two paragraphs of explanation (thus breaking the flow).

Your comment helped us craft one.

posted at 11:38 am on January 9, 2004 by apartness

8 I'm with Dave Bug on this one

Enforcing the end user a bad thing? Look, if someone wants a bigger sized font than I decided, great! But some fonts I will set to a fixed size simply because I want the site to look good at all times.

Of course I can use all these tricks to make the site flexible, but trust me, the only ones that know you can resize text are programmers, webdevelopers, and the readers of ALA.

Basically, I think it’s nonsense to make your sites not only browser friendly, but also friendly for that .0001% of your visitors that want to resize their font. Windows has other tools for that called a “magnifying glass” ;)

Great article, though. I always enjoy reading others’ comments on these challenges. That doesn’t mean I agree with all of it, fortunately.

posted at 12:25 pm on January 9, 2004 by Marcel

9 Elastic Layout

I did a design for a personal friend’s blog (http://tkfast.webhop.org/, some aspects of which are somewhat broken, so bear with me), and decided to take some liberties and experiment. I used the same em technique listed in this article.

The end result is nice, however those with small screens who just want the text resized (such as older folks using legacy computers, a fairly frequent case) will be in a bad situation. Perhaps, if this design technique becomes prevalent, the future will offer separate techniques for layout zoom and text zoom. We’ll have to see. I’ll be checking out the page zoom in Opera, just to see what they have going.

Great article though, and very timely. I like the ideas on image scaling. Web design is a constantly evolving trade, and this article really portrays that.

posted at 12:43 pm on January 9, 2004 by Dris

10 Printing size

One aspect I’m interested in is the impact of elastic font sizes on printing.

If a user has their resolution cranked up to 2048×1536, has an appropriate font size set, then is this going to work well when printed?

Perhaps the print style sheet should use fixed width fonts?

posted at 01:20 pm on January 9, 2004 by crutons.com

Pages

 1 2 3 >  Last »

Discussion Closed

New comments are not being accepted, but you are welcome to explore what people said before we closed the door.

Got something to say?

Discuss this article. We reserve the right to delete flames, trolls, and wood nymphs.

Create a new account or sign in below if you’d like to leave a comment.

Remember me

Forgot your password?

Subscribe to this article's comments: RSS (what’s this?)