L'été dernier, j'ai lu l'intégralité de la spécification HTML5, ainsi que toutes les précédentes spécifications HTML (même celles qui ont été abandonnées), ainsi que toutes les spécifications CSS que j'ai pu trouver, ainsi que de nombreuses spécifications XML. Comme j'aime les documents hypertextes riches sur le plan sémantique, permettez-moi de vous donner une idée de la sémantique HTML pertinente en HTML5.
Avant HTML5
Avant HTML5, iet bétaient effectivement démodés. La raison en était qu’ils fonctionnaient essentiellement comme emet strong, respectivement, mais en mettant l’accent sur la présentation et non sur la sémantique (ce qui est mauvais).
En effet, cela isignifiait que le texte devait être en italique (il expliquait comment le texte devait être restitué à l'écran). Par contre, cela emsignifiait que le texte devait être mis en valeur (il en disait quelque chose sur la sémantique du texte).
Il y a une différence théorique importante ici. Si vous utilisez em, l'agent utilisateur (= browser) sait que le texte doit être mis en évidence. Il peut donc être affiché en italique si le document est affiché à l'écran (ou en majuscule si le formatage n'est pas possible, ou peut-être même en gras. l'utilisateur préfère cela), il peut le prononcer différemment si le document est parlé à l'utilisateur, etc.
Notez que l'accent est vraiment mis sur la sémantique. Par exemple, les phrases
- Le chat est à moi. (= pas le chien!)
- Le chat est à moi . (= pas le vôtre!)
n'ont pas le même sens.
La même différence s'applique à b(police en gras) et à strong(accentuation forte).
Un principe général de l'écriture numérique en général, et de la création d'hypertextes en particulier, est qu'il est nécessaire de séparer le contenu et le style. Dans la création hypertexte, cela signifie que le contenu doit être dans le fichier HTML et que le style doit être dans un fichier CSS (ou dans un certain nombre de fichiers CSS). Un principe différent mais connexe est que le document doit être riche en sémantique (comme le balisage d’en-têtes, de pieds de page, de listes, d’accent, de adresses, de zones de navigation, etc.). Cela présente de nombreux avantages:
- Il est beaucoup plus facile pour les programmes informatiques d’interpréter le document. Ces programmes incluent des navigateurs, des applications de synthèse vocale, des moteurs de recherche et des assistants numériques. (Par exemple, le navigateur peut vous permettre de sauvegarder une adresse dans votre carnet d'adresses si seulement il pouvait la trouver et l'interpréter. De plus, vous savez peut-être que Microsoft Word peut créer et mettre à jour automatiquement une table des matières pour vous si vous marquez correctement vos en-têtes. .)
- Il est beaucoup plus facile de changer le style plus tard. (Si vous souhaitez modifier la couleur de tous les titres de troisième niveau de votre document de 860 pages, vous pouvez modifier une seule ligne dans la feuille de style. Si vous aviez mélangé le contenu et la présentation, vous auriez à parcourir le document entier manuellement. Et vous manqueriez probablement un titre ou deux, ce qui rendrait le document peu professionnel.)
- Vous pouvez utiliser différentes feuilles de style en fonction des circonstances (le document est-il affiché à l'écran ou imprimé sur papier?). Vous pouvez même laisser l’utilisateur final choisir lui-même le style. (Mon site Web propose un certain nombre de feuilles de style alternatives. Dans IE et FF, vous les modifiez à l’aide du menu Affichage.)
Donc, en bref, iet bont été déconseillés parce qu’il s’agissait de balises HTML concernées par la présentation , ce qui est totalement faux.
En HTML5
En HTML5 iet bne sont plus obsolètes. Au lieu de cela, ils ont une signification sématique . Donc, ils concernent à présent la sémantique et non la présentation.
Comme auparavant, vous utilisiez empour souligner: "Le chat est à moi." Mais vous utilisez ipour presque tous les autres cas où vous utiliseriez l'italique dans un travail imprimé. Par exemple:
- Vous
ibalisiez les désignations taxonomiques: "J'aime R. norvegicus ."
- Vous utilisez
ipour marquer une phrase dans une langue différente de celle du texte environnant: À la carte
- Vous utilisez
ipour marquer un mot lorsque vous parlez du mot lui-même: " boire est à la fois un nom et un verbe"
C'est également une bonne idée d'utiliser l' classattribut pour spécifier l'utilisation précise (également "microformat" et "microdonnées" de Google). Et, bien sûr, dans le second cas, vous devriez vraiment utiliser l' langattribut pour spécifier la langue correcte. (Sinon, par exemple , un agent de synthèse vocale pourrait mal prononcer le texte.)
Il y a un an environ, la spécification HTML5 indiquait également qu'il citefallait utiliser pour baliser les noms de livres, films, opéras, peintures, etc.:
- Que pensez-vous de Nymphomane ?
Enfin, depuis longtemps, dfnest utilisé pour marquer l'instance de définition d'une phrase dans un texte (comme une définition mathématique, ou la définition d'un terme):
- Un groupe est un ensemble X équipé d'une seule opération binaire * telle que ...
Ainsi, l'italique de votre livre imprimé, qui peut signifier beaucoup de choses différentes, est représenté par quatre balises HTML5 différentes, ce qui est vraiment génial, car la sémantique est bonne, comme j'ai essayé de vous convaincre plus tôt. (Par exemple, vous pouvez demander à votre navigateur de dresser une liste de toutes les définitions dans le texte afin de vous assurer de les connaître toutes avant l’examen.)
En ce qui concerne strongand b, la spécification HTML5 indique que strongvous devez utiliser cette option pour baliser une partie importante du texte, comme un avertissement ou un mot très important dans une phrase. D'autre part, bdevrait être utilisé pour marquer les éléments qui doivent être faciles à trouver dans le texte, comme les mots-clés. J'utilise aussi bcomme en-tête dans les éléments de liste (LI).
<b>et je ne suis<i>pas déconseillé.