Skip to: Navigation | Content | Sidebar | Footer


Weblog Entry

Dissidence

July 27, 2004

François Briatte has compiled a rather large-ish survey comparing 10 web sites selected from his daily reads. The findings are interesting from a statistical point of view, but more so because of the various dissidence from the perceived ‘norm’.

After François emailed those of us he had surveyed, it was suggested that it might prove even more interesting to have us each explain our personal reasons for each of our own results. While some of the 25 questions asked feel a little arbitrary, and I could probably think of 25 more equally valid questions, the questions asked cover enough ground that it serves as a perfect starting point for this type of discussion.

So to each question a reason for differing if applicable, and general commentary if not.

Are links underlined? (80% do) (I do)

Though Nielsen recently embraced colours beyond blue for links, he still says they should be underlined. This is a generally sound principle; I still get frustrated trying to click on non-linked underlined text, so it’s ingrained at this point. Underlining links is an easy usability win.

However, there are situations where underlines are problematic; in a text-dense page where every third word is a link, they only contribute to the clutter. Situations like these may call for a re-thinking of the way the information is being presented, but sometimes it makes more sense to turn off underlining. It all depends on the context.

Are hovered links underlined? (80% do) (I don’t)

François is mistaken in my result on this particular point — I don’t leave underlines on hovered links. Since I highlight the whole thing with a background color, leaving them on didn’t make much sense or look too hot.

Though it doesn’t make much sense to me to turn off the underline on hover in most cases, a change of some sort is a good thing to indicate the link is clickable. This is safely a stylistic matter, so it feels like one of the more arbitrary questions.

Do visited links differentiate? (80% do) (I do)
Common knowledge says that visited links should be visually different than “fresh” links. There are situations where this isn’t applicable (web applications don’t require them, and in some cases are even detrimental to the usability of the application) but for the regular, content- and document-based web, it’s a must.
Is the layout in fixed width? (60% do) (I don’t)

Interesting that the survey was done now, as I recently went from a fixed-width design to a liquid layout (and other sites surveyed did the opposite). 60% is close enough to half, so the opinion is still clearly divided.

One of these days I’ll get around to writing the big “Defense of Fixed Width” article I’ve been meaning to do for ages.

Is there a search box on the page? (50% split) (I don’t)
This is another must. Content-driven sites must have search, end of question. That I don’t is inexcusable, and explained only by this: it’s on the list of things to do. (But then, it’s been on there for ages, so that’s no indication of when it will materialize)
Is there a right sidebar? (70% do) (I do)

The left side of a page is a more important area (for Westerners anyway) since we read left to right. Left is seen as dominant, right as diminutive. The content of this site is placed front and center, the incidentals and etcetera are placed on the right.

Is there a left sidebar? (90% don’t) (I don’t)
It’s not a three-column layout, so I don’t have a need for a second sidebar.
Is there a top clickable logo? (100% do) (I do)
The clickable logo leading back to the home page is more or less expected these days. No reason to break the mold, although I realize this site’s current design has a pretty sketchy definition of ‘clickable area’.
Is there a repetitive footer? (100% do) (I do)
‘Repetitive’ seems to be an unqualified term; it appears the goal was simply establishing if footers were used in web design. Everyone has one, so there’s not much more to take away from this question than a simple, “yes, they’re used in web design.”
Is the main text on white background? (80% do) (I do)

I recently changed from a blue background, so this is a matter of timing. A coloured background is far more compelling, but white is more practical.

Not only does black text on a white background offer maximum contrast, but working with imagery is easier in the long run. Placing images with transparency means dithering to a specific colour, and when the redesign occurs two months, six months, three years down the road, you’re stuck with legacy images that you either retire or spend time and money converting to the new colour.

While it’s possible to avoid the issue by using only boxy and framed images, it’s usually a better strategy (though more boring) to stick to the white that 90% of the web uses already anyway.

Is the main text sans-serif? (90% do) (I do)

Sans-serif is easier to read on-screen. Serifs are subtle, high-resolution letterform hints that emphasize the difference between each letter for better legibility and faster reading. It’s impossible to adequately express the subtlety in pixels, which makes on-screen serifs clunky and harder to read. Sans-serif is the only choice short of 24px body copy or 200dpi displays, neither of which I’m planning on designing for in the near future.

Is the DOCTYPE Strict? (60% do) (I do)
There are reasons for choosing HTML over XHTML, most of which are part of a pedantic debate that will inevitably flare up in the comments. (It always does.) The question, though, is regardless of which you choose, are you using the Strict or Transitional DOCTYPE? Since Strict further encourages the separation of structure and presentation (XHTML Transitional is loaded with presentational elements) I chose it.
Do they use accesskeys? (80% don’t) (I don’t)
I’ve already documented my reasons against using accesskeys. I’ve started to reconsider, not in light of the advantages they offer those they were meant for, but because I can potentially see them as a usability enhancement for everyone else. Which feels like the wrong reason to implement them, thus explaining why I haven’t yet.
Do they use ‘Steal these’ buttons? (80% don’t) (I don’t)
Ugh. Please, no.
Is there a header graphic? (70% do) (I do)
It’s a pretty obvious way of branding a site. Not to say it’s the only way, as Jon Hicks has a well-distinguished visual identity but no header. It works for me.
Is the copyright explicit? (90% do) (I do)

I used to have a Creative Commons license on this site, but in dealing with Zen Garden theft I’ve come to the conclusion that Creative Commons still leaves too many holes open. These aren’t merely ‘he took my work, I wish he wouldn’t’ issues, these are liability issues that I believe too dangerous to be left unresolved.

So the license was changed to an ‘All Rights Reserved’ copyright notice. This isn’t to say I’m a lawsuit-wielding, pissed off creative type who’ll sue the pants off anyone so much as sampling my colour scheme; I’ve had many requests for sharing my work, and 95% of the time I happily allow it. But there’s the crux — Creative Commons doesn’t allow enough of the control I’d like to retain over who gets to use my work, or more importantly, who doesn’t. So a restrictive copyright it is.

Is the designer’s full name present? (80% do) (I do)
An interesting query, and one that gets overlooked too often. I like knowing who I’m reading. I hit ‘about’ pages almost as soon as I stumble across a new site. There are obviously valid concerns over snap judgements, which is why some people won’t talk about themselves; but for every one visitor who turns away because of something they don’t like about your profile, I’d wager five more turn away because they don’t take an anonymous voice as seriously.
Is there a print style sheet? (60% do) (I do)
I get email when I make a change to the site that I don’t account for in the print style sheet; the redesign, for example, added extra text needlessly to the first full printed page. Which goes to show that people print this site, which means a print style sheet is a must.
Does the navigation bar use image rollovers? (60% do) (I do)
I suppose this option was included because you can’t resize image-based text. Well, I thought of that, which is why Proton has a ‘large fonts’ version that doubles the size of the header navigation text. Problem solved?
Is the page UTF-8 encoded? (60% do) (I do)
I wrote up my Unicode experiences almost a year ago. UTF-8 just makes it easier, provided every piece of software along the way that’s going to be handling the data supports it.
Is the page XHTML? (70% do) (I do)
Again with the HTML/XHTML issue. Google “xhtml mime types” if you don’t know what I’m talking about.
Is there a XML prolog? (100% don’t) (I don’t)
It’s optional, but it throws IE6 into quirks mode. Therefore, we exclude it.
Are quotes educated? (80% do) (I do)

Using inch marks instead of curly quotes is the product of technological limitations. They’re a hack. Now that we have the ability, curly quotes — “ ” etc. — are the way to go.

Not to say that’s it’s just that easy. If you enable John Gruber’s SmartyPants in Movable Type, you must also un-do them for users who comment, quoting snippets of ‘educated’ text. Otherwise a mess of garbled Unicode will make you regret installing the plug-in.

WordPress handles the proper character encoding automatically, but other systems might not. Fixing them to do so requires a working knowledge of regular expressions, which also raises the bar significantly.

Is there a 404 page? (60% do) (I do)

Though I wouldn’t call mine perfect, it does more than a stock “Error 404” page. My main problem until this afternoon was that it would bounce you to a special error page, overwrite whatever was in the address bar, and prevent you from re-trying a new URL without typing the whole thing all over again.

No more though! It’s an easy fix, and I’m surprised I haven’t done it sooner. In my .htaccess file, the line that previously went:

ErrorDocument 404 http://www.mezzoblue.com/errors/404/

Now goes:

ErrorDocument 404 /errors/404/

…and all is right in the world.

Is there more than 6 navigation elements? (90% don’t) (I don’t)

Though my continual IA re-thinking has me up to 6 at the moment, they aren’t represented on the site yet. The lower, the better, or so the classic thinking goes. Don’t present too much choice to the user. Any more than 7 items and you have an IA problem.

Except that the trend seems to be wondering aloud whether broad and shallow categories might be better. Amazon was long a model for having just too many items. eBay until recently was an overload of too much choice. Interestingly, I’ve noticed both are looking a little more restrained these days. I guess the debate continues.

There, wasn’t that a lot more fun than talking about validation again? Thanks for the survey François, and more so for touching on a wide variety of practices. The questions bring to light some issues that we haven’t been talking about enough.


Reader Comments

July 27, 02h

Hmm, I didn’t know that 404 declaration was any different. Thanks, Dave, the little tidbits I glean off this site was well worth the read!

The thing I struggle with is that, since I am building a new personal site, should we conform to these? Is creativity stiffled when a list or study like this discussion is produced? I want my site to be as usable and useful as the 10 described in this discussion, but at the same time, I want to make my own name, present new ideas, and possibly, break new grounds in areas not thought to be travelable.

I guess what I’m saying is that we shouldn’t be looking at stats of who chooses which layouts, but how these different, yet similar layouts overcome real usability issues.

I hope my new site is more usable and more useful in general than the last, but at the same time, am I really any better then any shmoo who builds a blog using one of blogger’s new templates if I follow the pack?

Dave W. says:
July 27, 02h

When I was reading his survey, I kept thinking to myself, “yeah, thats obvious, I knew that” for most of the layout stuff. I even tell my clients sometimes that, “certain design elements are the way they are because they make the most sense from a usability standpoint.” I don’t think it is as much guru leaders causing it as simply the way humans reading western text work. This has nothing to do with the fact that Zeldman does it, or Tantek doesn’t. In my opinion he is trying to read too much into his stats (which could very easily fall prey to a sample error).
Another issue I have is the selection of sites. They are all ‘blog sites, and are all people who use these sites for experimentation. Is it just me or would that cloud the results? I know my personal site does not reflect newer design practices because I’ve been too busy doing these on client sites to spend any time on my personal site (sliding doors, FIR, CSS filters, so on…).
I think if he had a larger selection of sites he would have found much more consistent statistics, and would not have attributed the cause to “guru leadership” as much as he did. Not that I’m saying the gurus don’t lead, its just that they lead because they use logic and research to do the things they do (except for graphics of course) instead of just on a whim.

Dave S. says:
July 27, 02h

> Is creativity stiffled when a list or study like this discussion
> is produced?

I would hope not! Just because 7 out of 10 web designers recommend Crest doesn’t mean you need to start brushing with it too; there’s a lot of other toothpaste out there. Some of it is bound to work better.

> I guess what I’m saying is that we shouldn’t be looking at
> stats of who chooses which layouts, but how these
> different, yet similar layouts overcome real usability issues.

That is all that should be taken from this survey, I believe. Taking it too seriously would be a mistake, as there are obvious statistical flaws that wouldn’t hold up to close scrutiny.

It’s a nice look at the trends, with a lot of detail work, but nothing that could be considered a rulebook.

> I don’t think it is as much guru leaders causing it as simply
> the way humans reading western text work.

Believe me, neither do I. I’m looking to the other nine people on that list for guidance just as much as you are. We all publish personal sites for the sake of collaborating and learning from each others experience.

> Is it just me or would that cloud the results?

Sampling personal sites is only going to give you trends about the personal sites of web designers; it doesn’t really say much about the Amazons and eBays of the web.

At the same time, since those 10 sites surveyed are all doing things that have gained them some notoreity, they’re in a position to have a lot of feedback from everyone else that might eventually filter down to the site. My design skills of today take into account a lot of the email I’ve received over the past year.

July 27, 03h

“Are links underlined? (80% do) (I do)”

No you dont :) - you seem to be using the browser’s default setting.

5
Faruk Ates says:
July 27, 03h

Dave S.: “Is there a XML prolog? (100% don’t) (I don’t)
It’s optional, but it throws IE6 into quirks mode. Therefore, we exclude it.”

Last I checked, IE (any version) offers to download the file for you (to store locally) when it encounters an XML prolog on an XHTML page. Am I seeing things now, or what? :(

Hemal says:
July 27, 04h

dang it! i recently started learning css yesterday, after i saw zen garden. i was very excited, i tried making 2 layouts, and they look nothing like i expect them to be. i see these awesome colored layouts that i know i can make on html, but i wanna learn on css, and its making me crazyyyyyyyyyyy!!

ps: does anyone know a good site hits tracker? like extreme-dm, but another one?

July 27, 08h

Faruk Ates, IE offers the save dialog when the document is served as application/xhtml+xml, it has nothing to do with whether or not the XML prologue is included. That is because IE does not support XHTML, and treats it as tag soup when served as text/html.

The XML prologue is optional, and does send IE into quirks mode; and when it’s used in a document served as text/html, it’s fairly useless since the document is not processed as XML, so it is ignored.

When served correctly as application/xhtml+xml, it must be inlcuded when the character encoding is not UTF-8 or UTF-16, but even then it is better to include it so that the document is fully self describing, and does not depend on a content-type header to set the charset.

J. King says:
July 27, 08h

If I were to answer the survey questions for my Web log, a lot of the answers would be conditional (or will be very soon with the new version going live in a day or so).

Does it use XHTML? Yes. If the client prefers it.
Does it have an XML prolog? Yes. In XHTML documents.
Does it use serif fonts? Yes. If it’s the user default.
Are links underlined? Yes. If it’s the user default.
Fixed width? Well, it has a fixed max-width…
Are there more than six navigation links? Sometimes, but they’re all internal and duplicated with <link> elements.

The survey would be totally inadequate to qualify my Web log, that much is pretty apparent. Surveys asking such polarised questions are, at least to me, somewhat suspect.

Anne says:
July 27, 10h

Why would you use the XML Prolog or any other way of setting the charset except through HTTP (even that isn’t necessary)? The default charset for XML and ‘application/xml’|’application/xhtml+xml’ is UTF-8. Both on- and offline.

Dave Shea, I think you fixed your character encoding problems, since the preview page now uses the same charset as the post page. Some time ago, when you used the MovableType CGI file, this was not the case. It used the ‘ISO-8859-1’ charset where all your other pages, including the comment input form, where encoded in UTF-8.

July 28, 03h

“Is the main text sans-serif? (90% do) (I do)”

Firstly, I feel that this whole survey is flawed, because only 10 sites were looked at. To get any kind of sensible result, considering the billions of web pages out there, I’d have thought 100 sites would give you a better result. What if only 10 news sites were checked? Or 10 design sites?

Hence I don’t think 90% of sites use sans-serif. I see a lot that use serif fonts, mine included.

“Sans-serif is the only choice short of 24px body copy or 200dpi displays, neither of which I’m planning on designing for in the near future.”

I’m not so sure. Fonts like Times and Georgia work very well at sizes as small as you’d take Arial or Verdana. Plus they have a classy feel. I get sick of too much sans-serif on white.

I agree that sans-serif is faster to read (but then why are novels often set in serif typefaces?). However this becomes less an issue on monitors with anti-aliasing font-smoothing set for all text. (OK, so it only works well on high-res monitors for Windows, or lower-res OS X on Macs.) Of course when those 200dpi screens become cheaper, things could change again! But I wouldn’t wait till then to use serif fonts at less than 24px (which is only suitable for headers of course).

July 28, 03h

I just noticed that visited links on this page *don’t* have underlining. Oops. (I’m using Opera 7.53 on XP.) Also when you post a message, it takes you back to the article, but the link from there to see the comments gives an error page. (The address shows “preview.php”.)

July 28, 03h

One thing about the curly quotes.

A while ago my dad got a new Web-enabled cellphone (I know, I should find out the make/model to share my results with the rest of the class). I went to test my site on his cellphone (to see that my CSS-layout degraded nicely), and everything worked fine except for the curly quotes. They didn’t show up at all (or, as this last sentence would be read on his cellphone: “They didnt show up at all”). I still use curly quotes, but I think I need to do more testing.

Kevin says:
July 28, 05h

I find two clear problems with this survey. First, all the sites are blog-style sites, which are all built on the same formula to begin with. Second, he only looked at ten sites. This “survey” would have been far more interesting if it had been more comprehensive in either direction — either more blogs if that’s what he’s interested in (and there are thousands to look at), or a wider variety of sites (maybe corporate, entertainment, educational, government, etc).

This just comes off as a limited list of arbitrary and unfocused set of “questions” to see what the cool kids are doing right now.

Rachel C says:
July 28, 07h

“Some more or less obvious facts were proven using statistical data;”

Statistically speaking, it would be unwise to try and infer too much from this “survey” of only 10 sites which have been self-selected and aren’t necessarily representative of what web designers/bloggers think/do. All that has been “proven” is limited to the 10 sites that were analysed.

July 28, 07h

“I agree that sans-serif is faster to read (but then why are novels often set in serif typefaces?).”

Chris Hester, as Dave explained, serifed fonts are easier to read in print because they aren’t limited by pixel positions. If pixels weren’t an issue, serifed fonts would still be premier on the screen due to the normalization of space between the letters.

ChrisR says:
July 28, 08h

Is there more than 6 navigation elements?
UIE has some good research showing that the amount of information on a nav or a page isn’t so important. What’s most important is that the information is relevant to the user, uses their language, and has the “scent” of what they are looking for. Ditto on long pages of content. It doesn’t matter how long it is, as long as it what the user wants. And ditto again on the number of clicks it takes to get to content. If users are picking up on scent they will click and click until they get to what they want. Perceived speed of page downloads is also based on whether the user thinks they are on on the right track or not. If they feel that the content is not relevant then they perceive the page download time as longer and more frustrating. You get the picture. :)

July 28, 10h

“Serifs are subtle, high-resolution letterform hints that emphasize the difference between each letter for better legibility and faster reading. It’s impossible to adequately express the subtlety in pixels, which makes on-screen serifs clunky and harder to read.”

They look great with ClearType anti-aliasing on LCD panels…


~Grauw

18
Rachel says:
July 29, 01h

As someone who is a statistician, I did think before I posted thank you very much. I’m just stating that one needs to be careful about the use of saying you’re proving something using statistics.

pid says:
July 29, 02h

fer gawds sake.
Is there a way of making people pause and reflect before they post a comment?

I can’t find a statement anywhere that says this is a comprehensive survey of the internet. Dave’s even pointed it out already.

~25% of commentors don’t think before they post, <20%’s own websites don’t validate, and 100% of Anne Vankesteren’s always comment about XHTML content type declarations. Please, be positive or negative, but don’t just dismiss it.

The survey *is* valid and *is* interesting, as it delivers compiled information that we did not have before. Given that most of the owners are advocates of standards, or usability, etc, it’s interesting to see which things they all agree on.

For me, the surprise is that Doug Bowman is the least dissident, as I’d consider him to be one of the most ‘creative’ on the list. Maybe it shows just how annoyingly talented this guy is.

phnk says:
July 29, 04h

Three of the comments here (and more elsewhere) I had predicted when writing the survey :

“Firstly, I feel that this whole survey is flawed, because only 10 sites were looked at. (…) Hence I don’t think 90% of sites use sans-serif. I see a lot that use serif fonts, mine included.”

An identical comment :

“First, all the sites are blog-style sites, which are all built on the same formula to begin with. Second, he only looked at ten sites.”

And another one :

“Statistically speaking, it would be unwise to try and infer too much from this “survey” of only 10 sites which have been self-selected and aren’t necessarily representative of what web designers/bloggers think/do.”

The problem is : people think their website is just as good at looking at than Zeldman’s. This is why my additional note about selecting targets is called : “Selecting targets: why those web sites (and not yours)?” (please do not overreact and read next paragraph before replying to this).

These 10 web sites were selected because they are influential in the world of web design. Read more about this here : http://phnk.com/design/survey/#selecting

A next version of the survey will nevertheless include more targets, because some commentators legitimately asked for it. But please, before posting :

- read what Eric Meyer says about this kind of critics you are providing us with;
- find me a statistical way to survey 100, 000 pages and not getting paid for it.

pid says:
July 29, 05h

‘archbishop-esque’
nice.

August 02, 09h

I only scanned the results of the survey, but read your explanation Dave. I thought that the points you made were very interesting. I was also glad to see that I’m not the only one who has a search function on my list of “things to do”. You also made me think of lots of things I need to review. Thanks for the heads up!

Overall I agree with everyone that the survey is a bit of a joke. 10 web sites out of who knows how many isn’t very considerable.

23
Stephen says:
August 05, 06h

As far as the curly quotes thing goes, I myself just use the q tag, unless it’s not like a cited quote.