Example 1-16. Viewing the structure of an XHTML document
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <head> <title>your site : location within site : topic title</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <meta name="keywords" content="your, keywords, here" /> <meta name="description" content="your description here" /> <meta name="author" content="your name here" /> </head> <body> <!-- main content section --> </body> </html>
Copy this markup, save it to a work folder on your computer, and name it TOC_Building_An_HTML_Page.html. This will be the file you'll open and add content and additional markup to as we progress.
Text Is Next!
Of course, if you were to open the document you just created in a web browser, the viewport section where content normally is displayed would be completely blank! This is because the only thing in the body is a comment, which hides the text within it. The one thing you will notice is the title of your site, which appears in the title bar at the top of your browser.
Beginning with structure is a great way to learn how to create great pages right away. Although it might seem frustrating to do all this complicated stuff and end up with no visible results, I promise you that the long-term rewards are worth it. You'll end up with far more control and understanding of everything to do with markup and CSS, I assure you.
So after you've saved your document, go ahead and validate it. Browse to http://validate.w3.org/, find the file upload section, and upload your file. Run it through the validator. Find any errors? Fix them and try again. No errors? Great job.
And I promise you that in the next tutorial, "Adding Text and Links," you'll end up with something to actually view within your browser!