{"id":10257,"date":"2018-11-19T17:38:38","date_gmt":"2018-11-19T16:38:38","guid":{"rendered":"https:\/\/burorader.com\/a-propos-des-images-sur-les-sites-web-wordpress\/"},"modified":"2025-07-13T14:15:12","modified_gmt":"2025-07-13T12:15:12","slug":"images-sur-les-sites-web-wordpress","status":"publish","type":"post","link":"https:\/\/burorader.com\/fr\/images-sur-les-sites-web-wordpress\/","title":{"rendered":"\u00c0 propos des images sur les sites web WordPress"},"content":{"rendered":"<p>Une question qui revient souvent est \u00ab Quelle est la meilleure taille pour une photo sur un site web ou dans un blog ? \u00bb. Une question importante, car avoir des images attrayantes est indispensable pour un blog.<\/p>\n<h2>La meilleure taille des images sur les sites web WordPress<\/h2>\n<p>La taille des images influe sur la vitesse de votre site web, ce qui a une incidence sur votre classement dans Google.<\/p>\n<p>T\u00e9l\u00e9versez l&rsquo;image dans le format dans lequel vous souhaitez qu&rsquo;elle soit affich\u00e9e sur votre site web. Plus pr\u00e9cis\u00e9ment, pour les images que vous rendez cliquables, cela signifie que la largeur doit \u00eatre de 1920 pixels maximum et la hauteur de 1200 pixels maximum. Pour les images non cliquables, utilisez l&rsquo;espace disponible pour les images ! Par exemple, Divi, le th\u00e8me avec lequel je travaille beaucoup, dispose d&rsquo;un <a href=\"https:\/\/www.elegantthemes.com\/blog\/divi-resources\/the-ultimate-guide-to-using-images-within-divi\" target=\"_blank\" rel=\"noopener\">aper\u00e7u tr\u00e8s pratique<\/a>.<\/p>\n<p>Heureusement, vous n&rsquo;avez pas besoin d&rsquo;un programme de retouche photo co\u00fbteux pour cela. J&rsquo;utilise moi-m\u00eame le programme gratuit <a href=\"https:\/\/www.irfanview.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Irfanview<\/a>, par exemple. Avec ce programme, vous pouvez non seulement r\u00e9duire les photos, mais aussi les d\u00e9couper tr\u00e8s facilement.<\/p>\n<p>Ensuite, vous pouvez r\u00e9duire \u00e0 nouveau la taille des fichiers des photos en utilisant le programme <a href=\"https:\/\/tinypng.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">TinyPNG<\/a>. Vous pouvez \u00e9galement utiliser le plugin gratuit <a href=\"https:\/\/nl.wordpress.org\/plugins\/resmushit-image-optimizer\/\" target=\"_blank\" rel=\"noopener noreferrer\">reSmush.it<\/a> pour redimensionner plusieurs images plac\u00e9es sur votre site web \u00e0 la fois. Vous pouvez d\u00e9sactiver ce plugin si vous n&rsquo;ajoutez pas d&rsquo;images \u00e0 votre site web pendant un certain temps.<\/p>\n<h2>Dimensions des images WooCommerce<\/h2>\n<p>WooCommerce recommande une taille minimale de 800 x 800 pixels et une taille maximale de 1000 x 1000 pixels.<\/p>\n<h2>Un nouveau type d&rsquo;image<\/h2>\n<p>En plus de png et jpeg, il existe maintenant un nouveau type d&rsquo;image : webp. Un fichier jpg ou png converti en wepb diminue \u00e9norm\u00e9ment de taille. 95 % des visiteurs peuvent voir les images webp, mais les visiteurs utilisant Safari sur des versions plus anciennes de macOS ne verront pas les images. Ce probl\u00e8me peut \u00eatre r\u00e9solu en installant le <a href=\"https:\/\/wordpress.org\/plugins\/webp-express\/\" target=\"_blank\" rel=\"noopener\">plugin Webp Express<\/a>. Les navigateurs qui n&rsquo;acceptent pas les images webp afficheront l&rsquo;image originale jpg ou png. Le site web de Buro RaDer utilise des images wepb en utilissant du plugin Wepb Express.<\/p>\n<h2>L&rsquo;utilit\u00e9 d&rsquo;une l\u00e9gende de photo<\/h2>\n<p>Une autre question fr\u00e9quemment pos\u00e9e est \u00ab\u00a0Est-il n\u00e9cessaire de mettre une l\u00e9gende sous chaque photo ?\u00a0\u00bb. L&rsquo;utilisation de l\u00e9gendes est importante pour le r\u00e9f\u00e9rencement. Avec les titres et les images, les l\u00e9gendes sont ce que les visiteurs regardent en premier. Bien entendu, une telle l\u00e9gende doit avoir une valeur ajout\u00e9e pour le visiteur. Mettez-vous \u00e0 la place du visiteur pour cela.<\/p>\n<h2>Nom du fichier, textes alt et titre<\/h2>\n<p class=\"no-space\">Et tant que nous sommes sur le sujet des images, rappelez-vous :<\/p>\n<ul>\n<li>Le nom correct du fichier \u2013 c\u2019est ce que Google recherche. Donc, pas DSC63240.jpg mais par exemple site-web-wordpress-divi.jpg avec \u00ab site web \u00bb au premier plan car c\u2019est le mot-cl\u00e9 le plus important dans ce cas.<\/li>\n<li>Le texte alt est le texte qui est visible lorsque l\u2019image ne s\u2019affiche pas pour une raison quelconque. Il est donc tr\u00e8s important pour les personnes souffrant d\u2019un handicap visuel. Vous devrez toujours saisir ce texte ! C\u2019est \u00e9galement le texte qui appara\u00eet dans Internet Explorer lorsque vous passez votre souris sur l\u2019image. Chrome affiche le texte du titre comme d\u00e9crit ci-dessous. Google examine certainement le texte alternatif, il est donc important d\u2019utiliser un mot cl\u00e9 en rapport avec l\u2019image. Le texte alternatif peut \u00e9galement \u00eatre raisonnablement long, mais ne doit pas \u00eatre bourr\u00e9 de mots sur lesquels vous souhaitez \u00eatre trouv\u00e9. Google p\u00e9nalise imm\u00e9diatement cela !<\/li>\n<li>Il n&rsquo;est pas n\u00e9cessaire de saisir le texte du titre, mais dans certains navigateurs web, aucun texte n&rsquo;appara\u00eet lorsque vous passez la souris sur l&rsquo;image. Ce texte peut \u00e9galement \u00eatre utilis\u00e9 pour ajouter un \u00ab\u00a0appel \u00e0 l&rsquo;action\u00a0\u00bb suppl\u00e9mentaire \u00e0 un bouton : \u00ab R\u00e9servez maintenant avec une r\u00e9duction de 10 % \u00bb.<\/li>\n<\/ul>\n<h2>Manipulation des photos qui apparaissent sur Facebook et Twitter<\/h2>\n<p class=\"no-space\">Vous pouvez manipuler les photos qui apparaissent sur Facebook et Twitter lorsque vous partagez une page web ou un blog via les plugins SEO Yoast et RankMath.<\/p>\n<h3>Dans Yoast<\/h3>\n<ul>\n<li>Sur la page ou le blog concern\u00e9, allez dans la section Yoast SEO<\/li>\n<li>Cliquez sur l&rsquo;ic\u00f4ne sociale, un triangle ouvert avec 3 cercles.<\/li>\n<li>Vous pouvez ensuite remplacer le titre du blog pour que la publication Facebook ait un titre diff\u00e9rent de celui du blog. Vous pouvez \u00e9galement t\u00e9l\u00e9charger une photo que vous souhaitez voir appara\u00eetre avec votre publication Facebook.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/wordpress-yoast-facebook-twitter.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-10258\" src=\"https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/wordpress-yoast-facebook-twitter.jpg\" alt=\"Personnaliser les images Facebook et Twitter \u00e0 l'aide de Yoast\" width=\"945\" height=\"452\" srcset=\"https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/wordpress-yoast-facebook-twitter.jpg 945w, https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/wordpress-yoast-facebook-twitter-480x230.jpg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) 945px, 100vw\" \/><\/a><\/p>\n<h3>Dans Rank Math<\/h3>\n<p>Dans Rank Math, cela fonctionne en fait de la m\u00eame mani\u00e8re :<\/p>\n<ul>\n<li>Sur la page ou le blog concern\u00e9, allez dans la section Rank Math SEO.<\/li>\n<li>Cliquez sur l&rsquo;ic\u00f4ne sociale, un rond avec 3 cercles saillants.<\/li>\n<li>Vous pouvez ensuite remplacer le titre du blog pour que la publication sur Facebook ou Twitter ait un titre diff\u00e9rent de celui du blog. Vous pouvez \u00e9galement t\u00e9l\u00e9charger une photo que vous souhaitez voir appara\u00eetre avec votre publication sur Facebook ou Twitter.<\/li>\n<\/ul>\n<p><a href=\"https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/social-media-foto-ingeven-in-rankmath.jpg\"><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-10260\" src=\"https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/social-media-foto-ingeven-in-rankmath.jpg\" alt=\"Entrez la photo des m\u00e9dias sociaux dans Rank Math\" width=\"1410\" height=\"796\" srcset=\"https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/social-media-foto-ingeven-in-rankmath.jpg 1410w, https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/social-media-foto-ingeven-in-rankmath-1280x723.jpg 1280w, https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/social-media-foto-ingeven-in-rankmath-980x553.jpg 980w, https:\/\/burorader.com\/wp-content\/uploads\/2021\/01\/social-media-foto-ingeven-in-rankmath-480x271.jpg 480w\" sizes=\"(min-width: 0px) and (max-width: 480px) 480px, (min-width: 481px) and (max-width: 980px) 980px, (min-width: 981px) and (max-width: 1280px) 1280px, (min-width: 1281px) 1410px, 100vw\" \/><\/a><\/p>\n<h2>D&rsquo;o\u00f9 viennent vos images ?<\/h2>\n<p>Ne prenez pas n&rsquo;importe quelle image au hasard sur Internet, vous pourriez la payer tr\u00e8s cher ! Si vous avez souvent besoin d&rsquo;images, voici un conseil : chaque ann\u00e9e, <a href=\"https:\/\/depositphotos.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Depositphotos<\/a> fait de bonnes affaires avec Black Friday. Certaines offres sont valables pour toujours, et le choix sur ce site est \u00e9norme ! Pour en savoir plus, consultez le site <a href=\"https:\/\/depositphotos.com\/\" target=\"_blank\" rel=\"noopener\">Depositphotos<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Une question qui revient souvent est \u00ab Quelle est la meilleure taille pour une photo sur un site web ou dans un blog ? \u00bb. Une question importante, car avoir des images attrayantes est indispensable pour un blog. La meilleure taille des images sur les sites web WordPress La taille des images influe sur la [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":10262,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_et_pb_use_builder":"","_et_pb_old_content":"","_et_gb_content_width":"","footnotes":""},"categories":[346],"tags":[266,252,263],"class_list":["post-10257","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-informations-utiles-sites-web","tag-accessibilite","tag-images","tag-plugin-fr"],"_links":{"self":[{"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/posts\/10257","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/comments?post=10257"}],"version-history":[{"count":3,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/posts\/10257\/revisions"}],"predecessor-version":[{"id":16438,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/posts\/10257\/revisions\/16438"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/media\/10262"}],"wp:attachment":[{"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/media?parent=10257"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/categories?post=10257"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/burorader.com\/fr\/wp-json\/wp\/v2\/tags?post=10257"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}