# Le langage HTML/HTML5

* Introduction
* Structure de base
* Bien commencer le HTML
* L'en-tête
* Caractères spéciaux et entités
* Titre et paragraphes
* Style de texte
* Placement des objets
* Liens
* Images
* Listes
* Tableaux
* Formulaires
* Cadres
* Multimédia
* Internationalisation
* Autres balises
* Zones de mise en forme
* XML et XHTML
* HTML5
* Conclusion
* Mots réservés
* Introduction
* Structure de base
* Bien commencer le HTML
* L'en-tête
* Caractères spéciaux et entités
* Titre et paragraphes
* Style de texte
* Placement des objets
* Liens
* Images
* Listes
* Tableaux
* Formulaires
* Cadres
* Multimédia
* Internationalisation
* Autres balises
* Zones de mise en forme
* XML et XHTML
* HTML5
* Conclusion
* Mots réservés
[ Modifier le sommaire ]
La version 5 de HTML est supportée par les navigateurs actuels. Elle apporte plusieurs nouveautés intéressantes.

## Le doctype

En HTML5, le doctype a été réduit au strict minimum. Cette version du langage ne nécessite plus de versions du DOCTYPE comme en HTML 4.0 et XHTML 1.0.

## La syntaxe

En HTML5, vous avez le choix entre utiliser une syntaxe SGML (comme HTML 4) ou XML (comme XHTML). Prenez juste garde à être cohérent dans votre choix.
De plus, les balises <style> et <script> n'ont plus besoin systématiquement de l'attribut type. S'il n'est pas précisé, la balise <style> accepte le css par défaut, tandis que la balise <script>, elle, accepte le javascript.

## data

L'attribut "data-" permet de renseigner des données dans les balises HTML, séparées par "-", mais on peut aussi leur affecter des valeurs avec "=".
Exemple :
Le fait de sectionner des data en JavaScript est plus lent que de sélectionner des classes, lui-même plus lent que d'utiliser les id.

## Balises obsolètes

<center>, <font>, <strike>, <tt>, <blink>, <big>.

## Attributs obsolètes

* name sur l'élément <a> pour créer une ancre, remplacé par l'utilisation de l'attribut id sur n'importe quel élément (compatible HTML4 et HTML5).

## Nouvelles balises

<article>, <aside>, <footer>, <header>, <nav>, <section>.

### <canvas>

La balise <canvas> permet de créer une zone de dessin. On utilise ensuite du JavaScript pour créer/animer celle-ci.
Exemple :
Ce code affichera :
Cet exemple est basique, mais canvas devrait permettre de créer des animations qui n'étaient avant possibles qu'avec Flash.
Voir aussi
Programmation objet et géométrie#Géométrie avec html5

### <audio>

La balise <audio> permet d'afficher un lecteur audio. L'avantage par rapport aux balises <object> et <embed> est que le fichier est lu directement par le navigateur, il n'y a plus besoin de plugin.
Elle s'utilise comme ceci :
Les attributs autoplay, controls et loop sont facultatifs. Ils permettent respectivement de lancer automatiquement la lecture, d'afficher les boutons lecture/arrêt et de lire la piste en boucle.
Vous pouvez aussi spécifier plusieurs sources, dans différents formats, comme ceci :
Le navigateur choisira alors le format qui lui convient le mieux.

### <video>

La balise <video> s'utilise comme la balise <audio>, sauf qu'il faut préciser les dimensions de la vidéo, ainsi que le type MIME du fichier :

## Faire un livre dont vous êtes le héros
### Idée maîtresse

L’arborescence classique est :
       ./scripts
       ./styles
       ./assets <-- c'est ici que viennent les images et les sons
       ./assets/images

### Résultat

Le résultat HTML peut être porté sur tablette ou smartphone. J'ai prévu les screenshots suivant pour un petit web serial sur smartphone.

## Références

* ↑ http://www.w3schools.com/tags/att_global_data.asp
* ↑ http://jsperf.com/id-vs-class-vs-data-attribute