Vous avez sûrement entendu parlé de la nouvelle balise <video> qui permet d'insérer des vidéos directement sur une page sans utiliser de lecteur flash.

Bien entendu c'est loin d'être la seule nouveauté de cette nouvelle technologie.
Les changements ne passe pas uniquement sur ce que l'utilisateur final verra.
En effet, le doctype diffère beaucoup de celui que l'on connait à l'heure actuelle :
En HTML 5 :

<!DOCTYPE html>
<html lang="fr"></html>

Il faut noter que la déclaration du Doctype n'est pas sensible à la casse et qu'il n'y a plus de référence à une DTD.

En XHTML 5 :

<?xml version="1.0" encoding="UTF-8"?>
<html xmlns="http://www.w3.org/1999/xhtml"></html>

On comprend vite qu'il sera plus simple de l'apprendre par coeur !

Concernant le processus de détection de l'encodage ce fait dans l'ordre suivant :

  • Vérification de la présence d'un header HTTP "Content-Type"
  • Détection du BOM en début de fichier
  • Utilisation d'une balise meta spécifique (<meta charset="UTF-8"> par exemple, la syntaxe utilisée dans les versions précédentes étant toujours compatible)

Cependant pour les documents XHTML 5 l'auteur doit spécifier l'encodage dans le prologue XML :

<?xml version="1.0" encoding="UTF-8"?>

Nouvelles balises :

Pour passer aux nouvelles balises, on peut citer :

  • video : Ajouter du contenu vidéo
  • audio : Ajouter du contenu audio
  • aside : Ajouter du contenu sans rapport avec la page
  • header : Spécifier le début de la page
  • footer : Spécifier la fin de la page
  • nav : Section avec beaucoup de liens internes au site
  • progress : Afficher un niveau d'avancement

Cette liste n'est pas exhaustive. Rendez-vous en fin d'article pour plus d'informations.

Les formulaires se voient eux aussi dotés de nouveaux types de champs :

  • datetime : Champ de type date heure
  • date : Champ de type date
  • time : Champ de type heure
  • month : Champ de type mois
  • email : Champ de type E-mail
  • url : Champ de type adresse Web
  • color : Champ de type couleur

Cette liste aussi est loin d'être exhaustive mais vous permet de visualiser les principaux changements.

On peut noter entre autre que l'attribut target dans les liens est à nouveau disponible alors qu'elle était déprécié jusqu'à maintenant.

Balises supprimées :

Beaucoup de changement ont été effectués. Même s'il y a beaucoup de nouveautés, il y a des balises qui elles sont désormais dépréciées :

  • basefont
  • big
  • center
  • font
  • s
  • strike
  • tt
  • u

Elles sont supprimées car c'est aux CSS de faire le boulot.
Les balises frame, frameset et noframes sont supprimés ! Elles étaient déjà dépréciées car elles créaient des problèmes d'accessibilité.

  • acronym : Supprimé car elle créait beaucoup de confusion
  • applet : obsolète en faveur de object

Pour finir, la balise noscript est disponible uniquement dans la version HTML.

API HTML 5 :

HTML 5 permet d'utiliser 8 nouvelles API qui permettront de créer de nouvelles applications et qui peuvent être utilisées ensemble avec de nouveaux éléments introduits pour les applications dont :

  • une API de dessin 2D utilisé avec la nouvelle balise canvas
  • une API pour jouer des vidéos et des sons/musiques utilisé avec les nouvelles balises video et audio
  • une API utilisée pour les applications hors-lignes
  • une API d'édition en combinaison avec le nouvel attribut contenteditable
  • une API de drag and drop en combinaison avec l'attribut draggable
  • une API qui permet l'accès à l'historique et permet aux pages d'en ajouter pour prévenir les problèmes de bouton retour-en-arrière

Connexion et distribution P2P :

HTML 5 se voit doté de la capacité de réaliser des connexions entre utilisateurs PeerToPeerConnection(), et également grâce aux websocket.

Grâce à la création de nouvelles balises, on voit que l'on va pouvoir améliorer le référencement de son site grâce notamment à aside, nav, header er footer.

Bien sûr je n'ai pas tout dit. Mais si je m'étais amusé à le faire, je n'aurais pas fini d'ici un bout de temps. C'est pourquoi je vous invite à lire la page Wikipedia dédié à l'HTML 5 qui vous donnera toutes les infos sur les nouveautés de l'HTML 5.

(Image : LookupTables)