Microformats HTML5 et noms d'attributs associés_html5 conseils du didacticiel

Le 29 mai 2004, après avoir retiré le blog et toutes les discussions, j'ai interrogé 40 concepteurs sur leurs sites Web pour voir quelles conventions ils utilisaient pour les éléments de page courants tels que les en-têtes et les bannières, la navigation, le contenu et le pied de page (résultat à partir de cette époque).

Il ne s'agissait pas d'une étude scientifique, mais en juin de la même année, j'ai donné suite à certains commentaires d'Eric Meyer et publié un ensemble de conventions de dénomination. Je suis toujours heureux lorsque je trouve un site Web qui a adopté ces conventions de nommage et je l'utilise encore tous les jours, même plus de 4 ans plus tard.

Mes pensées à cette époque peuvent être résumées comme suit

Les noms des attributs id et class doivent refléter la fonction ou le contenu de l'élément, et non la présentation. L'en-tête a donc été supprimé et la marque a été introduite ; le pied de page a été supprimé et remplacé par les informations sur le site.

La dénomination devrait adopter presque une structure de style XML. Ainsi, le contenu intérieur comprend content-main , content-sub et content-supp .

Ces conventions m'ont bien servi, et ce que j'ai fait n'a guère changé leur noyau. Sans aucun doute, ils rendent mon travail plus rapide, plus cohérent et plus bénéfique. Ils facilitent la création de produits et éduquent les personnes avec qui je travaille sur ma façon de penser. La convention de dénomination fonctionne.

Microformats et noms d'attributs associés

Soyons réalistes, les microformats comme hCard, hCalendar, hAtom et d'autres brouillons apportent tellement de valeurs d'attribut à la table Il n'est souvent pas nécessaire de réfléchissez au fichier de construction ou aux hooks de modèle CSS de contrainte fournis pour ces autres valeurs de propriété. Maintenant, j'utilise les microformats à tel point que je développe la page entière sans même utiliser l'attribut class (autre que l'attribut class fourni avec les microformats).

Dans les rares cas où j'ai besoin d'ajouter un nouvel élément (en supposant une division à des fins de mise en page), ma première pensée est d'étendre le microformat qui existe déjà. Je vais vous donner un exemple d'utilisation du mode hAtom :

Title Main content Related content Titre< /h2> Contenu principal > Contenu associé

Si vous conservez l'avantage des microformats, vous avez remarqué que l'entrée liée ne fait pas partie du modèle hAtom, mais dans ce cas, je devais absolument, définitivement avoir un facteur supplémentaire sur la façon dont il était composé. une valeur d'attribut comme les liens latéraux associés ?

Quand semble-t-il plus logique d’étendre le modèle de dénomination des microformats ?

HTML5

Au début de ce chapitre, je dois dire franchement qu'en ce moment, je ne peux pas accorder moins d'attention au HTML5. Mais là n’est pas le nœud du problème. HTML5 introduit de nouveaux éléments potentiellement très utiles, tels que :

rubrique

Une section normale de fichier ou d'application. Les chapitres, dans ce contexte, sont une classification thématique du contenu.

article

Une partie d'une page composée d'articles qui forment une partie indépendante d'un document, d'une page Web ou d'un site Web. Il peut s'agir d'un message de forum, d'un article de magazine ou de journal, d'une entrée de journal Web, d'un commentaire soumis par un utilisateur ou de tout autre élément de contenu indépendant.

à part

Partie d'une page constituée d'un contenu indépendant du contenu associé à l'élément de côté et pouvant être considérée comme distincte du contenu. Ces sections apparaissent souvent sous forme de barres latérales typographiques.

Comme il était logique pour les inventeurs des microformats de baser leurs schémas sur des spécifications existantes, il est sûrement logique que j'adapte mes conventions de nommage pour suivre celles du HTML5. Il est logique que certaines spécifications fassent évoluer leurs modèles, sûrement ? et maintenant, il est logique pour moi de suivre HTML5 en adaptant mes conventions de dénomination ? Bien sûr, je ne peux pas encore l'utiliser :

Title Main content 🎜>Contenu principal <à part>

Title Main content Related content

Mais maintenant, je peux utiliser les valeurs des attributs id et class pour m'aider à me familiariser avec HTML5, en rapprochant encore plus mes documents.

Titre > Contenu principal /div>

J’ai l’impression que c’est la prochaine étape logique pour moi. Jetez donc un œil à cet exemple de document dans lequel j'ai pris des éléments HTML5 comme base de ma convention de dénomination. En plus de ce que je viens de mentionner, notez que j'ai déterminé le mode de classification et de navigation (nav), utilisé colgroup et col pour créer des champs, converti une liste non ordonnée en grille et utilisé datagrid. Les spécifications des balises HTML5 incluent également des détails, une boîte de dialogue et une figure, que je peux également utiliser comme valeurs d'attribut. Si je pouvais exaucer un souhait aujourd'hui, ce serait que tous les développeurs de framework CSS adoptent la même convention de dénomination (et intègrent également largement les microformats) afin que les personnes novices en matière de balisage significatif et de CSS aient le droit. utilisez des attributs plus significatifs et logiques au lieu des attributs superficiels d'identification et de classe.