HTML Page Structure¶
HTML documents follow a basic page structure:
<html>
<head>
<title>Page Title</title>
</head>
<body>
<h1>Hello World</h1>
<p>Your first HTML document</p>
</body>
</html>
You can try this example out on your own computer by copying and pasting the markup above into a text editor such as Notepad on Microsoft Windows. Save the document as first.html.
You typically open the document in your favorite web browser by double-clicking on the document or opening it from within your browser.
Deciphering HTML Page Structure¶
- HTML documents start with the
<html>start tag and end with the</html>end tag. - The
<head>section is used to store meta-information which literally means information about information. - The contents of the
<title>tag are displayed along your browser's title bar. - The contents of the
<body>section are displayed within the browser window.
HTML Headings¶
- HTML headings are defined with the
<h1>through<h6>tags. - The content between the heading start tag and end tag is referred to as Element Content. In the example above, the
<h1>tag would have “Hello World” as its Element Content. - Heading tags should be used to define your markup in a semantic way. For example:
<h1>Page Heading</h1>
<h2>Category #1</h2>
<h3>Sub Category #1</h3>
<h3>Sub Category #2</h3>
<h2>Category #2</h2>
<h3>Sub Category #1</h3>
<h3>Sub Category #2</h3>
HTML Paragraphs¶
- HTML paragraphs are defined with the
<p>tag. - Make sure you remember the end tag:
<p>This is correct</p> <p>This is incorrect