HTML and CSS Reference
Sooner or later, you'll hear the phrase parsing code in reference to browsers and HTML5,
to do what it's told to do. It's just like an international interpreter who speaks English and
Russian — the interpreter parses Russian so that the English speaker understands it and
English so that Russian speaker understands it. Strictly speaking, the parser is part of the
interpreter in the browser, but for all practical purposes, just think of parsing as involved in
getting the Web page to do what you told it to do in the tags you used in your Web i le.
In order to correctly parse HTML5, two things have to happen: You have to write the code
correctly, and your browser has to interpret it correctly. h at's why standards are important.
Basically, standards insure that when you write HTML5 code according to the rules set down,
your code does what you expect it to do in all browsers and on all computers. Using HTML5,
surprises when they're all fully HTML5 compliant.
Ironically, the standards allow for the most designer and developer creativity. If you want to
have the page look or act in a certain way, following the standards used by the browsers that
interpret your creations, they'll look the way you want them to look and behave as expected. If
either you or the browser fails to follow the standards, your creativity is ruined. (We don't
want that now, do we?)
UNDERSTANDING HTML5 AND RELATED FILES
As you saw in Chapter 1, to create an HTML5 i le, all you have to do is save the code using a
text editor like Notepad (Windows) or TextEdit (Mac) and use the extension .html at the
end of the i le name. ( MyCoolPage.html is an example.) h e .html extension is important
because it is recognized as a Web page and not something else that your browser can't parse.
You'll also i nd that only certain kinds of other i les are recognized by the browser's interpreter
and need certain extensions. Here are the most common i le types you'll encounter:
.jpg (JPEG graphic i le)
.gif (GIF graphic i le)
.png (PNG graphic i le)
.svg (SVG graphic i le)
.css (Cascading Style Sheet)
h e most important of these are the graphic i les because the tools you use for your graphics
may automatically save them with dif erent i lenames than those that can be used for the Web.
For example, Adobe Photoshop automatically saves i les as .psd i les, and Adobe Illustrator
saves its i les in .ai format. Neither graphic i le format can be used with Web pages. How-
ever, most graphic creation tools will save the i les as .jpg , .gif , or .png if you use Save As
instead of just plain Save. When you use Save As, you can select from an available list of i le
types on most tools, including text editors, word processors, and graphic drawing tools.