Refactoring HTML: Well-Formedness

By Elliotte Harold

Quote Attribute Value

Put quotes around all attribute values.


In XHTML, all attribute values are quoted, even those that dont contain whitespace.

Potential Trade-offs

Absolutely no browsers are in the least bit confused by a properly quoted attribute value.

This can add roughly two bytes per attribute value to the file size. If youre Google and are counting every byte on your home page because you serve gigabytes per second, this may matter. This should not concern anybody else.


Manually, all you have to do is type a single or double quote before and after the attribute value. For example, consider this start-tag:

You simply turn that into this:

Or this:

Theres no reason to prefer single or double quotes. Use whichever one you like. Mechanically, both Tidy and TagSoup will fill these quotes in for you. Its probably easiest to let them do the work.

Regular expressions are a little tricky because you also need to consider the case where theres whitespace around the equals sign. For instance, you dont just have to handle the preceding examples. You have to be ready for this:

And even this:

Finding the cases without whitespace is not too hard. This will do it:

However, the preceding code snippet will also find lots of false positives. For instance, it will find this tag because of item=15314 in the query string:

You may discover a few cases where the attribute value contained whitespace and was not quoted. Similarly, you may find a few places where the initial quote is present but the closing quote is not. These are problematic, and you need to fix them. Browsers do not always interpret these as you might expect, and different browsers handle them differently. What makes no difference in Internet Explorer may cause Firefox to hide content and vice versa.

This chapter is an excerpt from the book, Refactoring HTML: Improving the Design of Existing Web Applications by Elliotte Rusty Harold, published by Addison-Wesley Professional, May 2008, ISBN 0321503635, Copyright 2008 Pearson Education, Inc.

This article originally appeared on WebReference.com.

Page 3 of 3

Previous Page
1 2 3

  • Web Development Newsletter Signup

    Invalid email
    You have successfuly registered to our newsletter.
Thanks for your registration, follow us on our social networks to keep up-to-date