Homework Reading

Document and website structure

Prior to the arrival of HTML5, web pages were structured with <div> tags. which essentially function as rectangles for containing and displaying content. Div tags still function the same as ever with HTML5, but new ‘semantic’ tags are also available as a replacement.  The main difference between a div tag and a semantic element such as <header>, <nav>, and <main> is that the name of the element gives an idea of its function.

For example, <nav> tags are typically used for navigational links, <header> tags are used for, yes, headers, etc. There is, however, nothing magical about these semantic tags.  You could build an entire complicated webpage with header or nav tags simply by treating them as if they were div tags.  Their only real purpose for semantic tags is to provide an obvious name for important sections of a web page. NOTE: using semantic tags becomes more vital the larger a website is, i.e. organizing your website is IMPORTANT.

The document and website structure link above takes you to a page with information about the important semantic tags. The same page also has a brief section on line breaks and horizontal rules.  Make sure that you understand the distinction between semantic and non-semantic tags, the names and function of the major semantic tags, and know how to use  line break <br> and horizontal rule <hr> tags.  Easy stuff!

Images in HTML

Review the basics of image embedding, alternative text, etc.

Objects and Iframes.

Especially focus on iframes, but don’t kill yourself on details on this one!

Vector Graphics

Give this one a quick read.

Audio and Video Elements

Understand how audio and video elements function and their main features such as autoplay, loop, and poster.

Forms

This section consists of four pages about forms (links below).

Form Basics — Form Structure — Form Widgets and Attributes — Form Data