The Wayback Machine - https://web.archive.org/web/20081201143900/http://www.webreference.com/html/tutorial1/4.html


spacer

Webref WebRef   Sitemap · Experts · Tools · Services · Newsletters · About i.com

Yes, yes, but what is HTML made of?

Developer News
Mandrake Linux Founder Back, Virtually
Amazon: We're a Technology Company
Sun Expands MySQL With Closed Source

I mentioned that HTML is an application of SGML. This means that every HTML document is also an SGML document. The first thing an SGML document must have is a Document Type Declaration. This means exactly what it sounds like: a Document Type Declaration declares the document to be of a specific type. In our case this type is HTML. I won't go into much depth on Document Type Declarations right now. For the moment, you should use the following declaration:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
 "http://www.w3.org/TR/REC-html40/strict.dtd">

Do not let the angle brackets confuse you. The above is not an element. If you look carefully, you'll notice that the content of the above construct starts with an exclamation mark; this indicates that this is SGML code. And after looking at it a bit you might be glad you don't have to learn SGML. So just take me on my word for this once, and put this at the top of your document. In a future tutorial, we'll explain what this Document Type Declaration means and show that it's really quite simple.

Now that we have specified that this is an HTML document, we can start adding elements. The first element will always be the HTML element. All HTML documents have an HTML element, which contains all the other elements. Let's put in the start-tag and end-tag for this element and we'll worry about its contents later. Here's what we've got so far:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
 "http://www.w3.org/TR/REC-html40/strict.dtd">
<HTML>
</HTML>

Every HTML document is split into a head and a body, which are marked by similarily named elements, HEAD and BODY. Every HTML document must have one of each, inside the HTML element. In fact, these two are the only things you can have inside the HTML element. So let's put these in as well and see where we are:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
 "http://www.w3.org/TR/REC-html40/strict.dtd">
<HTML>
 <HEAD>
 </HEAD>
 <BODY>
 </BODY>
</HTML>

Notice that I've used a slight indent for the HEAD and BODY element tags. This has no special meaning and is only there to make the HTML more legible. You might have noticed that white-space (that is, spaces, tabs and linefeeds) is collapsed in HTML. This means you can add as much of it as you want to, in order to make your HTML easier to read, without any change in the meaning of the document.

The difference between the head and body of a document is that the head contains mostly information about the document, while the body contains the document itself. Before we go on to the body, we'll deal with the one element every document head must contain: a title.

The title of your document is very important. It distinguishes your document and makes it unique, as well as describing it to the reader. In this case, the title "Acme Computer Corp." is unsuitable, because it doesn't describe our document. A more descriptive title would be "About Acme Computer Corp.", but since this is the world of marketing and we can't afford to be bland, we'll give it a title of "Acme Computer Corp.: Who We Are".

The TITLE element is a very simple element. It cannot contain anything but text and that text is the title of the document. So let's insert our title into our document, which is almost complete:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN"
 "http://www.w3.org/TR/REC-html40/strict.dtd">
<HTML>
 <HEAD>
  <TITLE>Acme Computer Corp.: Who We Are</TITLE>
 </HEAD>
 <BODY>
 </BODY>
</HTML>

We're almost finished! All that remains is to add our document body.

Front Page12345

http://www.internet.com

Produced by Stephanos Piperoglou

internet.comearthweb.comDevx.commediabistro.comGraphics.com

Search:

Jupitermedia Corporation has two divisions: Jupiterimages and JupiterOnlineMedia

Jupitermedia Corporate Info

Copyright 2008 Jupitermedia Corporation All Rights Reserved.

Legal Notices, Licensing, Reprints, Permissions, Privacy Policy.
Advertise | Newsletters | Tech Jobs | Shopping | E-mail Offers

Whitepapers and eBooks

Intel Whitepaper: Comparing Two- and Four-Socket Platforms for Server Virtualization
IBM Solutions Brief: Go Green With IBM System xTM And Intel
HP eBook: Simplifying SQL Server Management
IBM Contest: Are You the Next Superstar? Join the "Search for the XML Superstar" Contest to Find Out
Microsoft PDF: Top 10 Reasons to Move to Server Virtualization with Hyper-V
Microsoft PDF: Six Reasons Why Microsoft's Hyper-V Will Overtake Vmware
Microsoft Step-by-Step Guide: Hyper-V and Failover Clustering
Intel PDF: Quad-Core Impacts More Than the Data Center
Intel PDF: Virtualization Delivers Data Center Efficiency
Go Parallel Article: PDC 2008 in Review
Microsoft PDF: Top 11 Reasons to Upgrade to Windows Server 2008
Avaya Article: Communication-Enabled Mashups: Empowering Both Business Owners and IT
Intel Whitepaper: Building a Real-World Model to Assess Virtualization Platforms
  PDF: Intel Centrino Duo Processor Technology with Intel Core2 Duo Processor
Microsoft Article: Build and Run Virtual Machines with Hyper-V Server 2008
Go Parallel Article: Q&A; with a TBB Junkie
IBM Whitepaper: Innovative Collaboration to Advance Your Business
Internet.com eBook: Real Life Rails
IBM eBook: The Pros and Cons of Outsourcing
Internet.com eBook: Best Practices for Developing a Web Site
IBM CXO Whitepaper: The 2008 Global CEO Study "The Enterprise of the Future"
Avaya Article: Call Control XML in Action - A CCXML Auto Attendant
IBM CXO Whitepaper: Unlocking the DNA of the Adaptable Workforce--The Global Human Capital Study 2008
Adobe Acrobat Connect Pro: Web Conferencing and eLearning Whitepapers
HP eBook: Guide to Storage Networking
MORE WHITEPAPERS, EBOOKS, AND ARTICLES
webref The latest from WebReference.com Browse >
Popular JavaScript Framework Libraries: An Overview - Part 3 · Accessing Your MySQL Database from the Web with PHP · Working with the DOM Stylesheets Collection
Sitemap · Experts · Tools · Services · Email a Colleague · Contact FREE Newsletters 
 The latest from internet.com
Crucial Triples Up With New Three-Channel DDR3 Kits · Meet the Finalists: Excellence in Technology Awards · Tealeaf Offers Insight to Mobile Customer Behavior


All Rights Reserved. Legal Notices.

URL: http://www.webreference.com/html/tutorial1/4.html
Created: May 28, 1998
Revised: May 28, 1998

Morty Proxy This is a proxified and sanitized view of the page, visit original site.