Structured code is the use of tabs and spaces to make your code easier to read. The browsers (e.g., Netscape and Internet Explorer) ignore all extra spaces, tabs and paragraph marks. The browsers only see one space - even if 10 spaces are there. In fact, your entire code could be written on one line - the browsers would not see the code any differently, but it would be very difficult for you to read. Each time that you code a <p /> tag, double space your code (by pressing enter twice). Each time that you code a <br /> tag, single space your code (by pressing enter once). This will make it easier for you to find these tags.
For your sanity and mine, you must use structured code. A week ago we learned to code lists. When you code a nested list (a list inside of a list),
indent the nested list by pressing the tab key one time on each line. It should look like this:
<ol>
<li>First Item</li>
<li>Second Item</li>
<ul>
<li>First Nested List Item</li>
<li>Second Nested List Item</li>
</ul>
<li>Third Item</li>
</ol>
This week, we will learn to use a simple table. In complex tables, it is somewhat difficult to see where one row or cell ends and and another begins. Using structured code will help you see the rows and cells.
Another "trick" to making code easier to read is to use comment tags.
In HTML, a comment tag looks like:
<!-- This is a comment -->
The browser does not print comment lines on the screen. They are used in code to identify different
sections of code or to identify changes to code,
e.g., <!-- Next two lines of code added 9/1/01 -->.
Sometimes, a programmer will leave code in a document but add comment tags around it to keep the browser from displaying
the lines. This is a good way to make a temporary change to a HTML document.
For now, let's add a comment tag in the <body> section of each HTML document to identify the purpose of your code:
e.g., <!-- Nested List --> or <!-- Simple Table -->.