HTML5 is poised to change not only Web development, but application development in general and when I say HTMl5, I mean “the wave” and not only the additions to the HTML5 syntax spec.

I’ve been building an HTML5 presentation (have a great conference coming up ?) and planning a collection of How-To content so i thought it might be a good idea to enumerate the new wave of web development technology so that I can cover as much as possible. As I do feature specific content I’ll update this page to link from the entries here.

There are API features and extensions beyond the HTML5 syntax itself.

  • Selectors
  • Web Workers
  • Web Storage
  • Web SQL Storage
  • Offline Application Cache
  • WebSockets
  • Geolocation
  • Notifications

And then there are the additions to the spec itself.

Lets look …

TAGS

<article> Defines an article
<aside> Defines content aside from the page content
<audio> Defines sound content
<canvas> Defines graphics
<command> Defines a command button
<datalist> Defines a dropdown list
<details> Defines details of an element
<embed> Defines external interactive content or plugin
<figcaption> Defines the caption of a figure element
<figure> Defines a group of media content, and their caption
<footer> Defines a footer for a section or page
<header> Defines a header for a section or page
<hgroup> Defines information about a section in a document
<keygen> Defines a generated key in a form
<mark> Defines marked text
<meter> Defines measurement within a predefined range
<nav> Defines navigation links
<output> Defines some types of output
<progress> Defines progress of a task of any kind
<rp> Used in ruby annotations to define what to show if a browser does not support the ruby element
<rt> Defines explanation to ruby annotations
<ruby> Defines ruby annotations
<section> Defines a section
<source> Defines media resources
<summary> Defines the header of a “detail” element
<time> Defines a date/time
<video> Defines a video
<wbr> Defines a possible line-break

ATTRIBUTES

contenteditable Specifies whether a user can edit the content of an element or not
contextmenu Specifies a context menu for an element
draggable Specifies whether a user is allowed to drag an element or not
dropzone Specifies what happens when dragged items/data is dropped in the element
hidden Specifies that an element should be hidden
spellcheck Specifies if the element must have its spelling and grammar checked

EVENTS

DOCUMENT
onafterprint Script to be run after the document is printed
onbeforeprint Script to be run before the document is printed
onbeforeonload Script to be run before the document loads
onerror Script to be run when an error occur
onhaschange Script to be run when the document has changed
onmessage Script to be run when the message is triggered
onoffline Script to be run when the document goes offline
ononlineNew Script to be run when the document comes online
onpagehide Script to be run when the window is hidden
onpageshow Script to be run when the window becomes visible
onpopstate Script to be run when the window’s history changes
onredo Script to be run when the document performs a redo
onresize Script to be run when the window is resized
onstorage Script to be run when the document loads
onundo Script to be run when the document performs an undo
onunload Script to be run when the user leaves the document
FORM
oncontextmenu Script to be run when a context menu is triggered
onformchange Script to be run when a form changes
onforminput Script to be run when a form gets user input
oninput Script to be run when an element gets user input
oninvalid Script to be run when an element is invalid
DRAG & DROP
ondrag Script to be run when an element is dragged
ondragend Script to be run at the end of a drag operation
ondragenter Script to be run when an element has been dragged to a valid drop target
ondragleave Script to be run when an element leaves a valid drop target
ondragover Script to be run when an element is being dragged over a valid drop target
ondragstart Script to be run at the start of a drag operation
ondrop Script to be run when dragged element is being dropped
SCROLL
onmousewheel Script to be run when the mouse wheel is being rotated
onscroll Script to be run when an element’s scrollbar is being scrolled
MEDIA
oncanplay Script to be run when a file is ready to start playing (when it has buffered enough to begin)
oncanplaythrough Script to be run when a file can be played all the way to the end without pausing for buffering
ondurationchange Script to be run when the length of the media changes
onemptied Script to be run when something bad happens and the file is suddenly unavailable (like unexpectedly disconnects)
onended Script to be run when the media has reach the end (a useful event for messages like “thanks for listening”)
onerror Script to be run when an error occurs when the file is being loaded
onloadeddata Script to be run when media data is loaded
onloadedmetadata Script to be run when meta data (like dimensions and duration) are loaded
onloadstart Script to be run just as the file begins to load before anything is actually loaded
onpause Script to be run when the media is paused either by the user or programmatically
onplay Script to be run when the media is ready to start playing
onplaying Script to be run when the media actually has started playing
onprogress Script to be run when the browser is in the process of getting the media data
onratechange Script to be run each time the playback rate changes (like when a user switches to a slow motion or fast forward mode)
onreadystatechange Script to be run each time the ready state changes (the ready state tracks the state of the media data)
onseeked Script to be run when the seeking attribute is set to false indicating that seeking has ended
onseeking Script to be run when the seeking attribute is set to true indicating that seeking is active
onstalled Script to be run when the browser is unable to fetch the media data for whatever reason
onsuspend Script to be run when fetching the media data is stopped before it is completely loaded for whatever reason
ontimeupdate Script to be run when the playing position has changed (like when the user fast forwards to a different point in the media)
onvolumechange Script to be run each time the volume is changed which (includes setting the volume to “mute”)
onwaiting Script to be run when the media has paused but is expected to resume (like when the media pauses to buffer more data)

In addition to the HTML additions for version 5, there are some syntx items that are no longer supported in version 5.
TAGS REMOVED

  • <acronym>
  • <applet>
  • <basefont>
  • <big>
  • <center>
  • <dir>
  • <font>
  • <frame>
  • <frameset>
  • <noframes>
  • <strike>
  • <tt>
  • <u>
  • <xmp>

EVENTS REMOVED

  • onreset

Did I miss anything ?

I hope you’ll join me in this new web standards development journey !

Please comment. Post additions, requests, thoughts, questions !

Article Global Facebook Twitter Myspace Friendfeed Technorati del.icio.us Digg Google Yahoo Buzz StumbleUpon Eli Pets