What is HTML5?
HTML5 will be the new standard for HTML, XHTML, and the HTML DOM. According to the W3 Schools HTML5 is still a work in progress, but most contemporary browsers have some HTML5 support.
HTML5 New Features
Some of the most interesting new features in HTML5:
- The canvas element for drawing
- The video and audio elements for media playback
- Better support for local offline storage
- New content specific elements, like article, footer, header, nav, section
- New form controls, like calendar, date, time, email, url, search
Examples
1. New Doctype:
XHTML: <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
HTML5: <!DOCTYPE html>
2. No More Types for Scripts and Links:
XHTML: <link rel=”stylesheet” href=”path/to/stylesheet.css” type=”text/css” />
HTML5: <link rel=”stylesheet” href=”path/to/stylesheet.css” />
3. Make your Content Editable:
This allows the user to edit any of the text contained within the element
XHTML: NOT Available
HTML5:
<p> To-Do List </p>
<ul contenteditable=”true”>
<li> Pick up milk</li>
<li> Go to the bank
<li> Study for test</li>
</ul>
4. Email Input Validation
XHTML:NOT Available
HTML5:
<form action=”” method=”get”>
<label for=”email”>Email:</label>
<input id=”email” name=”email” type=”email” /> <button type=”submit”> Submit Form </button>
</form>
5. Header and Footer Markup Elements
XHTML: NOT Available
HTML5:
<div id=”header”> </div>
<div id=”footer”> </div>
6. Audio Markup Element
XHTML: NOT Available
HTML5:
<audio autoplay=”autoplay” controls=”controls”>
<source src=”file.mp3″ />
<a href=”file.mp3″>Download this file.</a>
</audio>
7. Video Markup Element
XHTML: NOT Available
HTML5:
<video controls preload>
<source src=”video.mp4″ type=”video/mp4; ‘codecs=’avc1.42E01E, mp4a.40.2′” />
</video>
7. Mark Markup Element
XHTML: NOT Available
HTML5: <p> Hello <mark>”Don’t forget this”</mark>. </p>
