CMW: Web Authoring Exercises

Creating and Maintaining a Website: Web Authoring Exercise

Discuss the HTML/CSS/JavaScript pyramid.

Creating Individual pages:

Exercise 1: Creating HTML

Exercise 2: Make a list. Follow this example from the code archive:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title>Lists – an introduction</title>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″/>
</head>
<body>
<h1>Lists – an introduction </h1>
<p>Here’s a paragraph. A lovely, concise little paragraph.</p>
<p>Here comes another one, followed by a subheading.</p>
<h2>A subheading here</h2>
<p>And now for a list or two:</p>
<ul>
<li>This is a bulleted list</li>
<li>No order applied</li>
<li>Just a bunch of points we want to make</li>
</ul>
<p>And here’s an ordered list:</p>
<ol>
<li>This is the first item</li>
<li>Followed by this one</li>
<li>And one more for luck</li>
</ol>
</body>
</html>

Exercise 3: Add some structure. (See page 53.)

Open html2-code > chapter2 > web_site_files > 06_adding_structure_with_divs > index.html.

Save this file to your root folder as index.html. It will replace the previous version of index.html. You must also save the image divers-circle.jpg to your root folder (from chapter 2 > web_site_files > 05).

Exercise 4: Splitting Up the Page. Follow the directions in the book on pages 57 – 62.

  • File Paths and References
  • Navigation and links
  • Images and the <img> element
  • Additional HTML tags
    • Blockquote
    • Cite
    • Em & strong vs. i & b
    • br