web-dev-qa-db-fra.com

Utiliser RDFa avec une image à l'intérieur d'une balise H1

Je viens d'un milieu de développement, mais je viens tout juste de commencer à apprendre le référencement avec RDFa. Je travaille sur le nouveau site Web de notre société, où le concepteur utilise les logos de nos différentes divisions en haut de leurs pages respectives. Il n'y a actuellement aucune balise H1. Je sais que je dois ajouter H1, mais dans la conception des pages, les logos sont ceux dans lesquels je mettrais habituellement un en-tête H1. Et si j’ajoutais un H1 avec du texte, cela jetterait le motif.

Je sais également que l'utilisation d'images dans H1 n'est pas une bonne pratique, même si j'utilise l'attribut alt.

Ma question est donc de savoir si je mets des balises H1 autour de l'image, puis que RDFa trouvera cela acceptable ou que cela sera pénalisé par Google. Voici mon exemple de code:

<div class="twelve columns" typeof="gr:BusinessEntity">
  <h1 property="gr:name" content="Thoughtwire Marketing">
     <img rel="foaf:depiction" src='http://www.thoughtwiremarketing.com/images/TW-marketing-logo.png' class='twmarketing' alt="Thoughtwire Marketing"/>
  </h1>
</div>

J'ai défini mes préfixes dans la balise body et lorsque je lance mon code par le biais du validateur à l'adresse http://rdfa.info/play/ , il semble que cela fonctionnerait, mais pas suffisamment au courant avec le référencement pour savoir à coup sûr.

2
rpatterson

(J'ai ajusté ma réponse que j'ai donné à votre question (maintenant fermée) sur SO.)

Lorsqu'un agent utilisateur (y compris les moteurs de recherche) analyse votre RDFa, l'élément sur lequel le RDFa est utilisé n'a pas d'importance (sauf pour les règles d'analyse syntaxiques spéciales). Les user-agents apprennent quelque chose comme ce qui suit:

Il existe une entité commerciale (http://purl.org/goodrelations/v1#BusinessEntity) qui porte le nom (http://purl.org/goodrelations/v1#name) "Thoughtwire Marketing" (= valeur littérale de l'attribut content.).

Comme vous pouvez le constater, cette instruction ne se rapporte pas à div ou h1.

Une fois ce RDF extrait, vous pouvez imaginer que le RDFa est "supprimé" de votre page. Ainsi, les agents utilisateurs verront/interpréteront votre balisage simple, par exemple:

<div>
 <h1>
  <img src='http://www.thoughtwiremarketing.com/images/TW-marketing-logo.png' alt="Thoughtwire Marketing"/>
 </h1>
</div>

RDFa et HTML (sémantique) sont deux concepts différents.

Je ne suis pas sûr de comprendre votre problème, mais vous pouvez maintenant vous poser deux questions:

  • Est-ce que mon RDFa est correct ainsi? Comme vous avez déjà lié et testé votre page avec un analyseur/validateur RDFa, probablement oui, si le RDF est ce que vous voulez dire à propos de votre contenu.
  • Est-ce que mon code HTML est correct? Du point de vue de la spécification HTML, oui. Et tous les utilisateurs-utilisateurs consommateurs (y compris les moteurs de recherche) devraient également s'en accommoder. Avoir des images (en particulier des logos) comme contenu pour les en-têtes est très courant.
1
unor

Je suis d'accord avec ce que unor a dit. La seule chose que je veux ajouter est que vous pouvez utiliser @property au lieu de @rel pour vous aligner sur RDFa Lite . Donc, votre extrait voudrait:

<div class="twelve columns" typeof="gr:BusinessEntity">
  <h1 property="gr:name" content="Thoughtwire Marketing">
     <img property="foaf:depiction" src='http://www.thoughtwiremarketing.com/images/TW-marketing-logo.png' class='twmarketing' alt="Thoughtwire Marketing"/>
  </h1>
</div>
0
scor