{"id":47,"date":"2017-02-13T19:11:32","date_gmt":"2017-02-13T18:11:32","guid":{"rendered":"http:\/\/cecile-laval.net\/pro\/?p=47"},"modified":"2017-03-17T20:41:36","modified_gmt":"2017-03-17T19:41:36","slug":"les-images-sur-internet","status":"publish","type":"post","link":"https:\/\/cecile-laval.net\/pro\/les-images-sur-internet\/","title":{"rendered":"Les images sur Internet"},"content":{"rendered":"<p>A quelle taille mettre les images sur Internet ?<br \/>\nQuelle qualit\u00e9 ?<br \/>\nQuel nom leur donner ?<br \/>\nVoici quelques valeurs que j&#8217;utilise :<!--more--><\/p>\n<h1>Leur taille<\/h1>\n<p>Pourquoi r\u00e9duire leur taille et leur taux de compression ?<\/p>\n<p>Plus une image est lourde, plus la page du site mettra du temps \u00e0 charger.<\/p>\n<p>Une image qui entre dans un carr\u00e9 de 700pixels et une compression de 0 \u00e0 100 est tout \u00e0 fait suffisante pour le net.<\/p>\n<h2>Sous Gimp :<\/h2>\n<p>Pour la taille :<\/p>\n<ul>\n<li>Image\/Echelle et taille de l&#8217;image\/<\/li>\n<li>Une nouvelle fen\u00eatre s&#8217;ouvre<\/li>\n<li><strong>Taille d&#8217;image<\/strong> : r\u00e9duire le cot\u00e9 le plus grand (largeur ou longueur) \u00e0 <strong>700px<\/strong> et utiliser le ratio (link \u00e0 droite) pour que l&#8217;autre taille s&#8217;adapte automatiquement<\/li>\n<\/ul>\n<p>Pour la compression :<\/p>\n<ul>\n<li>Fichier\/Exporter\/<\/li>\n<li>Une nouvelle fen\u00eatre s&#8217;ouvre : Donner un nom \u00e0 l&#8217;image ; choisir l&#8217;extension ; cliquer sur exporter<\/li>\n<li>Une nouvelle fen\u00eatre s&#8217;ouvre : Modifier la <strong>Qualit\u00e9<\/strong> \u00e0 ~<strong>70 <\/strong>(entre 0 et 100). Le nouveau poids de l&#8217;image s&#8217;affiche sur la ligne juste en dessous &#8220;<em>Taille du fichier : xx ko<\/em>&#8220;<\/li>\n<li>Cliquer sur exporter<\/li>\n<\/ul>\n<p>Pour le choix de l&#8217;extension<\/p>\n<ul>\n<li>JPG : adapt\u00e9 pour les sites Internet, taille r\u00e9duite<\/li>\n<li>PNG :\u00a0 utilis\u00e9 lorsque l&#8217;on a besoin d&#8217;un fond transparent<\/li>\n<\/ul>\n<h1>Leur nom<\/h1>\n<p>Afin de faciliter le r\u00e9f\u00e9rencement du site sur les moteurs de recherche :<\/p>\n<ul>\n<li>Utiliser un nom qui d\u00e9crit l&#8217;image (et non P20156.jpg)<\/li>\n<li>ne pas utiliser d&#8217;accent ni d&#8217;espace (les remplacer par des &#8220;-&#8220;)<\/li>\n<li>Mettre un nom ou une courte description dans &#8220;texte alternatif&#8221; ou la balise alt afin que les personnes malvoyantes aient une description de votre image ou encore si l&#8217;image ne charge pas, l&#8217;internaute saura qu&#8217;il y avait une image sur tel sujet d\u00e9crit dans le texte alternatif.<\/li>\n<\/ul>\n<h1>Quelques liens utiles<\/h1>\n<p><a href=\"http:\/\/www.comleweb.com\/reduire-et-nommer-ses-images\/\" target=\"_blank\">Comleweb<\/a> : Pour un site rapide, il faut mettre ses images aux bonnes dimensions, les compresser et les nommer<\/p>\n<p class=\"j-blog-header j-blog-headline\"><a href=\"https:\/\/fr.jimdo.com\/2015\/07\/20\/7-conseils-de-pro-pour-optimiser-vos-images\/\" target=\"_blank\">JIMDO<\/a> : 7 conseils de pro pour optimiser vos images<\/p>\n<p id=\"single_h1\"><a href=\"http:\/\/www.orignal-communication.fr\/actualites\/tutoriel\/bien-optimiser-vos-images-pour-le-web\/\" target=\"_blank\">ORIGINAL Communication<\/a> : Bien optimiser vos images pour le web<\/p>\n<p class=\"image-credits\">Attribution des images: <a href=\"https:\/\/www.pexels.com\" target=\"_blank\">Pexels<\/a>.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>A quelle taille mettre les images sur Internet ? Quelle qualit\u00e9 ? Quel nom leur donner ? Voici quelques valeurs que j&#8217;utilise : Attribution des images: Pexels.<\/p>\n","protected":false},"author":1,"featured_media":133,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[4],"tags":[5],"_links":{"self":[{"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/posts\/47"}],"collection":[{"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/comments?post=47"}],"version-history":[{"count":3,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/posts\/47\/revisions"}],"predecessor-version":[{"id":129,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/posts\/47\/revisions\/129"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/media\/133"}],"wp:attachment":[{"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/media?parent=47"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/categories?post=47"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/cecile-laval.net\/pro\/wp-json\/wp\/v2\/tags?post=47"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}