Code : HTML5 - les nouveaux tags

01 mai 2010


Code : HTML5 - les nouveaux tags

Bien que le codage HTML 5 n’ai pas encore obtenu de validation W3C, il est temps de commencer à le  comprendre et à travailler avec, puisque c’est le type de conception web et de développement du futur.

HTML5 fournit certaines nouvelles caractéristiques en matière de médias comme l’encodage audio, vidéo, le graphisme, et du côté des clients, des possibilités de stockage de données et des documents interactifs dans les pages Web. Son but étant d’apporter de la clarté et de réduire les coûts de développement grâce à des règles précises sur la manière de gérer tous les éléments HTML.

html 5

Plusieurs nouveaux tags ont étés ajoutés au HTML 5, (pas présents dans les versions antérieures de HTML). Je vous propose un petit aperçu de ces nouvelles balises ainsi qu’un PDF contenant toutes les balises HTML5

Mais avant, si vous désirez en savoir plus sur le HTML5, n’hésitez pas à lire cet article : Introduction au HTML5

<article>

La balise définit le contenu externe. Ce contenu peut être un article  externe, ou un texte à partir d’un journal web (blog), ou un texte à partir d’un forum, ou tout autre contenu depuis une source externe.

<aside>

La balise définit un contenu mis à part.

<audio>

La balise définit un son, comme la musique ou d’autres flux audio.

<canvas>

Cette balise  est utilisé pour afficher uniquement des graphiques.

<command>

Elle définit un bouton de commande, comme un bouton radio, une case à cocher ou un bouton. L’élément de commande doit être l’intérieur d’un élément de menu, sinon, il ne sera pas affiché.

<datalist>

La balise <datalist> définit une liste d’options.

<details>

La balise <details> est utilisée pour décrire les détails d’un document, ou des parties d’un document.

<embed>

La balise <embed> définit un contenu embarqué, comme un plug-in.

<figcaption>

La balise <figcaption> contient une légende pour la figure “élément”. Le figcaption  doit être placé comme le premier ou le dernier enfant de la figure” élément “.

<figure>

La balise <figure> est utilisée pour regrouper certains éléments. Elle est généralement utilisée pour expliquer des parties d’un document, mais aussi capable de se déplacer dans le document et le mettre ailleurs.

<footer>

La balise <footer> définit le pied de page d’un article ou un document. Elle contient généralement le nom de l’auteur, la date du document a été écrit et /ou les coordonnées.

<header>

La balise <header> définit une introduction au document.

<hgroup>

La balise <hgroup> définit le titre d’un article ou un document. L’élément est utilisé pour les balises <h1> à <h6>, où le plus important est la ligne principale de la section, et les autres sont des sous-rubriques.

<keygen>

La balise <keygen> définit une clé générée.

<mark>

La balise <mark> définit  un texte marqué. Utilisez la balise <mark> si vous voulez mettre en évidence les parties de votre texte.

<meter>

La balise <meter> définit une mesure. Utilisée seulement pour les mesures connue et une valeur maximale.

<nav>

La balise <nav> définit une section de la navigation.

<output>

La balise <output> définit les différents types de production, telles que la production écrite par un script.

<progress>

La balise <progress> définit le travail en cours. Utilisez l’élément pour afficher la progression d’un temps  en fonction de la consommation.

<rp>

La balise <rp> est utilisée dans les annotations ruby.

<rt>

La balise <rt> définit une explication ou la prononciation des caractères (notes chinois ou caractères). Employée au Asie de l’Est, pour montrer la prononciation des caractères asiatiques.

<ruby>

La balise <ruby> définit une annotation ruby (note chinois ou caractères). Employée au Asie de l’Est, pour montrer la prononciation des caractères asiatiques. Utilisez-le avec la <rt> et / ou le <rp> tags: . L’élément ruby est constitué d’un ou plusieurs caractères (qui nécessite une explication / prononciation), et un élément rt qui donne cette information, et éventuellement un élément rp qui définit ce que pour montrer les navigateurs qui ne supportent pas le “ruby” tag.

<section>

La balise <section> définit les sections dans un document. Comme des chapitres, en-têtes, pieds de page, ou toutes autres sections du document.

<source>

La balise <source> définit les ressources des médias pour des éléments multimédias, tels que <video> et <audio>.

<summary>

La balise <summary> contient un en-tête pour les «détails» élément, qui est utilisé pour décrire les détails d’un document, ou de parties d’un document.

<time>

La balise <heure> définit un délai ou une date, ou les deux.

<video>

La balise <video> définit vidéo, comme un clip vidéo ou d’autres cours d’eau.

Fichier PDF - Source


Et si cet article vous a plu, vous pouvez lire aussi :

Commentaires

16 Réponses to “Code : HTML5 - les nouveaux tags”

  1. Commentaire de Annonce déposé le 1 mai 2010

    Ca fait une sacrée liste : il y a des tags dont je n’avais jamais entendu parlé, je suis pas sûr qu’ils soient tous très utiles …

  2. Commentaire de Motercalo déposé le 6 mai 2010

    En effet pas mal de nouveaux tags mais pas grand chose de réellement important je trouve.. on est encore loin du web sémantique. par exemple, je n’en comprend pas vraiment l’utilité !

  3. Commentaire de graphiste nesk déposé le 18 mai 2010

    Encore faut-il attendre que les internautes mettent à jour leurs navigateurs pour avoir une bonne compatibilité. Aujourd’hui il est trop tôt pour s’en servir, mais comme tu dis, il faut commencer à s’y mettre !!

  4. Commentaire de Matthieu déposé le 26 mai 2010

    SI j’ai bien compris l’HTML 5 est censé aider à identifier les nouveaux médias (vidéos, images, sons, flash, …).
    Mais est-ce que les ancien encodages de l’HTML seront toujours opérationnels et s’ajoutent à ceux indiquer dans cet article, ou est-ce que tout sera remplacer à termes?

  5. Commentaire de vente privee déposé le 8 juin 2010

    @Matthieu > comme actuellement, c’est le doctype d’une page qui indiquera au navigateur comment l’interpréter. En HTML5 il est en plus très simplifié )

  6. Commentaire de anne74 déposé le 13 juillet 2010

    Plus de news?

  7. Commentaire de graphiste chick déposé le 7 août 2010

    Merci beaucoup pour cette liste, et pour tout ton site! super source d’inspiration en ce mois d’août tout gris… smile

  8. Commentaire de lucie déposé le 28 août 2010

    c’est là que je me rends compte que j’ai encore beaucoup de choses à apprendre en HTML !! j’en note quelques unes de la liste pour tester !

  9. Commentaire de 44 Informatique déposé le 25 septembre 2010

    Que de nouvelles balises à maitriser, heureusement leur emploi est assez simple, à quand la validation ?

  10. Commentaire de Architecte paysagiste déposé le 30 septembre 2010

    Lorsque HTML5 sera la on pourra enfin dire au revoir a flash -)

  11. Commentaire de master MOS déposé le 8 octobre 2010

    Pas de nouvelle depuis mai, pas sympa pour les lecteurs de ce blog.

  12. Commentaire de poker jeu en ligne déposé le 9 octobre 2010

    Le plus dur sera de changer ses habitudes pour utiliser ces nouvelles balises !

  13. Commentaire de koast de cosmétiques bio déposé le 16 octobre 2010

    Bonjour, le html 5 sera opérationnel sur la plupart des navigateurs à partir de quand ou ces tags sont déjà reconnues?

    cordialement

  14. Commentaire de location de bureaux déposé le 19 octobre 2010

    Vivement qu’on puisse dev en HTML5/CSS3 mais il va falloir patienter encore malheureusement, en tous cas merci pour cet article:)

  15. Commentaire de Agence Envergur déposé le 22 octobre 2010

    Il faut commencer à s’y mettre, mais cette évolution n’est pas non plus pour demain..
    Au jour d’aujourd’hui, Il y’a encore des utilisateurs de Internet explorer 6 : 10 ans après sa sortie et complètement obsolète de nos jours…alors je pense que nous avons le temps de voir venir les choses pour le HTML5… )

  16. Commentaire de Audrey déposé le 25 octobre 2010

    Désolée, un petit souci perso, mais je m’y remet )





neutral -) cry oops razz mad * cool ??? shock sad smile grin

Catégories

 

 

papillon webdeez

 

I am a social Butterfly

Tag cloud