In this section, we will discuss issues relating to styles and structure for our document. For 
this checkpoint, we need to make sure that our document is well organized and marked using the 
correct elements for the kinds of elements that are being displayed on our webpage. This 
screen shows the shortcuts for the check that we'll be performing in Dreamweaver once 
we preview our document. But let's go back to our document and talk a little bit more about 
what we're trying to accomplish with this step. Again, we need to make sure that our webpages 
are well organized in a meaningful way. So by visually looking at our webpage, we can 
see that we have information organized into multiple sections. Here we have a section 
at the top of our page, main section in our document, called Mouse College Soccer Program. 
Below that, you can see that we have a section of our page that has a list of links to other 
webpages within the website. Following that, you can see that we have a section about upcoming 
games, which has a list of games that are coming up, as well as where they're located. If we 
scroll through our document further, we see a section that says About the Pack Rats. 
Finally, we have sections on recent game photos, and even a section for signing up for a 
mailing list. So visually, we can see some of these sections have they appear to have 
section headings because the fonts are sized in such a way that they seem to represent 
that. But it's a little inconsistent. So let's save our changes. And then let's preview 
our webpage in Firefox. To do so, click on the file menu, choose preview in browser, and 
choose the Firefox option. If you don't see the Firefox option available here, you can go to 
the edit browser list option, and then click the plus, type in Firefox, click the browse 
button, browse to the Mozilla Firefox folder. If you don't see the Mozilla Firefox folder, you 
probably don't have Firefox installed, so you will need to download and install Firefox. 
Click the Firefox EXE file, click open. And if you'd like, you can set Firefox as your 
primary browser. Click okay to finish. And again, file, preview in browser, and choose Firefox. 
Now that we're looking at our document in Firefox, we can see the same set of sections that we 
saw previously in Dreamweaver. Everything from sign up on our mailing list, recent game 
photos, et cetera. On the web developer toolbar, I'm going to click on the information button. 
And I'm going to choose view document outline. What this will do is present an outline view of 
my document based on the headings that are specified in my HTML code. Notice that the 
document outline that is being presented for this webpage has no headings listed. So this is 
showing us that our webpage is inaccessible, and the headings that we have in our document for 
our sections are not marked as headings in our webpage. So let's go back to Dreamweaver and 
mark the headings that we have in our webpage as headings. Put your cursor anywhere on the 
Mouse College Soccer Program title. Because this is the title for our page, we are going to 
mark that heading as the most important heading in our webpage, also known as Heading 
1. So once your cursor is anywhere in that block of text, click on the format drop down on 
the properties inspector and choose Heading 1. Notice that the font formatting changes 
slightly. But notice now if I click anywhere within that block of text, every bit of text is 
marked as Heading 1 in the properties inspector. The next section that we have in our 
webpage, as previously discussed, is a section of links. Well, the problem here is 
that we don't have a section heading listed for this list of links. And we need to have that 
heading defined specifically in our document. So I'm going to put my cursor at the end of the 
Mouse College Soccer Program paragraph and press the enter key. And then I'm going to type 
in a heading for my section of links. And a good heading for a section of links might be 
navigation. In the case of the list of links that we have here, the list of links represents the 
navigation for the soccer program website. So once I type that out, again, put your cursor 
anywhere in that paragraph, click on the format menu. Now, in this case, the navigation for 
this website is a subheading of our Mouse College Soccer Program page title. So we should mark 
navigation as a Heading 2. So this means that navigation section is a subsection of Mouse 
College Soccer Program.