« Le langage HTML/HTML5 » : différence entre les versions

Contenu supprimé Contenu ajouté
Tael (discussion | contributions)
Introduction à HTML5
(Aucune différence)

Version du 1 août 2010 à 12:33

Cette page est considérée comme une ébauche à compléter . Si vous possédez quelques connaissances sur le sujet, vous pouvez les partager en éditant dès à présent cette page (en cliquant sur le lien « modifier »).

Ressources suggérées : Aucune (vous pouvez indiquer les ressources que vous suggérez qui pourraient aider d'autres personnes à compléter cette page dans le paramètre « ressources » du modèle? engendrant ce cadre)

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>

Ce code affichera :  

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>