{"id":10115,"date":"2026-09-14T13:30:36","date_gmt":"2026-09-14T12:30:36","guid":{"rendered":"https:\/\/josepgonzalez.com\/?p=10115"},"modified":"2026-10-06T16:43:09","modified_gmt":"2026-10-06T15:43:09","slug":"optimitzacio-imatges-wordpress","status":"publish","type":"post","link":"https:\/\/josepgonzalez.com\/ca\/optimitzacio-imatges-wordpress\/","title":{"rendered":"Optimitzaci\u00f3 d&#8217;imatges per a WordPress"},"content":{"rendered":"<p>Una de les claus del <a href=\"https:\/\/josepgonzalez.com\/ca\/dissenyador-web-wordpress\/\"><strong>disseny web amb WordPress<\/strong><\/a> actual, i m\u00e9s concretament de l&#8217;<strong>optimitzaci\u00f3 SEO<\/strong> i WPO de la nostra p\u00e0gina, \u00e9s <strong>optimitzar les imatges per a WordPress<\/strong>. En aquesta guia actualitzada t&#8217;explico com fer-ho, amb els formats i les eines d&#8217;avui.<\/p>\n<h2>Per qu\u00e8 optimitzar imatges?<\/h2>\n<p>Les imatges s\u00f3n un dels elements essencials del disseny d&#8217;un lloc web. Atrauen l&#8217;atenci\u00f3 dels visitants, permeten presentar una idea i influir en un punt de vista sense escriure ni una l\u00ednia de text.<\/p>\n<p>Tanmateix, fer servir imatges de bona qualitat i alta resoluci\u00f3 implica arxius molt pesats. Aquest pes alenteix el teu web, empitjora l&#8217;experi\u00e8ncia d&#8217;usuari i perjudica m\u00e8triques com l&#8217;<strong>LCP<\/strong> (les <em>Core Web Vitals<\/em> de Google), perqu\u00e8 sovint la imatge principal \u00e9s el que m\u00e9s triga a carregar. Per veure imatges grans sense penalitzar la velocitat, necessitem <strong>comprimir-les i adaptar-les<\/strong>.<\/p>\n<p>En aquest article et mostro els m\u00e8todes que pots fer servir al <a href=\"https:\/\/josepgonzalez.com\/ca\/dissenyador-web-wordpress\/\"><strong>teu web fet amb WordPress<\/strong><\/a>.<\/p>\n<h2>Coneix el pes, la mida i el format de les teves imatges<\/h2>\n<h3>Pes i resoluci\u00f3<\/h3>\n<p>Per comen\u00e7ar, has de saber quant pesa una imatge i quina resoluci\u00f3 t\u00e9. Ho pots veure a la biblioteca de mitjans de WordPress o al teu ordinador. No hi ha una mida perfecta: l&#8217;ideal \u00e9s un equilibri entre qualitat i pes. Com a orientaci\u00f3, una imatge de contingut sol estar ben per sota dels 200\u2013300 KB, i les imatges grans de cap\u00e7alera, una mica per sobre per\u00f2 sense passar-se.<\/p>\n<h3>Formats d&#8217;imatge<\/h3>\n<ul>\n<li><strong>JPG:<\/strong> ideal per a fotografies, amb molts colors i degradats. Permet comprimir molt.<\/li>\n<li><strong>PNG:<\/strong> ideal per a logotips, icones i gr\u00e0fics, i quan necessites transpar\u00e8ncia. Sol pesar m\u00e9s que un JPG en fotografies.<\/li>\n<li><strong>WebP:<\/strong> format modern, amb millor compressi\u00f3 que JPG i PNG i compatible amb tots els navegadors actuals. WordPress l&#8217;admet des de fa temps i avui \u00e9s la meva opci\u00f3 recomanada.<\/li>\n<li><strong>AVIF:<\/strong> encara m\u00e9s eficient que WebP. WordPress l&#8217;admet en les seves versions recents i el seu \u00fas creix, tot i que conv\u00e9 comprovar la compatibilitat amb el teu plugin i el teu hosting.<\/li>\n<li><strong>SVG:<\/strong> per a logos i icones vectorials, que es veuen n\u00edtids a qualsevol mida i pesen molt poc.<\/li>\n<\/ul>\n<h3>Mida en p\u00edxels<\/h3>\n<p>No pugis una foto de 4000 \u00d7 3000 p\u00edxels si al teu web es veur\u00e0 a 1200 p\u00edxels d&#8217;amplada. Com a refer\u00e8ncia, una amplada m\u00e0xima d&#8217;uns <strong>1920 p\u00edxels<\/strong> \u00e9s suficient per a la gran majoria de webs. WordPress, a m\u00e9s, redueix autom\u00e0ticament les imatges enormes i genera diverses mides de cadascuna per adaptar-les a cada dispositiu.<\/p>\n<p>Hi ha dos moments per optimitzar les imatges: <strong>abans de pujar-les<\/strong> i <strong>una vegada publicades<\/strong>.<\/p>\n<h2>Comprimir imatges abans de pujar-les<\/h2>\n<h3>Editor de fotografies<\/h3>\n<p>La primera opci\u00f3 \u00e9s comprimir-les amb un editor com Photoshop, GIMP o Affinity Photo. Solen tenir l&#8217;opci\u00f3 \u00abDesa per al web\u00bb o \u00abExporta com a\u00bb, amb la qual pots ajustar la mida, la qualitat i el format.<\/p>\n<h3>Eines en l\u00ednia per comprimir<\/h3>\n<p>Una de les m\u00e9s utilitzades, i la que faig servir jo en molts dels meus treballs, \u00e9s <a href=\"https:\/\/tinypng.com\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\"><strong>TinyPNG<\/strong><\/a> (que tamb\u00e9 comprimeix JPG i WebP). No cal registrar-s&#8217;hi: arrossegues i deixes anar les teves imatges, una o diverses alhora, i descarregues les optimitzades. Pot reduir una part molt important del pes i mant\u00e9 la transpar\u00e8ncia als PNG. Una altra excel\u00b7lent opci\u00f3 gratu\u00efta \u00e9s <strong>Squoosh<\/strong>, de Google, que et permet comparar la qualitat abans i despr\u00e9s i convertir a WebP o AVIF.<\/p>\n<figure id=\"attachment_6232\" aria-describedby=\"caption-attachment-6232\" style=\"width: 1024px\" class=\"wp-caption aligncenter\"><img fetchpriority=\"high\" decoding=\"async\" class=\"wp-image-6232 size-large\" src=\"https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.47-1024x596.png\" alt=\"Optimitzaci\u00f3 d'imatges per a WordPress amb TinyPNG\" width=\"1024\" height=\"596\" \/><figcaption id=\"caption-attachment-6232\" class=\"wp-caption-text\">Compressi\u00f3 realitzada amb la possibilitat de descarregar les imatges<\/figcaption><\/figure>\n<h2>Optimitzar imatges ja publicades a WordPress<\/h2>\n<p>Una vegada que les imatges s\u00f3n a la teva biblioteca, les pots comprimir autom\u00e0ticament amb un plugin. Alguns dels m\u00e9s usats s\u00f3n <a href=\"https:\/\/wordpress.org\/plugins\/wp-smushit\/\" target=\"_blank\" rel=\"nofollow noopener noreferrer\"><strong>Smush<\/strong><\/a>, <strong>ShortPixel<\/strong>, <strong>Imagify<\/strong> i <strong>EWWW Image Optimizer<\/strong>. Tots tenen versi\u00f3 gratu\u00efta amb l\u00edmits i plans de pagament, i gaireb\u00e9 tots poden <strong>convertir les teves imatges a WebP<\/strong> i optimitzar les noves cada vegada que les puges.<\/p>\n<p><img decoding=\"async\" class=\"size-large wp-image-6236 aligncenter\" src=\"https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21-1024x489.png\" alt=\"Plugin d'optimitzaci\u00f3 d'imatges per a WordPress\" width=\"1024\" height=\"489\" srcset=\"https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21-1024x489.png 1024w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21-150x72.png 150w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21-300x143.png 300w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21-768x367.png 768w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21-1536x733.png 1536w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.11.21.png 1978w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>En el cas de Smush, una vegada activat, nom\u00e9s has de prem\u00e9r el bot\u00f3 d&#8217;<strong>optimitzaci\u00f3 massiva<\/strong> perqu\u00e8 treballi en el proc\u00e9s. La versi\u00f3 gratu\u00efta limita quantes imatges processa cada vegada, aix\u00ed que si en tens moltes, haur\u00e0s de repetir el proc\u00e9s.<\/p>\n<p><img decoding=\"async\" class=\"size-large wp-image-6230 aligncenter\" src=\"https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-1024x578.png\" alt=\"Optimitzaci\u00f3 massiva d'imatges a WordPress\" width=\"1024\" height=\"578\" srcset=\"https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-1024x578.png 1024w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-150x85.png 150w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-300x169.png 300w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-768x433.png 768w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-1536x866.png 1536w, https:\/\/josepgonzalez.com\/wp-content\/uploads\/2018\/09\/Captura-de-pantalla-2018-09-14-a-les-14.13.55-2048x1155.png 2048w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/p>\n<p>A m\u00e9s, en configurar el plugin pots limitar la mida m\u00e0xima de les imatges. Si puges fotos de 4000 \u00d7 4000 p\u00edxels, no cal: posa com a l\u00edmit una amplada raonable (per exemple, 1920 px) i baixar\u00e0s encara m\u00e9s el pes.<\/p>\n<p><strong>Consell:<\/strong> si puges poques fotos, pots tenir el plugin inactiu quan acabi la compressi\u00f3, i aix\u00ed el teu web no haur\u00e0 de carregar-lo a cada visita (tot i que l&#8217;optimitzaci\u00f3 autom\u00e0tica de noves imatges \u00e9s molt c\u00f2moda). Tamb\u00e9 et pots ajudar d&#8217;un plugin de mem\u00f2ria cau i optimitzaci\u00f3 com WP Rocket.<\/p>\n<h2>Altres bones pr\u00e0ctiques amb les imatges<\/h2>\n<ul>\n<li><strong>C\u00e0rrega diferida (lazy loading):<\/strong> WordPress l&#8217;aplica per defecte a les imatges. Assegura&#8217;t de no aplicar-la a la imatge principal de la part superior de la p\u00e0gina (la que es veu tot just entrar), perqu\u00e8 alentiria l&#8217;LCP.<\/li>\n<li><strong>Indica sempre l&#8217;amplada i l&#8217;al\u00e7ada<\/strong> de les imatges per evitar salts de disseny mentre carrega la p\u00e0gina.<\/li>\n<li><strong>Fes servir una CDN<\/strong> si el teu web rep visites de diferents pa\u00efsos.<\/li>\n<li><strong>Revisa el teu maquetador:<\/strong> si fas servir Elementor, evita imatges de fons gegants i aprofita les opcions d&#8217;imatges responsive.<\/li>\n<\/ul>\n<h2>Extra: descriu b\u00e9 les teves imatges per millorar el SEO<\/h2>\n<p>\u00c9s essencial donar informaci\u00f3 sobre cada imatge per millorar-ne el posicionament i l&#8217;accessibilitat. A la biblioteca de mitjans de WordPress omple el <strong>text alternatiu (alt)<\/strong>, que descriu all\u00f2 que mostra la imatge, el t\u00edtol i, si escau, la descripci\u00f3. I posa-li un <strong>nom d&#8217;arxiu descriptiu<\/strong> abans de pujar-la (per exemple, \u00aboptimitzar-imatges-wordpress.webp\u00bb en lloc d'\u00bbIMG_4521.jpg\u00bb).<\/p>\n<h2>Preguntes freq\u00fcents<\/h2>\n<h3>Quin format d&#8217;imatge \u00e9s millor per a WordPress?<\/h3>\n<p>WebP \u00e9s avui la millor opci\u00f3 general. Fes servir JPG per a fotografies si necessites m\u00e0xima compatibilitat, PNG nom\u00e9s quan necessitis transpar\u00e8ncia, i SVG per a logos i icones.<\/p>\n<h3>Quant ha de pesar una imatge al web?<\/h3>\n<p>No hi ha un n\u00famero m\u00e0gic, per\u00f2 com a regla general, com menys, millor: les imatges de contingut, per sota d&#8217;uns 200\u2013300 KB.<\/p>\n<h3>Optimitzar imatges millora el SEO?<\/h3>\n<p>S\u00ed: millora la velocitat de c\u00e0rrega, l&#8217;experi\u00e8ncia d&#8217;usuari i la pres\u00e8ncia a Google Imatges.<\/p>\n<p>Finalment, despr\u00e9s de fer aquesta optimitzaci\u00f3 pots comprovar si la teva p\u00e0gina ha millorat en velocitat de c\u00e0rrega. Si no saps com, llegeix l&#8217;article sobre <a href=\"https:\/\/josepgonzalez.com\/ca\/mesurar-velocitat-carrega-web\/\">Com mesurar la velocitat de c\u00e0rrega del teu web?<\/a><\/p>\n<p>Si t&#8217;ha agradat, deixa&#8217;m un comentari o comparteix aquest article a xarxes socials. Em far\u00e0 molta il\u00b7lusi\u00f3!<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Una de les claus en el disseny web amb WordPress actual i m\u00e9s concretament en l&#8217;optimitzaci\u00f3 SEO o WPO de la nostra p\u00e0gina web \u00e9s l&#8217;optimitzaci\u00f3 d&#8217;imatges per a WordPress.<\/p>\n","protected":false},"author":1,"featured_media":10135,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[87,88],"tags":[],"class_list":["post-10115","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-seo-ca","category-wordpress-ca"],"_links":{"self":[{"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/posts\/10115","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/comments?post=10115"}],"version-history":[{"count":3,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/posts\/10115\/revisions"}],"predecessor-version":[{"id":10250,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/posts\/10115\/revisions\/10250"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/media\/10135"}],"wp:attachment":[{"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/media?parent=10115"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/categories?post=10115"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/josepgonzalez.com\/ca\/wp-json\/wp\/v2\/tags?post=10115"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}