Monday, April 25, 2011

The Web Standards

Image: Frank-the-mouse glues a poster to a wall using a long-handled paint roller. The poster is divided like a web page layout, each area of the layout contains a sample of the HTML code to generate it.
Two weeks ago, I got a commission to design a website.
What? you do that too?
Oh, hush up.

I learned to do web pages back in the year 2000, when everyone thought frames and Flash™ would rule the web. The only other widely-known method to structure a web page was putting all the text in a table, and using its columns to put your stuff where you wanted it to be.

In January 2009, in one of my courses, we were assigned to create a website as part of a project, and asked to make sure the website was compliant with the web standards. This was the first time I had ever heard there was such a thing!

HTML, the code in which web pages are written, has been standardized since 1997 (prior to that, there was the IETF specification, and then the so-called "features" each browser "offered" to web-designers). In fact, many of the code snippets I had learned as "that's just the way things are represented" (such as <font color=red> to make the text appear red), were so because that's how the standard defined them.

This first standard, which was the one I knew, was finally superseeded in 2001. The W3C, who developed it, gave a transition period during which the old standard could still be used. That transition period is long gone now. Seeing that I had to make a website, and there was a new standard, I took my time to read it. It was the first time I read it, since the website assignment was a group project and my group had assigned me to do something else during that time.

The new standard

But what I discovered was nothing short of horrifying. Everything I knew had been outlawed.
Frames, designing with tables, even the use of the font tag to change the text's color, Everything!
Hey, you said you wouldn't play with vertical space anymore!
And so I did. Sorr– wait, didn't I tell you to hush up?

Styles are preferred, says the W3C, referring, of course to Cascading Style Sheets, which were nothing more than a dream when I learned how to make web pages.
You've been making web pages for eleven years without using Style Sheets?!? How did you survive?
I said, hush up!

So there I was, this big commission sitting before me, and I needed to re-learn how to make web pages to fulfill it. Turns out, there is also a standard for Style Sheets, but that one held no surprises for me, since I was oblivious to what the CSS-code was like before.

What really got me was the third standard.

The Official Accessibility Guidelines

Hand-drawing of a white mouse wearing dark glasses and holding a modern blind man's cane. He appears to be on his hind legs, turning back to face some disturbance behind him.
I always thought I did a rather good job of preserving accessibility. After all, I add alt text to all my images and color most things so that they still look decent in black and white. Accessibility, by definition, is meant to remain hidden, though ever since I sneakily started to copy the alt text into the title text, I've called attention to it and allowed the non-visually-impaired to read it.

Unfortunately, this is not enough for the W3C. Their accessibility standards (which they call guidelines) at first seems like a list of ludicrous demands. For instance, they require that quotation marks not be used for quoting people nor for writing dialogues. Instead, they ask that a special HTML tag, <q>, be used. They also ask that if a word is italicized to indicate that when read aloud it should be emphasized, rather than italics, an emphasis tag should be used.

Of course, when you think about it, it does make sense. Italics can denote either emphasis, the title of a book, or a phrase in another language (which also has a special HTML code now). Quotation marks can denote someone else speaking, something someone else said, or sarcasm. When a visually-impaired person sees a webpage, it is usually with the help of a screen-reader, which reads the page aloud. Knowing when to emphasize, and when to go to another voice (including a voice in another language) should vastly improve the readings. And giving quotation marks a tag allows people to do things like this:
<q lang="fr">Sacre bleu!</q> cried the frenchman.
Which would result in the screen reader reading Sacre bleu in perfect French, and cried the frenchman in perfect English.

So, although they are reasonable, this last standard is, for the most part, unenforcible. There are about a trillion webpages out there. Reviewing every quotation mark, every italicized statement, every color change, seems all but impossible.

I didn't keep to everything in the accessibility standard while I did my commission, but I did do so while writing this post. This empowers me to rightfully display the following logo:


  1. Ironically, I can't display the verification logo for HTML code, since I have my links to external pages opening in new tabs, and that's also forbidden by the new standard.

  2. If all the popular browsers displayed things correctly and without variation, website design would be a whole lot easier and less frustrating.