web-dev-qa-db-fra.com

Cacher du texte dans les liens est-il mauvais si les liens sont des polices d'icônes?

J'ai fait quelques tests rapides de référencement d'une page et ils suggèrent tous "d'envisager d'ajouter du texte à des liens". Les liens auxquels ils faisaient référence sont tous des icônes sociales et sont affichés à l'aide de polices d'icônes. J'ai lu différentes questions semblables à celles-ci et la plupart des réponses n'étaient pas claires ou n'ont pas aidé.

Voici des réponses similaires à d'autres questions (avec la façon dont je réagirais dans mon cas):

  1. Ne mettez pas le référencement en premier (je ne l’ai pas fait car j’ai déjà fini avec le site).
  2. Ne réfléchissez pas trop (je ne le suis pas. Cela ne m'a jamais traversé l'esprit avant de faire des scans de référencement).
  3. Faites ce qu'il y a de mieux pour vos lecteurs (ceci affecte les lecteurs d'une manière ou d'une autre puisque je ne change pas réellement l'affichage (bien que cela puisse en fait masquer les lecteurs en ajoutant ceci .. pas sûr).

Pour le moment, ils sont affichés sous forme d'icônes sociales vides, mais apparaissent sous forme de liens sans aucun texte vers les moteurs de recherche. Plus il est inutile d'ajouter mots clés.

Voici un exemple:

social icons

Avec un peu de manipulation, je peux enlever la balise I et la remplacer par span (je ne suis pas sûr que ce soit meilleur ou même important). Je peux aussi maintenant ajouter du texte à cette étendue avec une classe text-hide ou sr-only qui le cacherait.

Je sais qu'il n'est généralement pas bon de cacher du texte, mais dans ce genre de situation, est-ce que je serais pénalisé ou est-ce mieux de le faire? Cela ajouterait du texte à un lien vide et pourrait éventuellement aider les lecteurs d'écran si la classe réservée à SR est unique.

Nouvel exemple avec texte masqué :

<a href="https://www.facebook.com/disputebills" class="fa fa-md fa-facebook">
    <span class="text-hide"">Dispute Bills Facebook Page</span>
</a>

J'utilise Twitter bootstrap qui dispose de deux classes CSS pour masquer le texte. Si cacher le texte est correct dans cette situation, je ne suis pas sûr que sr-only serait préférable d'utiliser alors .text-hide (en termes de référencement).

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0;
}
2
Bryan Willis

Ne le faites pas, car Google n'aime pas le texte caché .

Mais, qu'est-ce que vous essayez d'optimiser, le site de quelqu'un d'autre? parce que les sites de médias sociaux ne vous appartiennent pas, alors je ne pense pas que vous devriez vous concentrer sur les liens texte riches en ancre.

Vous pouvez mentionner n'importe quoi, comme ma page, des icônes, des images, etc., parce que ce n'est pas votre site. Oui, le texte d'ancrage enrichi aide beaucoup dans le référencement, mais uniquement lorsque quelqu'un pointe votre site avec un texte d'ancrage enrichi. (Par exemple, dans la première ligne, je mentionne Google n'apprécie pas le texte masqué, il est donc très utile en référencement, car le texte d'ancrage et le classement PageRank passent tous les deux par des liens (les liens ne sont pas nofollow) Donc, en optimisant le lien externe avec le texte d'ancrage riche n'aide pas dans le référencement . Alors n'hésitez pas à utiliser n'importe quoi, cela a l'air bien pour les utilisateurs.

1
Goyllo

Cela dépend de ce que vous voulez satisfaire.

Pour satisfaire Google, faites en sorte que tout le texte des liens soit visible, pas de la même couleur que la couleur de fond, sinon ils pourraient être considérés comme des liens cachés vers Google.

Pour satisfaire l'accessibilité, vous avez besoin d'au moins un type de texte dans les liens. Cela signifie que pour que les utilisateurs qui ne peuvent pas interpréter les images (par exemple, ceux qui utilisent des appareils de lecture d'écran) comprennent le lien, ils se fient au texte.

Pour satisfaire uniquement les utilisateurs visuels sans vous soucier de Google ou de l'accessibilité, faites de vos liens uniquement des images.

Ce que je suggère personnellement pour créer une situation gagnant-gagnant pour tous, est d’ajouter du texte et de le mélanger avec le lien. Par exemple, vous pouvez avoir un petit texte de couleur vive juste en dessous de l’élément de lien afin de pouvoir cliquer sur le texte ou sur l’image pour accéder au lien. Cela fonctionne également si les feuilles de style ou les images sont désactivées dans le navigateur du client.

0
Mike