avoir des pages HTML avec de nombreuses sections et chaque section dispose d'un titre de section affiché comme une image (pour utiliser une belle police). Le problème est que même si je spécifie un texte «Alt» et «Titre» sur chaque image / titre, la fonctionnalité de navigateur CTRL F F ne trouve pas le texte. Pensé deux solutions possibles mais pas très heureuses à leur sujet
Utilisez des polices incorporées.
Problème: Impossible de trouver la police requise par le client à utiliser et non sûr de droits d'auteur.
avez le texte dans l'image dans DIV près de l'image mais caché de la vue utilisateur.
Problème: Les moteurs de recherche peuvent-ils prendre en compte ce mot-clé bourré? Le navigateur trouvera-t-il du texte si l'affichage: Aucun
Quelqu'un a-t-il une meilleure solution?
Merci
Riga
5 Réponses :
hmm ... J'allais recommander CUFON comme alternative à l'utilisation d'images générées, Mais ce n'est pas parfait: la recherche d'œuvres dans Firefox mais pas trop bien (mauvais positionnement et pas de surbrillance).
Toujours mieux mieux que les images comme titres.
Pour accomplir cela, j'ai utilisé le bibliothèque JavaScript
Vous pouvez générer des polices personnalisées pour cette bibliothèque à l'aide de ce générateur
Ces sites ont également des exemples et des instructions d'utilisation.
Essayé ctrl + f et n'a pas trouvé le texte
Je regarde certains de leurs exemples et ils ne sont pas consultables. Mais j'utilise cela sur un site Web où la recherche fonctionne bien. Je verrai s'il y a un drapeau spécifique pour cela.
Quelle version de la bibliothèque de typeFace utilisez-vous?
J'ai fait quelque chose de mal, Ctrl + F fonctionne sur le site Web de typeFace afin que le texte soit consultable!
Pourquoi ne pas essayer le Annuaire Google Police
Le répertoire Google Font vous permet de parcourir toutes les polices disponibles via le Google Police API. Toutes les polices de la Le répertoire est disponible pour une utilisation sur votre site web sous une source ouverte Licence et sont desservis par Google Serveurs.
La police requise par mon client n'est pas dans l'ensemble fourni par Google. Mon client n'est pas sûr du droit d'auteur essayé avec FFOX 3.6 et toutes les polices ont l'air identique.
Généralement, la meilleure approche du remplacement de l'image consiste à le faire exclusivement dans la feuille de style.
Le HTML doit toujours ressembler à: Votre CSS peut alors faire: Notez que le texte n'est pas réellement masqué. Certains lecteurs d'écran interprètent Je n'ai pas spécifiquement testé cela pour Ctrl + F , mais le fait que le texte est toujours visible techniquement devrait permettre au navigateur de le trouver. Il sera pas être capable de mettre en évidence l'image comme une correspondance, Cependant, ce qui peut encore conduire à la confusion. Il n'y a pas de manière réelle autour de cela sans utiliser de Affichage: aucun; de manière incorrecte (même lorsqu'il est donné dans un multimédia = "écran" stylesheet). Au lieu de cela, nous le déplaçons simplement loin du côté gauche de l'écran où il ne peut pas être vu de manière réaliste. @ font-face .
Vous pouvez également utiliser l'index Z sur les éléments:
<html>
<body>
...
<div>
<div style="position:absolute; z-index: 1">My Section Header</div>
<div style="position:absolute; z-index: 2"><img src="test.png"/></div>
</div>
...
</body>
</html>
Pour répondre q2. Non, le CTRL-F ne fonctionnera pas pour le texte à l'intérieur des divs masqués avec
Affichage: Aucun .Les navigateurs ne peuvent rechercher de texte dans des images.
Affichage: Aucun ne résoudra pas votre problème aussi. Je suggère d'utiliser des images uniquement où est un besoin pour eux. Les titres doivent certainement être écrits avec du texte brut.Pour répondre à Q2 aussi, vous pouvez masquer le texte de la vue utilisateur sans utiliser l'affichage: Aucun; . Juste doit ajouter de la marge-gauche: -9999;
Cela ne serait actuellement possible qu'avec une extension de navigateur utilisant des filets neurones à reconnaître le texte des images. C'est très possible, mais cela pourrait ne pas fonctionner très rapidement en fonction du nombre d'images sur la page. Soulignant le texte est également possible, mais encore une fois, la performance est incertaine.