Lesson 1: HTML Document Structure
As I mentioned in the previous lesson, HTML tags are used to structure and create the layout of a webpage. Tags are the heart of HTML, and everything needs to be put inside of them. Tags are used everywhere, from structuring images, text, and buttons.
An HTML document consists of two main parts: the head and the body. The head part of an HTML document contains information about the website, such as the website title, styles, and other meta information (this is where we will include the styling of our document, or link to an external file that includes the styles). The body will contains the actual contents of a web page.
HTML files need to start with the following line: <!DOCTYPE html> , declaring that the following document is an HTML5 document (the latest version of HTML). DOCTYPE stands for “document type”, and it’s followed by the word “html”, ensuring that the browser knows that it’s an HTML5 document. Previous HTML versions have different DOCTYPE tags. (HTML4’s DOCTYPE declaration is `<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">) I previously said that every opening tag must have a closing tag (I lied, kind of), however, there are very few exceptions. The <!DOCTYPE html> tag does not have a closing tag and should be included as is.
Here is an example of what an HTML document looks like:
<!DOCTYPE HTML>
<html>
<head>
</head>
<body>
</body>
</html>As you can see, after the DOCTYPE declaration, there is an html tag, which indicates the start of an HTML document. Everything you write will be enclosed inside the html tag. After that, there is the head tag, which will include information about a website. After the head tag, there is a the body. Most of the stuff you will write will be inside of the <body> tag, which will contain all of the contents of your site.