Web Design
HTML Exercise #7

HTML Semantic Structural Tags: header, main, footer

Focus on:

Overview

You need to put the proper markup for semantic structure, document hierarchy and other necessary tags in each page. You'll then use an embedded style sheet to put background colors in the semantic structural elements (header, main, footer).

Some of the new tags will require you to replace paragraph tags in the markup. Others will just be added to the text.

Although these are both single pages, it is assumed that they would be part of a larger site (as per the menu)

Workflow

You have two documents to mark up: one about viburnums, and another about UWM. Put header, main, footer into each page, and check to see if there is any other markup needed. The screenshots of the completed pages and the correct document outlines should help you see the other tags.

After the markup is complete, add your styles. You can use whatever background colors you like. You do not need to match the colors in the screenshot.

Validation

You want to be sure you've written valid markup. Use the online validator tools to check your work. If there are errors, read what the validators say about them and check the lines in your markup where the errors occur. Watch the validation videos for reminders about how the validators work and how to make corrections.

Helpful links: