HTML and CSS Reference
In-Depth Information
selecting Show menu bar. You can access all of Safari's developer tools, including Web Inspector, from the
Developer drop-down menu.
Safari also has a number of other developer tools that enable you to easily turn off caching, images, styling,
and JavaScript. These tools can be very useful when testing how a website will look and behave in less cap-
able browsers.
•
IE Developer Tools
—Internet Explorer has a set of built-in developer tools that can be accessed through the
Tools menu or by pressing F12 on your keyboard.
The IE developer tools contain all the features that you would expect, including element, CSS, and
JavaScript inspectors as well as a console. There are also a number of tools to help you test your website on
older versions of IE. These tools are useful because some of the older versions of Internet Explorer had
bugs that can affect how your web pages will be displayed to users. There is also a Validate menu that in-
cludes links to easily validate the page you are viewing using the W3C validator. You learn about web page
validation later in this chapter.
Building Your First HTML5 Web Page
You're still here, and you have your tools set up. Great! Now it's time to start writing some real markup. In this sec-
tion, you build your very first web page using HTML, in just three simple steps.
All download code files for the exercises in the topic are available from the topic's website at
ht-
tp://
www.wiley.com/go/treehouse/html5foundations
,
and are grouped into folders by chapters. The
code for this exercise can be found in the Chapter 1 folder, in folder 1.
1.
Start by creating a new file called
index.html
with your chosen text editor and save it on your desktop.
Web page files are saved with an
.html
file extension. This extension tells the web browser that it should
read the contents as HTML, construct the relevant page elements, and apply the styling you provide. If you
were to save a file as a
.txt file
, for example, the browser would not recognize that it was an HTML
file and would simply display the contents of the file in plain text (that is, the user would see the code).
The home page of your website should always be named
index.html
because this is the file that the web server
will look to return when somebody visits the root of your website. For example, if a visitor goes to
ht-
tp://example.org
, the web server will look for an index file in the root directory of the website—that is,
ht-
tp://example.org/index.html
.
The
root
directory is the top-level folder in your web space.
2.
Type the following code in your
index.html
file. (This code can also be downloaded from the topic's
companion website.)
<!DOCTYPE html>
<html>
<head>
