jump to navigation

Why Ian Hickson is wrong about br and p tags September 11, 2008

Posted by Michael Kowalski in coding, user interface, work.

There’s an interesting and informative interview with Ian Hickson on TechRepublic where he talks about HTML5 and its growing pains. But there is one thing he says that I don’t agree with:

Most of the “gotchas” in HTML5 are things that we’ve inherited from the legacy of the Web. For example… the br element shouldn’t be used unless you’re writing something that really has a line break like a poem (generally people should be using p instead of br) 

The idea is that by using p tags you are supporting the semantic web by nicely delimiting paragraphs of content. It’s quite a widespread idea, and sounds like a good one. Except that most of the content on the web is written by ordinary, non-technical people typing into some kind of wysiwyg interface. 

So, when that person hits the carriage return key, how does the interface know whether they mean to end a paragraph or insert a line break? Hm, tricky. Probably the application doesn’t have a “poem mode” (and anyway, modes are bad).

In the past, I’ve seen CMS interfaces that tackled this dilemma by supplying different tools in the toolbar for para breaks and line breaks. No, really. Even WordPress, which by and large has a great UI, by default uses p tags. You can get a br tag by holding down the shift key while you type a carriage return. That’s right, you’re supposed to learn a special key combination to type a line break!

The thing is this: when a user hits the carriage return key, the user interface knows only one thing: that they have typed a line break. That’s all. We don’t know anything about their intent. We don’t know if they intend to close off a block of semantically related content. All we know is that they have typed a return. The appropriate thing to do, therefore, is insert a br tag.



1. lachlanhunt - September 12, 2008

Typing Enter for a paragraph and Shift+Enter for a line break is acceptable UI. (That is, in fact, how Microsoft Word behaves by default, although they set the default paragraph margins to 0, which makes it less noticable). Alternatively, converting 2 sequential line breaks into a paragraph is another possibility, and is generally what is done when converting plain text inputs into HTML.

But using two br elements for a paragraph break is wrong, both semantically and typographically. For readability, the spacing between 2 paragraphs should be less than the line-height.

2. Michael Kowalski - September 12, 2008

In what way is a magic key combination acceptable? It has no visible affordance in the interface at all! Microsoft Word may indeed follow this practice, but I wonder how many Word users even know about it?

You might be correct about typography (for whatever that’s worth, on the web; surely at least partly a matter of taste?), but you’re missing my point, which is that we don’t know that they are paragraphs! Inserting semantic markup tags does not mean your markup is semantically correct unless the markup actually reflects the author’s intention.

Leave a Reply

Please log in using one of these methods to post your comment:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out /  Change )

Google+ photo

You are commenting using your Google+ account. Log Out /  Change )

Twitter picture

You are commenting using your Twitter account. Log Out /  Change )

Facebook photo

You are commenting using your Facebook account. Log Out /  Change )


Connecting to %s

%d bloggers like this: