Est-il convenable d'utiliser des images à l'intérieur de balises d'en-tête?
J'ai fait un peu de recherche sur google, mais je n'ai pas été en mesure d'obtenir une réponse directe.
En termes de RÉFÉRENCEMENT, comment le mauvais est-il à utiliser des images pour vos en-têtes? La raison pour cela, bien sûr, serait d'être en mesure d'afficher des polices standard. Je sais que c'est mauvais d'utiliser des images au lieu de les en-têtes, mais je me demandais si ce genre de syntaxe ferait n'importe quoi pour le rendre plus moteur de recherche convivial:
<h1><img src="header.jpg" alt="Level 1 Header" /></h1>
A-t-elle le même effet que ça?:
<h1>Level 1 Header</h1>
Je soupçonne que la réponse est non. Je pense que les moteurs de recherche ne serait probablement pas comme cela, parce que vous pouvez mettre n'importe quel texte dans l'attribut alt sans pour autant être affiché sur la page. Donc, dans ce cas, quelle est la meilleure façon d'utiliser les images pour les en-têtes sans pour autant sacrifier le RÉFÉRENCEMENT?
OriginalL'auteur Curtis Fleming | 2011-02-15
Vous devez vous connecter pour publier un commentaire.
Un vieux truc est de mettre le texte réel dans le
<h1>
boîte, mais utiliser les CSS pour rendre le texte invisible et de mettre votre image en arrière-plan.Donc, si vous voulez faire quelque chose comme:
Astucieux Stackoverflow membre K Ivanov souligne qu'il serait probablement mieux pour rendre le texte invisible par un positionnement de la page avec "text-indent: -5000px" ou quelque chose.
Ivanov c'est vraiment un bon point!! Merci je vais mettre à jour la réponse.
Nous ne devons pas cacher la balise h1 ou faire de la balise h1 invisible à l'utilisateur en faisant la même couleur que la couleur de fond, ou de la mettre hors de vue. Ce sera détectée par le robot de google et pénalisé
que peut être une considération pour beaucoup de gens, mais pas tout le monde. Sécurisé des applications web, par exemple, ne sont jamais accessibles par les moteurs de recherche.
OriginalL'auteur Pointy
Elle est reconnue en pratique (ni bonne, ni mauvaise) à utiliser
text-indent:-9999px;
aux côtés deoverflow:hidden;
pour les titres.Cela compense le texte par une quantité massive utilise ensuite le débordement de la cacher.
Qui signifie que vous pouvez avoir une belle grosse description/titre dans votre
<header>
et ont une image avec la description/titre de la façon dont vous souhaitez qu'il apparaisse, de cette façon, vous obtenez le meilleur des deux mondes.Un parfait exemple de cela est: http://www.sohtanaka.com/web-design-blog/
La "LatestWord" est une image, mais si vous regardez le code CSS de la section, vous verrez cette technique employée.
Nous ne devons pas cacher la balise h1 ou faire de la balise h1 invisible à l'utilisateur en faisant la même couleur que la couleur de fond, ou de la mettre hors de vue. Ce sera détectée par le robot de google et pénalisé
OriginalL'auteur Myles Gray
Une autre solution possible au problème de la non-standard des polices dans les en-têtes de serait d'utiliser la Google Polices d'API, en supposant que les polices disponibles de répondre à vos besoins.
Vous pouvez également jeter un oeil à des feuilles de style qu'ils génèrent et de tenter de générer vous-même (en supposant que vous avez besoin).
OriginalL'auteur Thomas