Google aime l'attribut alt de l'entreprise
Google et Bing comprennent qu'un logo sera souvent répété partout en PNG, GIF et JPEG. Balisez simplement le logo en utilisant la description alternative pour informer les moteurs de recherche qu'il s'agit d'un LOGO pour votre entreprise.
Un exemple de base:
<img src="logo.png" alt="Company Name Logo">
Un exemple de schéma:
<div itemscope itemtype="http://schema.org/Organization">
<a itemprop="url" href="http://www.example.com/">Home</a>
<img itemprop="logo" src="http://www.example.com/logo.png" alt="Company Name Logo"/>
</div>
Un exemple de schéma JavaScript:
Si vous voulez garder votre code simple, utilisez le schéma JSON-LD car vous n'avez alors jamais besoin de modifier le code de la page, mais ajoutez plutôt un code à la fin de votre page ou utilisez Google Tag Manager pour injecter dans la page sans lever le petit doigt,
par exemple
<img src="logo.png" alt="Company Name Logo">
<script type="application/ld+json">
{
"@context": "http://schema.org/",
"@type": "Organization",
"url": "http://www.example.com/",
"logo": "http://www.example.com/logo.png"
}
</script>
Google aime également les logos SVG
Si vous souhaitez que Google ou Bing voient le nom de votre entreprise dans l'image, vous pouvez le faire en utilisant le format SVG. Ce format vous permet d'utiliser TEXT dans l'image qui sera vue par l'utilisateur et les moteurs de recherche. Si l'accessibilité est un problème, vous devez conserver le nom de l'entreprise en tant que TEXTE et non en tant que forme, par exemple créer des contours.
par exemple quelque chose comme ceci:
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 500 500" enable-background="new 0 0 500 500" xml:space="preserve">
<polygon fill="#998675" points="125,466.5 0,250 125,33.5 375,33.5 500,250 375,466.5 "/>
<rect x="137.5" y="137.5" fill="#534741" width="225" height="225"/>
<polygon fill="#C7B299" points="250,175 294.1,189.3 321.3,226.8 321.3,273.2 294.1,310.7 250,325 205.9,310.7 178.7,273.2 178.7,226.8 205.9,189.3 "/>
<text transform="matrix(1 0 0 1 196.3787 253.5039)" font-family="'Montserrat-Bold'" font-size="12">COMPANY NAME</text>
</svg>
Google n'aime pas les logos piratés CSS
Les moteurs de recherche n'aiment pas que les logos soient affichés avec des astuces et d'autres choses, comme text-indent e.g -9999px; background: url(logo.png) no-repeat;
. Les arrière-plans doivent toujours être utilisés comme arrière-plan. Si c'est un élément de ressource sur la page, c'est toujours une image et jamais un arrière-plan. Utilisez les 2 exemples précédents et non celui-ci ... c'était utile dans la journée, mais plus nécessaire avec le balisage disponible.
Cette méthode aspire également à l'accessibilité (utilisateurs avec facultés affaiblies).