« Le langage HTML/HTML5 » : différence entre les versions
Introduction à HTML5 |
(Aucune différence)
|
Version du 1 août 2010 à 12:33
La prochaine version de HTML sera la version 5. Elle n'est pas encore finalisée mais rien ne vous empêche de l'utiliser dans vos pages, surtout qu'elle apporte plusieurs nouveautés intéressantes.
Le doctype
En HTML5, le doctype a été simplifié au strict minimum :
<!Doctype HTML>
C'est tout. Pas besoin de spécifier la version.
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 de l'attribut type
.
<canvas>
La nouvelle balise <canvas> permet de créer une zone de dessin vectoriel. On utilise ensuite du JavaScript pour créer/animer le dessin.
Exemple :
<canvas id="myCanvas" width="300" height="200" /> <script> var canvas=document.getElementById("myCanvas"); var context=canvas.getContext("2d"); context.strokeStyle="#900"; context.strokeRect(20,30,100,50); </script>
Cet exemple est basique, mais canvas devrait permettre de créer des animations qui n'étaient avant possibles qu'avec Flash.
<audio>
La balise <audio> permet d'afficher un lecteur audio. L'avantage par rapport aux balises <object> et <embed> est que le fichier ets lu directement par le navigateur, il n'y a plus besoin de plugin.
Elle s'utilise comme ceci :
<audio src="monfichier.mp3" autoplay controls loop />
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 :
<audio> <source src="monfichier.mp3" /> <source src="monfichier.ogg" /> </audio>
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 :
<video width="360" height="240"> <source src="movie.ogv" type="video/ogg" /> <source src="movie.mp4" type="video/mp4" /> </video>