Most of the best code editors these days — whether you’re using a code-only editor or one with a WYSIWYG (“what you see is what you get”) view — automatically write web code for that conforms to HTML 4.01, XHTML 1.0, or HTML5 standards based on the document type definition (DTD) you select when creating your pages.
Where your code can start to unravel, however, is when you start hand-coding, hand-editing, and using any free code and scripts that you find online.
Another problem can happen when you start working with legacy HTML pages that still use some of the older HTML tags that have been deprecated (phased out) over the past several years. You might want to start coding your projects with HTML5 and use only XHTML or HTML 4.01 Transitional if you have a specific need to do so.
Alternatively, you can start with HTML 4.01 and then easily transition to XHTML or HTML5 code, at which point the stricter and newer rules of XHTML and HTML5 might make more sense to you. Make sure to use the version you choose consistently throughout your site.
One benefit of starting with HTML is that some tags and attributes are backward compatible with many older browsers, whereas XHTML and HTML5 are not supported in part or in full by many of the older browsers.
In addition, programs such as Dreamweaver and Expression web can code properly syntaxed semantic HTML, XHTML, and HTML5, but the programs aren’t human, so you need to intervene occasionally to ensure that the code is properly formatted and remains that way anytime you make alterations to your code by hand.
Review these rules for HTML, XHTML, and HTML5 and use the markup that best meets your needs.
| HTML | XHTML | HTML5 | |
|---|---|---|---|
| Code structure must be ordered correctly, but forgotten tags
may be forgiven and cause a page to fail acceptably, such as
forgetting to close the |
All code elements must be closed and placed in the proper
location hierarchically within the opening and closing tags, as in ... ... |
Markup can be written in either HTML, XHTML, or a combo “polyglot markup” syntax that combines rules of HTML and XHTML. | |
| HTML files should have, but aren’t required to have, an HTML DOCTYPE declaration above the opening tag. | All XHTML files must include an XHTML DOCTYPE declaration above
the opening tag, as in /span> PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/ xhtml1-transitional.dtd”> ... |
HTML5 files require the simple HTML5 doctype declaration above the opening tag: |
|
| Tags can be written in either uppercase or lowercase, but
lowercase is preferred, such as |
Tags must always be written in all lowercase letters, as in , , and . | Tags and tag attributes should be written in all lowercase letters, as in , , and . | |
| HTML cannot be an application of XML. | XHTML takes advantage of XML. | HTML5 is not an application of XML, but XHTML5 is the XML serialization of HTML5. | |
| Tags and objects can be improperly nested with little consequence, so Citizen Kane would still be displayed in bold and italics. | Tags and objects must be properly nested to display accurately in a browser, so Marshmallows would be incorrect and Marshmallows would be correct. | Like XHTML, tags and objects should be nested correctly to display accurately in a browser. | |
| Tags needn’t always have closing tag elements, as with
the , , and tags. |
All tags and objects must be properly closed. Tags that
didn’t typically need to be closed in HTML should now be
closed by placing a space and slash inside the tag, as in , , and . All other tags, such as , | , and , must also be properly closed. | In HTML5, the /> used in XHTML to
close tags is unnecessary for void elements (elements that
don’t contain any content, such as ). |
| Values inside attributes of tags can be written either with or without quotation marks, as in or . | Values inside attributes of tags must be written inside quotation marks, as in | Values inside attributes of tags should be written inside quotation marks, as in . | |
| Attributes can use shorthand to minimize the code that needs to be written when the value matches the desired option, as with . | Attributes can no longer use shorthand and must always use the full syntax of the HTML code, as with . | Attributes should always use the full syntax of the HTML code and attributes, as with . | |
| Objects use the name attribute, as in . | Objects use either the id attribute instead of name, as in or use both the id and the name attributes together, as in Using both name and id attributes together helps older browsers interpret and display HTML data. | Objects should use both the id and name attributes together, as in |
XHTML and HTML5 follow a much stricter set of rules than HTML, but HTML5 is the current recommended standard for the web, and both XHTML and HTML5 have many benefits that HTML lacks.
For instance, because of all its standards, some say XHTML — and HTML5 by extension — is easier to learn than HTML. Not only that, but XHTML is both XML- and XSL-ready and HTML5 offers more control over content and new features.
Until you are able to test the validity of the code for compliance to the W3C recommended standards, as long as you tell your HTML/web editor to code in the desired markup language and pay attention to syntactical rules while making any code adjustments by hand, you should be able to code your pages properly.
