If you are already comfortable editing in HTML or XHTML, then you may want to just skip to the bottom and bookmark some of the resources I've listed for future reference. But if you've just been given the responsibility of maintaining or building a new site for your department, you may be wondering where to begin. If you've done the requisite site planning, as described in my Planning Your Website Tutorial, then you are almost ready to begin building or editing your pages.
To build a new site you will need to download the appropriate template files, and make sure you have the appropriate editing software on your computer. Case recommends using Dreamweaver as your XHTML editor. Dreamweaver is available—through the Software Center—as a component of Macromedia Studio 8. Dreamweaver is a great tool, but it is only a tool. A hammer is a useful tool for hitting a nail into a wall, but it still depends on you to both hold the nail, and to guide the hammer with appropriate force and precision. Similarly, Dreamweaver requires you to tell it what to do with the content you type or paste into it. You will find it is far easier to control Dreamweaver if you understand the basics of HTML and XHTML.
XHTML (Extensible HyperText Markup Language) and HTML (HyperText Markup Language) are forms of SGML (Standard Generalized Mark-up Language) which allow users to define the structure of a document and its component parts. The first version of HTML was developed in 1989-1990 by Tim Berners-Lee and was fundamental to his invention of the World Wide Web. HTML 4.01 is the most current version. XHTML extends the abilities of HTML and can work in conjunction with XML. Case Web templates use XHTML 1.0 Transitional.
While I've included links to the specifications above, don't worry too much about the technical stuff. For your purposes you mostly need to understand that HTML and XHTML allow you to define areas of a document such as the body, headers, paragraphs, links and images so that a Web browser or other user agent knows how to structure the elements. Note that I said structure rather than present. Presentational elements which control the look of a site, such as font, color, boldness, and alignment, are not controlled through XHTML or HTML 4.01. Instead they are controlled by Cascading Style Sheets (CSS). XHTML handles structure, while CSS handles style. I'll discuss CSS more carefully in a separate post.
I find it is easier to learn by doing, so what I usually recommend is that you build yourself a little Web site from scratch. Knowing that you have your Case templates and Dreamweaver already installed, I want you to leave them closed in their folders and ignore them. We will not be using either for this project.
Using a plain text editor, build a five page Web site (in XHTML 1.0) about your favorite animal. You should be sure to include your site title on each page, topical headers on each page, subheads when appropriate, at least one bulleted list, and a navigational menu. Each page should include links to other pages within the site and to external Web sites, and a link to an e-mail address. I would like you to include at least one photograph or illustration (please only use images you have permission to use), but I do not want you to apply any styling such as font choice or color to the site. We will do that in our next project, learning CSS. Once your site is complete, go to http://validator.w3.org/ to make sure your code is valid. Then post a link to your site in the comments area below so that we can all see how you've done!
As I indicated in the title, I'm not going to teach you the code. Many others have provided perfectly good resources for this. The ones I used back in the dark ages of the early 1990's are now well out-of-date, and I've not read any of the following in their entirety, but I have read and skimmed bits of each, and they seem sufficient. Please make sure not to use any resources geared to older versions of HTML as they will include code that is no longer in use.
Safari Proquest subscribers, including users from many universities, can read these online at no cost. For others I've included links for ordering the books from Amazon.com.
There are many other reference materials available online, but the above should be sufficient to get you started. So go ahead, open up your text editor, give it a try, and let us know how it turns out!
Next: Homework Review