Copyright HébergementWebs.com - License GPL

Comprendre l'attribut de titre d'image

WordPress   2020-10-24 05:00:09

Optimiser les images de votre site Web n"est pas une mince affaire. Non seulement vous devez vous assurer que la taille de leurs fichiers est gérable pour éviter de longs temps de chargement des pages, mais ils présentent également de nombreuses opportunités pour améliorer votre optimisation pour les moteurs de recherche (SEO) qui sont faciles à ignorer. Par exemple, vous ne connaissez peut-être pas l"attribut de titre de l"image et le rôle qu"il joue dans les éléments visuels de votre site. Dans cet article, nous allons faire la lumière sur l"attribut de titre de l"image et expliquer en quoi il diffère à partir de l"attribut alt et expliquez ce que cela signifie pour votre stratégie de référencement. Nous allons également vous montrer comment le cacher aux visiteurs de votre site. Allons-y! Une introduction à l"attribut de titre d"image Première chose first: l"attribut de titre de l"image n"est pas identique au nom de fichier de l"image. Ce sont plutôt des informations qui peuvent être incluses dans la balise HTML de la photo ou du graphique. Voici un exemple, avec l"attribut title à la fin: L"impact le plus notable du titre l"attribut a est que les utilisateurs peuvent le voir comme une "info-bulle" sur le front-end de votre site lorsqu"ils survolent l"image: Tous les navigateurs ne prennent pas en charge cette fonctionnalité. Cependant, Firefox est l"un des rares à le faire, et c"est le troisième navigateur le plus populaire sur le Web. Vous pouvez ajouter des attributs de titre d"image dans WordPress via votre médiathèque. Cliquez simplement sur l"image en question et remplissez le champ Titre : Vous pouvez également l"ajouter directement dans l"éditeur de blocs. Développez les paramètres Avancés du bloc d"image et remplissez le champ Attribut de titre : Le but de la création du titre de l"image visible au survol est de fournir un peu de contexte supplémentaire à vos visiteurs. Par exemple, certains créateurs de contenu incluront les noms des personnes représentées dans l"image, ou des détails clés dont les utilisateurs peuvent bénéficier Cependant, vous ne voulez pas vous fier exclusivement à l"attribut title, d"autant plus qu"il n"est pas visible pour les utilisateurs dans tous les navigateurs. Dans certains cas, une légende peut être plus efficace. En outre, vous devez toujours vous assurer d’ajouter du texte alternatif à vos images, même si elles ont des attributs de titre. Lors de la création de vos attributs de titre, il est préférable de les limiter à quelques mots. Soyez sélectif et deif afin que le texte de survol ne soit pas trop long et fournisse de la valeur à vos visiteurs. La différence entre l"attribut de titre et l"attribut Alt Nous avons mentionné précédemment que c"est important d"ajouter du texte alternatif à vos images même si vous avez inclus un attribut de titre. C"est une erreur courante chez les créateurs de contenu de confondre l"attribut de titre d"image avec l"attribut alt ou de supposer que l"utilisation des deux est exagérée. L"attribut alt spécifie le texte alternatif de l"image dans sa balise HTML. C"est le deuxième attribut répertorié dans notre exemple d"avant: Le but du texte alternatif est pour décrire des éléments visuels aux utilisateurs qui ne peuvent pas les voir, soit parce que l"image n"a pas pu se charger, soit parce qu"ils utilisent un lecteur d"écran. Ce texte sera affiché à la place de l"image dans les cas où il ne peut pas être rendu: Dans WordPress, vous pouvez ajouter du texte alternatif aux images via votre médiathèque ou les paramètres de n"importe quel bloc d"image dans l"éditeur de blocs. Ceci est essentiel pour garantir que votre site répond aux normes d"accessibilité, c"est pourquoi nous vous encourageons vivement à le faire. Il est extrêmement important de ne pas essayer d"utiliser l"attribut titre de l"image pour remplacer l"attribut alt. Tous les lecteurs d"écran ne prennent pas en charge l"attribut title, et les utilisateurs qui utilisent la navigation au clavier n"ont aucun moyen de survoler une image pour la voir, ce qui pourrait entraîner de graves problèmes d"accessibilité sur votre site. Comment le L"attribut de titre d"image a un impact sur le référencement Il y a beaucoup de messages mitigés en ce qui concerne l"importance de l"attribut de titre d"image pour le référencement. Certains prétendent que c"est un excellent moyen d"incorporer des mots clés supplémentaires, tandis que d"autres disent que les robots des moteurs de recherche ne les explorent même pas. Pour aller droit au but, l"attribut de titre de l"image n"est pas un facteur de classment direct. L"optimisation de vos images en ajoutant des titres à chacune d"elles n"apportera probablement pas de changement significatif dans la visibilité de vos pages dans les résultats des moteurs de recherche. Cependant, l"inclusion d"attributs de titre ne fera pas non plus de mal votre site d"un point de vue SEO. En fait, Google le recommande . Si les robots des moteurs de recherche les explorent et que vous intégrez des mots-clés, vous pourrez peut-être au moins donner un coup de pouce à vos images dans les résultats de recherche Google Image. De plus, les titres d"images peuvent améliorer l"expérience utilisateur (UX) de votre site par sharin g détails clés avec les visiteurs. Cela peut contribuer indirectement au référencement en influençant les facteurs de classment tels que les pages vues, la durée de la session et d"autres mesures similaires. Néanmoins, comme nous l"avons mentionné à plusieurs reprises, tous les navigateurs et appareils ne prennent pas en charge survolez le texte. Parcourir votre médiathèque et ajouter des titres à chaque fichier pourrait être une énorme perte de temps si la plupart de vos utilisateurs ne le verront jamais. Comment masquer l"info-bulle du titre de l"image dans WordPress Vous pouvez préférer masquer l"info-bulle du titre de l"image. Peut-être que vous craignez que les visiteurs le trouvent ennuyeux ou que vous souhaitiez l"utiliser principalement à des fins de référencement, mais que vous ne le jugiez pas nécessaire pour aider les lecteurs à comprendre votre contenu. Vous pouvez simplement supprimer l"attribut title de votre images dans l"éditeur de blocs et votre médiathèque. Cependant, vous perdrez alors tous les avantages potentiels de référencement que vous pourriez en voir. La plupart des gens qui souhaitent masquer l"info-bulle finissent par ajouter du JavaScript à leurs sites afin de pouvoir conserver l"attribut dans leurs balises d"image mais empêchez-le de s"afficher sur le front-end. Nous vous recommandons d"utiliser un plugin tel que Insérer En-têtes et pieds de page pour faciliter ce processus. Ajoutez le code suivant dans la section , entouré de balises de : jQuery (document) .ready (function ($) {$ ( "img [title] "). each (function () { $ (this) .removeAttr ( "titre ");});}); Si vous utilisez Divi, vous pouvez ignorer l"installation du plugin supplémentaire et ajouter ce code en accédant à p> Options du thèp> Intégration : Le premier éditeur de code sur cet écran ajoutera le code JavaScript à la section de votre site, comme le ferait Insérer des en-têtes et des pieds de page. Conclusion Il est possible de créer du contenu en ligne pour ans et ne pensez jamais aux attributs de titre de vos images. Cependant, les ignorer complètement pourrait être une occasion manquée de fournir un contexte supplémentaire à vos utilisateurs. Plus important encore, une mauvaise utilisation de cet attribut pourrait avoir des conséquences négatives sur l"accessibilité et le référencement de votre site. Dans cet article, nous avons discuté des différences entre l"attribut titre de l"image et l"attribut alt afin que vous puissiez maximiser votre référencement. Nous vous avons également expliqué comment masquer l"info-bulle du titre de l"image sur le frontal afin que les visiteurs ne puissent pas la voir lorsqu"ils survolent une photo ou un graphique. Avez-vous des questions sur l"image. attribut de titre ou optimisation d"image? Laissez-les nous dans la section commentaires ci-dessous! Image de Jane Kelly / Shutterstock.com