Easy Web Design, 3rd Edition
  EWD Projects :: Oldschool

Demystifying Basic HTML

Print This Procedure ( doc :: pdf )

So You’ve Heard about Cascading Style Sheets, Deprecated Tags, and DTDs

Before we cover your screen with HTML facts, let's dust off a couple potentially confusing concepts.

Cascading style sheets (or CSS) is a technology that enables you to define a Web site’s page formatting in a single place either in a separate document or in a special area within each Web document. In many Web designers’ and developers’ eyes, everyone should be using CSS as soon as possible. But the reality of the situation is that many Web sites are slowly starting to incorporate style sheets. Fortunately, the Web continues to support older formatting techniques along with the newer CSS commands.

In relation to you, the goal of this walkthrough is to teach you HTML; therefore, we decided to omit teaching you how to use style sheets here. After you learn HTML, you’ll be able to move on and learn CSS at your leisure. If you want to complete a walkthrough that uses CSS and XHMTL, check out our latest Web development book, Easy Web Design, 3rd edition. We show you how to hand-code a Web site using the latest XHTML and CSS standards.

In relation to CSS, you might hear that some of the HTML tags and attributes are deprecated. A deprecated element can be (and is) used on the Web; it is simply earmarked for eventual elimination. You can see a list of HTML tags along with notations regarding which are classified as deprecated at www.w3.org/TR/1999/REC-html401-19991224/index/elements.html.

Finally, due to the various levels of CSS and HTML compliance on the Web these days, you can help browsers interpret your Web pages by specifying whether your page is strictly compliant with the latest standards, transitional (includes deprecated HTML elements), or framed (includes deprecated HTML elements and frames within the Web site). To do this, you insert a particular version of the <!DOCTYPE...> HTML tag in your Web pages, as described here as well as in this lesson’s project steps:

·      If your Web page adheres to HTML 4.01 standards, insert:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">


·      If your Web page adheres to HTML 4.01 standards and includes deprecated HTML elements and attributes (most of which concern visual presentation), insert:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


·      If your Web page adheres to HTML 4.01, includes deprecated HTML elements and attributes, plus uses frames, insert:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">


note If your Web documents adhere to XHTML 1.0 or XHTML 1.1, you will need to use a different DTD. To see valid XHTML DTDs, go to http://www.w3.org/QA/2002/04/valid-dtd-list.html.

Because the project in this lesson includes deprecated HTML elements but not frames, your documents will use the second statement the transitional statement shown in blue in the preceding list. We’ll show you how to add this statement to your HTML document in the project steps later in this walkthrough.

Having a vague understanding of these concepts is fine for now. In fact, that's our goal at this point. Now, let's move on to the HTML basics.

Next section

top of page