In 2014, the W3C released the final standardized version of HTML5, which had been in development and testing since 2004. The previous standard, HTML4, had been finalized in 1997. HTML5, along with many other improvements and new features for HTML, introduced semantic tags, including basic tags for the conventional sections of a website. It also introduced new media tags for
video which allow embedding media into the page without using Quicktime or Flash. Today, we’re going to go over the basic semantic tags, as well as demonstrating the uses of the audio and video tags.
Definitions from Dive into HTML5
section – represents a generic document or application section
nav – element represents a section of a page that links to other pages or to parts within the page: a section with navigation links
article – element represents a component of a page that consists of a self-contained composition in a document, page, application, or site and that is intended to be independently distributable or reusable
aside – element represents a section of a page that consists of content that is tangentially related to the content around the
header – element represents a group of introductory or navigational aids
footer – element represents a footer for its nearest ancestor sectio.ning content or sectioning root element. A footer typically contains information about its section such as who wrote it, links to related documents, copyright data, and the like
In the demonstration today, we will create a new HTML page using these elements.
Video and audio files can be embedded using the following tags:
<video controls> <source src="cat.mp4" type="video/mp4"> <source src="cat.ogg" type="video/ogg"> Your browser does not support HTML5 video : ( </video>
controls attribute, which does not need a value, will add the default user interface to the element. Other attributes include autoplay and loop. See the rest of the video attributes. The media elements accept different file types, which we’ll cover more next class when we talk about video editing.