HTML and CSS Reference
In-Depth Information
We'll be honest: some parts of this chapter will be pretty dry and technical, and if you're just starting out
with HTML you may want to skip over some of the denser bits and move on to Chapter 4. Don't worry too
much about things like metadata, character sets, media types, and JavaScript just yet if you're not quite
ready for them. But it's important to understand the fundamentals of the documents you'll be working with
from here on, so this is an important chapter to have near the beginning. You can always come back to
this chapter later for a refresher; that's why pages turn both ways, after all (unless you're reading a digital
edition, but scrollbars scroll both ways too).
The Anatomy of an HTML Document
An HTML document is put together from a few vital components: a document type declaration (or
doctype ), a root element that wraps around the entire document, a head element featuring a title and other
information about the document, and a body element that holds all of the content. Listing 3-1 shows a
simple document with all the pieces in place. If you've downloaded the source code that accompanies this
book (you can get it from apress.com or from foundationhtml.com ) you'll find this example document in
the Chapter 3 folder, and this can serve as a starting point for all your documents to come.
Listing 3-1. A basic HTML document
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Document Title</title>
</head>
<body>
<p>This is a very simple web page.</p>
</body>
</html>
Believe it or not, this relatively short block of code is a complete, valid, well-formed HTML document,
authored in strict adherence to the rules of the HTML5 specification. That's not so difficult, is it? In fact, as
minimal as it is, this example is even more verbose than strictly required. You could choose to omit some
of the tags we've included, making the document even smaller while still complete and valid. We've
included those optional tags in our examples, and we recommend including them in your own documents
as well, if only to help you read your own markup as you work with it.
Next we'll dig a bit deeper to tell you what each of these component parts is all about, and introduce a few
more optional parts you'll need further down the road.
The Doctype
The first essential piece of an HTML document is a document type declaration , or just doctype for short.
This bit of code informs the user-agent what type of document it's dealing with, so it knows what to expect
and can process the rest of the document accordingly. Though the doctype is contained in angle brackets
( < and > ), it isn't really a tag, it's an instruction —something like a special comment—and the ! at the
beginning distinguishes it from any other code in the document.
 
Search WWH ::




Custom Search