L'une des balises que vous apprendrez tôt dans votre création de sites web l'éducation est une paire de balises connues sous le nom de « balises d'accentuation ». Voyons ce que sont ces balises et comment elles sont utilisées dans la conception de sites Web aujourd'hui.
Retour à XHTML
Si vous avez appris le HTML il y a des années, bien avant l'essor de HTML5, vous avez probablement utilisé à la fois les balises gras et italique. Comme vous vous en doutez, ces balises transformaient les éléments en texte en gras ou en texte en italique respectivement. Le problème avec ces balises, et pourquoi elles ont été écartées au profit de nouveaux éléments (que nous verrons bientôt), est qu'elles ne sont pas des éléments sémantiques. C'est parce qu'ils définissent l'apparence du texte plutôt que des informations sur le texte. Rappelez-vous, HTML (c'est là que ces balises seraient écrites) est une question de structure, pas de style visuel! Les visuels sont gérés par CSS et les meilleures pratiques de conception Web ont longtemps soutenu que vous devriez avoir une séparation claire du style et de la structure dans vos pages Web. Cela signifie ne pas utiliser d'éléments qui ne sont pas sémantiques et dont le détail ressemble plutôt que la structure. C'est pourquoi les audacieux et
italique les balises ont généralement été remplacées par strong (pour le gras) et l'emphase (pour l'italique).et
Les éléments forts et d'emphase ajoutent des informations à votre texte, détaillant le contenu qui doit être traité différemment et mis en valeur lorsque ce contenu est prononcé. Vous utilisez ces éléments à peu près de la même manière que vous auriez utilisé les caractères gras et italiques dans le passé. Entourez simplement votre texte des balises d'ouverture et de fermeture ( et pour l'accent et et pour une forte emphase) et le texte ci-joint sera souligné.
Vous pouvez imbriquer ces balises et peu importe quelle est la balise externe. Voici quelques exemples.
Ce texte est souligné et la plupart des navigateurs l'afficheraient en italique.
Ce texte est fortement souligné et la plupart des navigateurs l'afficheraient en gras.
Dans ces deux exemples, nous ne dictons pas l'aspect visuel avec le HTML. Oui, l'apparence par défaut du tag serait en italique et le serait audacieux, mais ces apparences pourraient facilement être modifiées en CSS. C'est le meilleur des deux mondes. Vous pouvez tirer parti des styles de navigateur par défaut pour obtenir du texte en italique ou en gras dans votre document sans réellement franchir la ligne et mélanger la structure et le style. Dis que tu voulais ça texte non seulement en gras mais aussi en rouge, vous pouvez l'ajouter au SCS.
fort {
La couleur rouge;
}
Dans cet exemple, vous n'avez pas besoin d'ajouter une propriété pour le gras font-weight puisque c'est la valeur par défaut. Si vous ne voulez pas laisser cela au hasard, vous pouvez toujours l'ajouter dans:
fort {
font-weight: gras ;
La couleur rouge;
}
Maintenant, vous seriez presque assuré d'avoir une page avec du texte en gras (et rouge) partout où le la balise est utilisée.
Doublez l'accent
Une chose que nous avons remarquée au cours de l'année est ce qui se passe si vous essayez de doubler l'accent. Par example:
Ce texte doit avoir à la fois en gras et en italique texte à l'intérieur.
On pourrait penser que cette ligne produirait une zone contenant du texte en gras ET en italique. Parfois, cela se produit effectivement, mais nous avons vu certains navigateurs n'honorer que le deuxième des deux styles d'accentuation, le plus proche du texte en question, et ne l'afficher qu'en italique. C'est l'une des raisons pour lesquelles nous ne doublons pas les balises d'emphase.
Une autre raison d'éviter ce "doublement" est à des fins stylistiques. Une forme d'emphase est généralement suffisante pour donner le ton que vous souhaitez donner. Vous n'avez pas besoin de mettre en gras, en italique, de colorier, d'agrandir et de souligner le texte pour qu'il se démarque. Ce texte, avec tous ces différents types d'emphase, deviendrait criard. Soyez donc prudent lorsque vous utilisez des balises d'emphase ou des styles CSS pour accentuer et n'en faites pas trop.
Une note sur les caractères gras et italiques
Une dernière pensée - tandis que les audacieux () et en italique () ne sont plus recommandés pour être utilisés comme éléments de mise en évidence, certains concepteurs de sites Web utilisent ces balises pour styliser les zones de texte en ligne. Fondamentalement, ils l'utilisent comme un élément. C'est bien car les balises sont très courtes, mais l'utilisation de ces éléments de cette manière n'est généralement pas recommandée. Nous le mentionnons au cas où vous le verriez sur certains sites utilisés non pas pour créer du texte en gras ou en italique, mais pour créer un crochet CSS pour un autre type de style visuel.