J'ai fait un peu de googling à ce sujet, mais je n'ai pas pu avoir une réponse directe.
En termes de référencement, quelle est la mauvaise utilisation d'images pour vos en-têtes? La raison pour laquelle cela serait bien sûr serait de pouvoir afficher des polices non standard. Je sais que c'est mauvais d'utiliser des images à la place des en-têtes, mais je me demande si ce type de syntaxe ferait n'importe quoi pour le rendre plus convivial pour les moteurs de recherche:
a-t-il le même effet que cela?:
Je soupçonne la réponse à ceci est non. Je pense que les moteurs de recherche ne voudraient probablement pas que cela puisse mettre n'importe quel texte dans l'attribut Alt sans qu'il soit affiché sur la page. Donc, dans ce cas, quelle est la meilleure façon d'utiliser des images pour les en-têtes sans sacrifier le référencement?
en-tête de niveau 1
3 Réponses :
Une ancienne astuce consiste à mettre le texte réel dans la case Donc Faites quelque chose comme: membre d'astucieux StackoverflowFlow K Ivanov souligne qu'il serait probablement préférable de rendre le texte invisible en positionnant la page de la page avec "Texte-tiret: -5000px" ou quelque chose. , mais utilisez ensuite CSS pour rendre le texte invisible et placer votre image en arrière-plan.
faire invisible dans un sens, utilisez quelque chose comme text-indenter: -1000px; ou le positionnement absolu du texte sinon, les lecteurs d'écran ne le ramasseront pas aussi, à moins que vous ne vous souciiez pas d'être conforme à la section 508
@K Ivanov c'est un très bon point !! Merci je vais mettre à jour la réponse.
Nous ne devrions pas masquer la balise H1 ou rendre l'étiquette H1 invisible à l'utilisateur en rendant la couleur identique à la couleur de fond ou en le prenant hors de la vue. Cela sera détecté par Google Crawler et pénalisé
@anandharshan qui peut être une considération pour beaucoup de gens, mais pas tout le monde. Les applications Web sécurisées, par exemple, ne sont jamais accessibles par les moteurs de recherche.
Une autre solution possible au problème des polices non standard des en-têtes serait d'utiliser le API Google Fonts , en supposant que les polices qu'ils ont disponibles répondent à vos besoins.
Vous pouvez également jeter un coup d'œil aux feuilles de style qu'ils génèrent et tentent de les générer vous-même (en supposant que vous devez).
C'est une pratique reconnue (ni bon ni mauvais) d'utiliser Ceci compense le texte par une quantité massive utilise ensuite le débordement pour le masquer.
Cela signifie que vous pouvez avoir une belle description / titre de votre Un exemple parfait de ceci est: http://www.sohtanaka.com/web-design-blog/ < / a>
La section "Dernière" est une image, mais si vous regardez le CSS pour la section, vous verrez cette technique utilisée. text-time: -9999px; à côté de débordement: caché; pour les en-têtes.
La technique s'appelle "CSS Image Remplacement" en général et il y a un relativement récente (d'accord, 3 ans) Aperçu des avantages et des inconvénients de diverses approches ici .
Nous ne devrions pas masquer la balise H1 ou rendre l'étiquette H1 invisible à l'utilisateur en rendant la couleur identique à la couleur de fond ou en le prenant hors de la vue. Cela sera détecté par Google Crawler et pénalisé
Non recommandable, car les crawlers ne peuvent pas interpréter les images, mais ils peuvent envoyer un SMS ... Donc, ce n'est pas sage SEO, pourtant valide, je suppose.