W e b t u t o r i a l s

Directory Structure

DOCTYPE Declaration

Audio and Videos tag

YouTube Videos

Elements Removed

Semantic Elements

HTML5 Basic Structure

HTML5 New Elements

Create Element

Browser Support

HTML5 Form Element

HTML5 Plug-Ins

HTML5 Semantic Elements

A semantic element clearly describes its meaning to both the browser and the developer. HTML5 defines eight new Semantic Elements. All these are block-level elements.
Examples of non-semantic elements: <div> and <span> - Tells nothing about its content.
Examples of semantic elements: <form>, <table>, and <img> - Clearly defines its content.

Semantic Element Description
<header> Define the Page header
<footer> Define the Page Footer
<aside> Defines content aside from the page content
<nav> Stands for navigation, defines the menu list.
<main> Defines the menu list use for navigation.
<section> Defines an section in the document
<article> Defines an article in the document
<figure> Defines an figure in the document
Note: To secure correct behavior in older browsers, you can set the CSS display property to block:
header, section, footer, aside, nav, main, article, figure {
      display: block;
Exercise: (Click to Enlarge)