Balise HTML5 : Parle à ma « main »

Rigueur. Et passion !

Ne dites pas à ma mère que je suis artisan en architecture de l'information appliquée aux sites web : elle croit que je suis webdesigner, intégrateur HTML & CSS, rédacteur web, formateur NTIC et consultant en webmarketing depuis 2001 ! Voulez-vous en savoir plus ?

Le blog de l'intégrateur web

Balise HTML5 : Parle à ma « main »

A compter d’aujourd’hui, l’élément html5 main pourrait rejoindre la panoplie du parfait intégrateur web à côté des autres balises permettant de regrouper du contenu palpable. Ce nouvel élément a pour mission de devenir la cible privilégiée du lien d’évitement « Skip to link » ou « Aller au contenu principal ». Comment l’utiliser ? C’est simple, il devrait tout simplement remplacer la <div role=’main’> que vous utilisez certainement depuis longtemps !

Pour lui appliquer des styles CSS, il suffit de lui faire subir le même sort que les autres balises HTML5 article, aside, figcaption, figure, footer, header, hgroup*, nav et section : main { display: block }. Plus simple encore, cette balise est déjà disponible dans le script html5shiv.js qu’il vous suffira d’intégrer dans votre… intégration !

Parmi les restrictions, on notera que l’élément main :

  • Est prévu pour être seul (pas deux main dans un document),
  • Ne doit pas être utilisé à l’intérieur des éléments article, aside, footer, header ou nav,
  • Se porte mieux avec l’attribut ARIA qui va bien <main role="main"></main>,
  • N’est pas prévu, d’une manière générale, pour servir de contenu principal d’une sous-section.

→ Merci à @bpierre pour l’information o/

* L’élément hgroup ne fait plus partie des spécifications, mais bon, en attendant qu’il disparaisse totalement…

Articles sur le même sujet

PS : Le respect de la vie privée sur internet est important : j'ai décidé d'échanger mon bouton Like de Facebook par un bouton Faire un don de Paypal car
Il n'y pas d'amour, il n'y a que des preuves d'amour (Jean Cocteau) ;) Merci d'avance.



6 commentaires pour “Balise HTML5 : Parle à ma « main »”

  1. Luc dit :

    Encore une balise qui ne sert à rien.

    Si je ne me trompe pas, il n’y a pas de propriété spécifique pour faire un lien d’évitemment, (si ?) donc le « skip to link », est un a href= »contenuprincipal » avec dans la source html un #contenuprincipal que ce soit donc div#contenuprincipal ou main#contenuprincipal aucune différence…

    Encore une balise bullshit qui va simplement simplifier le travail aux rotot (qui à dit « à google » pour identifier la zone de contenu principale d’un site…

    KTHXBY

  2. Olivier C dit :

    Eh! Je ne viens pas souvent ici mais je m’aperçois que j’ai tort car j’ai toujours la surprise agréable d’apprendre quelque chose que je n’ai pas déjà lu 20 fois ailleurs : la dernière fois que je suis venu j’avais appris la disparition de hgroup. Merci pour cette info intéressante.

  3. ligne votre dit :

    l’élément html5 main pourrait rejoindre la panoplie du parfait intégrateur web à côté des autres balises permettant nike blazer de regrouper du contenu palpable

  4. Amedee Marois dit :

    Bonjour, à la question peut-on mettre le nombre d’or à toutes les sauces,Chaussures Prada,souris pour les ressortir au moment opportun.

  5. parfait intégrateur dit :

    qui résulte de la fusion des frameworks System, Blueprint The Simpler Grid nike air jordan dont il reprend les meilleures idées

  6. tradethik dit :

    Encore une balise bullshit qui va simplement simplifier le travail aux rotot (qui à dit « à google » pour http://www.tradethik.fr/ identifier la zone de contenu principale d’un site

Laissez un commentaire

Vous pouvez utiliser les balises HTML suivantes : <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Les commentaires sont publiés sous votre pleine et entière responsabilité et ne doivent pas contrevenir aux lois et règlementations en vigueur. Les propos racistes ou antisémites, diffamatoire ou injurieux, divulguant des informations fausses, relatives à la vie privée d'une personne ou utilisant des oeuvres protégées par les droits d'auteurs ne sont pas les bienvenus et seront modérés sans modération.

Merci d'être constructif et n'oubliez pas : « sans la liberté de ramer il n'est point d'éloge flotteur ! »



Colophon

CSS & Webdesign est une publication irrégulomadaire à tendance hebdomadaire
éditée par Bruno Bichet qui carbure à WordPress et au café équitable.
Tous droits réservés © 2006 - 2011.

Contactez l'auteur du site