La première ébauche du HTML 5

 Le 23 janvier 2008 • Développement • Web

Le W3C l’a annoncé hier, une première ébauche du HTML 5 a vu le jour! Retrouvez le document officiel ici.

Les nouvelles balises

Au programme plein de nouvelles balises, les voici accompagnées de leurs utilisations :

• section :
  Représente un document générique ou une section de l’application. Il peut être utilisé conjointement avec h1-h6 pour indiquer la structure du document.
• article :
  Représente un élément de contenu d’un document, comme une entrée de blog ou article de journal.
• aside :
  Représente un morceau de contenu qui n’est que légèrement en relation avec le reste de la page.
• header :
  Représente la tête d’une section.
• footer :
  Représente un pied de page et d’une section peut contenir des informations sur l’auteur, les informations de copyright, etc.
• nav :
  Représente une section du document destiné à la navigation.
• dialog :
  Peut être utilisé pour marquer une conversation comme ceci:

  <dialog><dt> Costello
  <dd> Look, you gotta first baseman?
  <dt> Abbott
  <dd> Certainly.
  <dt> Costello
  <dd> Who's playing first?
  <dt> Abbott
  <dd> That's right.
  <dt> Costello
  <dd> When you pay off the first baseman every month, who gets the money?
  <dt> Abbott
  <dd> Every dollar of it.
  </dialog>

• figure :
  Peut être utilisé pour associer une légende avec du contenu, comme un graphique ou une vidéo:

  <figure><video src=ogg>…</video>
  <legend>Example</legend>
  </figure>

• audio et video :
  Pour les contenus multimédias.
• embed :
  Pour le contenu des plugins.
• m :
  Délimite un texte marqué.
• meter :
  Représente une mesure, telle que l’utilisation du disque.
• time :
  Représente une date ou/et un temps.
• canvas :
  Est utilisé pour le rendu des graphiques dynamiques (existe déjà sous Firefox).
• command :
  Représente une commande que l’utilisateur peut invoquer.
• datagrid :
  Représente une arborescence ou des données tabulaires.
• details :
  Représente un complément d’information ou des contrôles que l’utilisateur peut obtenir sur demande.
• datalist :
  avec une nouvelle liste d’attribut input est utilisé pour fabriquer des comboboxes :

  <input list=browsers><datalist id=browsers>
  <option value="Safari">
  <option value="Internet Explorer">
  <option value="Opera">
  <option value="Firefox">
  </datalist>

• datatemplate, rule, et nest :
  Permettent un mécanisme de gabarits.
• event-source :
  Est utilisée pour « attraper » les événements envoyés par le serveur.
• output :
  Représente le type de sortie, comme à partir d’un calcul effectué par le biais de scripts.
• progress :
  affiche une barre de progression.

Les balises en moins

Et oui, ce n’est pas tout d’ajouter de nouvelles balises il faut aussi faire le ménage de celles jugées inutiles! Les voici :

• basefont
• big
• center
• font
• s
• strike
• tt
• u
• frame
• frameset
• noframes

Les nouveau types d’input

Nouveautés pour les formulaires, des ajouts type :

• datetime
• datetime-local
• date
• month
• week
• time
• number
• range
• email
• url

L’idée de ces types serait de permettre d’ouvrir directement un calendrier pour sélectionner une date (tous les inputs du type temps) ou de permettre l’accès au carnet d’adresse de l’utilisateur et formater les données au format voulu.
On va économiser des scripts ici!

D’autres nouveautés?

Oui! Il y en a encore beaucoup au niveau des attributs mais là, je vous laisse les découvrir sur la doc officielle, elles sont vraiment nombreuses et j’avoue m’être plus intéressé aux balises.

Qu’est ce que vous en pensez?

Il faut déjà se dire que rien n’est encore fixé, ce n’est que la première ébauche.
Mais il apparaît évident que l’on cherche à réduire les frontières entre le HTML et le JavaScript, ce qui est une bonne chose, à mon avis.

Et vous, comment est-ce que vous voyez venir ces changements?