74 Chapter 5 – HTML OverviewTips on Good HTML Style
Web Design in a Nutshell, eMatter EditionTips on Good HTML Style
This section offers some guidelines for writing “good” HTML—code that will be
supported by a wide variety of browsers, that will be easily handled by applica-
tions expecting correct HTML, and that will be extensible to emerging technologies
built on the current HTML specification.
Follow HTML syntax as described by the current available W3C specification
Writing HTML “correctly” may take extra effort, but it ensures that your docu-
ment will display the way you intend it on the greatest number of browsers.
Some browsers are quite lax in the way they parse HTML. For instance, if you
omit a closing</table>tag, Internet Explorer will display the contents of the
table just fine. Netscape Navigator will leave that portion of your web page
completely blank.
Some browsers, particularly Opera, are very strict. Simple slips or shortcuts
that slide right by Navigator or Internet Explorer may cause your whole web
page to self-destruct. If you are careful in the way you write your HTML
(minding your <p>s and <q>s!), you will have more success on more
browsers.
To be absolutely sure how you’re doing, you should run your HTML code
through one of the many available online HTML validation services, such as
the one at the W3C (http://www.validator.w3.org/). Other HTML validators are
listed in Chapter 1,Designing for a Variety of Browsers.
Follow code-writing conventions to make your HTML document easier to read
Although not a true programming language, HTML documents bear some
resemblance to programming code in that they are usually long ASCII docu-
ments littered with tags and commands. The overall impression can be
chaotic, making it difficult to find the specific element you’re looking for. The
following conventions serve to make your document easier to read when
viewed in a simple text editor.
Capitalize tags and attributes
Tags and their attributes are not case-sensitive, so capitalizing them
consistently in a document makes them stand out from the rest of the
content on the page.
Use line breaks and tabs for legibility
Because browsers ignore line breaks, tabs, and extra spaces in an HTML
document, you can use them to give your document structure. For
instance, you can add extra lines between the head and body of the
document or tabs before the items in a list. The white space will help
differentiate elements on the page.
Adding character spaces and returns will add to the size of your HTML
file, so if you are extremely concerned about download times, keep your
HTML compact. A new utility called Mizer from Antimony Software strips
out all the unnecessary characters, making HTML files 10–15% smaller
and allowing the browser to display the page up to 30% faster. For more
information, seehttp://www.antimony.com/.