web-dev-qa-db-fra.com

Est-ce une mauvaise pratique pour le référencement d'utiliser <i> dans les éléments d'en-tête?

Pour créer un site Web convivial, je dois utiliser certaines polices Font Awesome dans <h> comme ce qui suit:

<h2>
<i style="color: rgb(102, 149, 45); vertical-align: inherit;" class="fa fa-gear"></i>
 Performance
</h2>

En fait, ceci est un article de synthèse. Est-il possible de mettre ces polices (ou éléments <i>) dans le code HTML interne d'éléments d'en-tête tels que <h1>, <h2>, <h3>, etc.?

Veuillez également fournir votre source ou une documentation, car c’est très important pour moi; Je ne veux pas faire d'erreur sur ce sujet.

11
Amirreza Nasiri

Je dirais que cela ne ferait pas beaucoup de mal, ni rien à ajouter. Je préfère garder mes balises d'en-tête propres et ne pas ajouter le i. Le style en ligne serait un problème plus important, qui n'est pas vraiment un gros problème.

Au lieu de cela, vous pouvez ajouter directement l’icône représentant un engrenage sur le H2:

h2.Geared:before{
    display: inline-block;
    color: rgb(102, 149, 45); 
    font-family: "FontAwesome";
    content: "\f013"; /*The actual character FontAwesome uses */
}

<h2 class="Geared">This text will have the gear</h2>
11
Martijn

Google ne fait presque pas attention aux tags que vous utilisez actuellement. Google se soucie de l'apparence de la page pour les utilisateurs. Il se soucie de savoir quel texte est gros. Il se soucie de savoir quel texte est important. Il se soucie de savoir quel texte est caché. Des tests de référencement récents ont montré qu’il n’y avait aucune différence entre l’utilisation d’une balise <div> dont le style ressemblait à un en-tête et celle d’une balise <h1> pour ce qui est de Google.

Je fronce les sourcils en utilisant des balises pour l'italique plutôt que d'utiliser CSS. Il mélange la sémantique et la présentation. Cependant, d'un point de vue SEO, il ne devrait y avoir aucune conséquence négative ou positive.

6
Stephen Ostermiller