{"id":27254,"date":"2024-12-10T09:51:52","date_gmt":"2024-12-10T08:51:52","guid":{"rendered":"https:\/\/www.cmonsite.fr\/site\/?page_id=27254"},"modified":"2024-12-10T10:09:32","modified_gmt":"2024-12-10T09:09:32","slug":"comment-reduire-la-resolution-ou-le-poids-de-vos-images-avant-de-les-ajouter-sur-votre-site-web","status":"publish","type":"page","link":"https:\/\/www.cmonsite.fr\/site\/aide\/design\/comment-reduire-la-resolution-ou-le-poids-de-vos-images-avant-de-les-ajouter-sur-votre-site-web","title":{"rendered":"Comment r\u00e9duire la r\u00e9solution ou le poids de vos images avant de les ajouter sur votre site web ?"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"27254\" class=\"elementor elementor-27254\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-f3051fc e-flex e-con-boxed e-con e-parent\" data-id=\"f3051fc\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6ef0172 elementor-widget elementor-widget-text-editor\" data-id=\"6ef0172\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>L&#8217;optimisation des images est essentielle pour avoir un site web performant et offrir une meilleure exp\u00e9rience \u00e0 vos visiteurs. Voici un guide simple pour vous aider \u00e0 pr\u00e9parer vos images avant de les t\u00e9l\u00e9charger sur votre site.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f13236e elementor-widget elementor-widget-heading\" data-id=\"f13236e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Pourquoi optimiser ses images ?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-44f8445 elementor-widget elementor-widget-text-editor\" data-id=\"44f8445\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\tQuand vous prenez une photo avec votre appareil photo ou votre smartphone moderne, l&#8217;image cr\u00e9\u00e9e est souvent tr\u00e8s grande et d\u00e9taill\u00e9e. C&#8217;est parfait pour l&#8217;impression, mais ces images sont beaucoup trop lourdes pour un site web. Des images non optimis\u00e9es peuvent :\n<ul>\n \t<li>Ralentir consid\u00e9rablement le chargement de votre site<\/li>\n \t<li>Consommer inutilement la data mobile de vos visiteurs<\/li>\n \t<li>Occuper trop d&#8217;espace de stockage sur votre h\u00e9bergement<\/li>\n<\/ul>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-62b64cb elementor-widget elementor-widget-heading\" data-id=\"62b64cb\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Quelles sont les dimensions id\u00e9ales ?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6933857 elementor-widget elementor-widget-text-editor\" data-id=\"6933857\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Pour un affichage optimal sur le web, vos images n&#8217;ont g\u00e9n\u00e9ralement pas besoin de faire plus de :<\/p><ul><li>1920 pixels de large pour une image pleine largeur<\/li><li>800 \u00e0 1200 pixels de large pour une image dans un article<\/li><li>600 pixels de large pour une vignette de produit<\/li><\/ul><p>Le poids recommand\u00e9 est de moins de 500 Ko par image, avec un maximum de 3 Mo sur CmonSite.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-764229c elementor-widget elementor-widget-heading\" data-id=\"764229c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Comment r\u00e9duire facilement vos images ?<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-b5b8878 elementor-widget elementor-widget-text-editor\" data-id=\"b5b8878\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Vous avez plusieurs options simples pour optimiser vos images. Choisissez celle qui vous convient le mieux :<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f12fb93 elementor-widget elementor-widget-heading\" data-id=\"f12fb93\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sur Windows avec Photos<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-ed7993a elementor-widget elementor-widget-text-editor\" data-id=\"ed7993a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<ol>\n<li>Ouvrez votre image avec l&#39;application Photos de Windows (install\u00e9e par d\u00e9faut)<\/li>\n<li>Cliquez sur les trois points (&#8230;) en haut \u00e0 droite<\/li>\n<li>Choisissez &quot;Redimensionner&quot;<\/li>\n<li>S\u00e9lectionnez une des tailles propos\u00e9es :<ul>\n<li>&quot;D\u00e9finir une taille personnalis\u00e9e&quot; pour choisir des dimensions pr\u00e9cises<\/li>\n<li>&quot;Grande (1920 x 1080)&quot; pour une image pleine largeur<\/li>\n<li>&quot;Moyenne&quot; pour une image d&#39;article<\/li>\n<\/ul>\n<\/li>\n<li>La case &quot;Conserver les proportions&quot; doit rester coch\u00e9e<\/li>\n<li>Cliquez sur &quot;Enregistrer une copie&quot;<\/li>\n<\/ol>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-7695782 elementor-widget elementor-widget-heading\" data-id=\"7695782\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Sur Mac avec Aper\u00e7u<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-164af02 elementor-widget elementor-widget-text-editor\" data-id=\"164af02\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<ol>\n<li>Ouvrez votre image avec l&#39;application Aper\u00e7u (install\u00e9e par d\u00e9faut)<\/li>\n<li>Dans le menu, cliquez sur &quot;Outils&quot; puis &quot;Ajuster la taille&quot;<\/li>\n<li>Dans la fen\u00eatre qui s&#39;ouvre :<ul>\n<li>V\u00e9rifiez que &quot;Conserver les proportions&quot; est coch\u00e9<\/li>\n<li>Changez la largeur (&quot;Largeur&quot;) selon vos besoins (ex: 1920)<\/li>\n<li>La hauteur s&#39;ajustera automatiquement<\/li>\n<\/ul>\n<\/li>\n<li>Cliquez sur &quot;OK&quot;<\/li>\n<li>Dans le menu &quot;Fichier&quot;, choisissez &quot;Exporter&quot;<\/li>\n<li>Dans la fen\u00eatre d&#39;export :<ul>\n<li>Choisissez un nom pour votre nouvelle image<\/li>\n<li>R\u00e9glez la qualit\u00e9 avec le curseur &quot;Qualit\u00e9&quot; (80% offre souvent un bon compromis)<\/li>\n<\/ul>\n<\/li>\n<li>Cliquez sur &quot;Enregistrer&quot;<\/li>\n<\/ol>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-161ebc2 elementor-widget elementor-widget-heading\" data-id=\"161ebc2\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h3 class=\"elementor-heading-title elementor-size-default\">Avec l'outil en ligne iLoveIMG<\/h3>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3f1ab5d elementor-widget elementor-widget-text-editor\" data-id=\"3f1ab5d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Si vous pr\u00e9f\u00e9rez une solution en ligne simple et rapide :<\/p><ol><li>Rendez-vous sur <a href=\"https:\/\/www.iloveimg.com\/fr\" target=\"_blank\" rel=\"nofollow noopener\">iLoveIMG<\/a><\/li><li>Cliquez sur &#8220;Redimensionner image&#8221;<\/li><li>Cliquez sur &#8220;S\u00e9lectionner des images&#8221; et choisissez vos photos<\/li><li>Dans les options de redimensionnement :<ul><li>S\u00e9lectionnez &#8220;Par largeur&#8221; et entrez la largeur souhait\u00e9e (ex: 1920)<\/li><li>Cochez &#8220;Maintenir les proportions&#8221;<\/li><\/ul><\/li><li>Cliquez sur &#8220;Redimensionner les images&#8221;<\/li><li>Une fois termin\u00e9, cliquez sur &#8220;T\u00e9l\u00e9charger les images&#8221; pour r\u00e9cup\u00e9rer vos images optimis\u00e9es<\/li><\/ol>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3e6acb7 elementor-widget elementor-widget-text-editor\" data-id=\"3e6acb7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>L&#8217;avantage de cet outil est qu&#8217;il vous permet de traiter plusieurs images \u00e0 la fois et qu&#8217;il est tr\u00e8s simple d&#8217;utilisation.<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-1b436bd elementor-widget elementor-widget-heading\" data-id=\"1b436bd\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">Conseils suppl\u00e9mentaires<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-71eb98f elementor-widget elementor-widget-text-editor\" data-id=\"71eb98f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<ul>\n<li>Faites toujours une copie de vos images originales avant de les modifier<\/li>\n<li>Pour les photos de produits, privil\u00e9giez un fond clair ou blanc pour un meilleur rendu<\/li>\n<li>Si possible, utilisez le format JPEG pour les photos et PNG pour les logos ou images avec transparence<\/li>\n<li>V\u00e9rifiez que le texte reste lisible apr\u00e8s la compression<\/li>\n<li>Si une image contient du texte important, \u00e9vitez de trop la comprimer pour garder la lisibilit\u00e9<\/li>\n<\/ul>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-e549681 elementor-widget elementor-widget-text-editor\" data-id=\"e549681\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>En suivant ces conseils, vous aurez des images optimis\u00e9es qui se chargeront rapidement tout en restant de bonne qualit\u00e9. Vos visiteurs appr\u00e9cieront la rapidit\u00e9 de navigation sur votre site !<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>L&#8217;optimisation des images est essentielle pour avoir un site web performant et offrir une meilleure exp\u00e9rience \u00e0 vos visiteurs. Voici un guide simple pour vous aider \u00e0 pr\u00e9parer vos images avant de les t\u00e9l\u00e9charger sur votre site. Pourquoi optimiser ses images ? Quand vous prenez une photo avec votre appareil photo ou votre smartphone moderne, [&hellip;]<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":262,"menu_order":36,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_helpful_status":1,"footnotes":""},"class_list":["post-27254","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/pages\/27254","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/comments?post=27254"}],"version-history":[{"count":12,"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/pages\/27254\/revisions"}],"predecessor-version":[{"id":27266,"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/pages\/27254\/revisions\/27266"}],"up":[{"embeddable":true,"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/pages\/262"}],"wp:attachment":[{"href":"https:\/\/www.cmonsite.fr\/site\/wp-json\/wp\/v2\/media?parent=27254"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}