The stuff at the top - A Smarter Way To Learn HTML & CSS (2015)

A Smarter Way To Learn HTML & CSS(2015)

88
The stuff at the top

The standard code you find at the top of an HTML document is gobbledygook, but as a conscientious coder, you’re always going to include it, so you may as well know what it means.

The first line in the document is the doctype declaration.

<!DOCTYPE HTML>

This tells the browser the document is written in HTML5. This is what you’ll always write when you’re creating a new document, whether the document has any HTML5 features in it or not. Things to notice:

1. The exclamation point.

2. It’s in all-capital letters, a convention not a requirement.

3. There’s no closing tag.

Next comes the <html> tag. To keep things simple, I’ve coded it minimally in previous chapters, but the recommended way to write it is like this.

<!DOCTYPE HTML>
<html lang="en">

That little bit of extra information tells the browser, the search engines, and screen readers that the text content of the page—the headings, paragraphs, and tables—are in English. If your page is in Italian, you’d write lang="it"; in Hindi, lang="hi"; etc. As you know, the<html> tag is closed with </html> at the end of the document.

The <head> tag, which you’re familiar with, goes on the third line.

<!DOCTYPE HTML>
<html lang="en">
<head>

It is closed with the </head> tag at the end of the head section. At a minimum, the head section contains…

<meta charset="utf-8">

This tag tells the browser to use a particular flavor of text encoding that permits the greatest variety of characters, thus accommodating the greatest number of languages. The tag isn’t closed.

Next, you’ll write opening and closing title tags. Inside them you’ll write the text that will appear in the browser toolbar, in a bookmark list, and in search engine results. Give each page a unique title that describes its particular contents.

<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Characteristics of the Slow Loris</title>

In your HTML file, code the first two tags at the top of a document. Code the meta charset tag beneath the head tag. Save the file. Display the page to be sure your changes haven’t broken anything.

Sample HTML code is at:
http://asmarterwaytolearn.com/htmlcss/practice-88-1.html.

Find the interactive coding exercises for this chapter at:
http://www.ASmarterWayToLearn.com/htmlcss/88.html