5 min Avui dia, una web lenta no només genera una mala experiència per a l’usuari: també pot afectar el posicionament a Google, reduir conversions i augmentar el cost de campanyes de Google Ads.
I tot i que hi ha molts factors que influeixen en la velocitat d’una pàgina, un dels errors més comuns continua sent el mateix: imatges massa pesades.
Això passa molt sovint en pàgines administrades per dissenyadors, agències, equips de màrqueting o empreses que pugen contingut directament des del mòbil sense optimitzar-lo prèviament.
La bona notícia és que optimitzar imatges no és complicat. De fet, entenent tres conceptes bàsics, ja és possible reduir enormement el pes d’una web:
- El format de la imatge
- Les dimensions
- La compressió
1. El format: JPG, WebP i per què evitar PNG
Un dels errors més habituals és pujar imatges exportades directament des de Photoshop, Canva o fins i tot des de la càmera del mòbil.
Moltes vegades acaben sent:
- PNG gegants
- fotografies de 6000px
- captures sense comprimir
- imatges HEIC o formats innecessaris
Tot això fa que la web carregui molt més lentament.
Quin format convé utilitzar?
JPG
Durant anys ha estat l’estàndard per a fotografies.
És ideal per a fotos, portfolios, banners i imatges generals. Té bona compatibilitat i un bon equilibri entre qualitat i pes.
WebP
WebP és un format modern pensat per reduir el pes de les imatges mantenint una bona qualitat visual.
Una imatge que pesa 1 MB en JPG pot pesar bastant menys en WebP sense que l’usuari noti una pèrdua important de qualitat.
Actualment, la majoria de webs modernes haurien d’utilitzar WebP sempre que sigui possible.
PNG
El PNG no és “dolent”, però sovint s’utilitza malament.
Està pensat principalment per a transparències, logos o gràfics simples. No s’hauria d’utilitzar per a fotografies normals.
Un dels errors més comuns és exportar una foto com a PNG des de Photoshop o Canva. El resultat acostuma a ser un arxiu gegant.
No pugis mai imatges directament des de la càmera
Aquest és probablement l’error més freqüent.
Les càmeres modernes i els mòbils actuals generen imatges enormes, moltes vegades de 4000px, 6000px o fins i tot més.
A més, acostumen a venir sense una compressió adequada, amb metadades i informació de càmera que no aporta res a la web.
Una pàgina web rarament necessita imatges tan grans.
2. Les dimensions: el veritable secret
Molta gent creu que optimitzar imatges significa únicament “comprimir”.
Però en realitat, l’estalvi més gran acostuma a venir de reduir dimensions.
Per exemple, una imatge de 6000×4000 pot pesar diversos megabytes. Però potser a la web només es mostra a 1200px d’amplada.
En aquest cas, estem carregant una imatge molt més gran del necessari.
Quina mida convé utilitzar?
Com a referència general:
- Hero principal: entre 1600px i 2200px d’amplada
- Imatges normals de contingut: entre 1000px i 1600px d’amplada
- Miniatures: entre 300px i 600px d’amplada
Aquests valors poden variar segons el disseny, però serveixen com a punt de partida per evitar imatges innecessàriament grans.
Un error molt típic a WordPress
Pujar imatges enormes “per si de cas”.
WordPress pot mostrar la imatge visualment més petita, però això no significa que l’arxiu original estigui ben optimitzat.
Si es puja una imatge enorme i després es mostra reduïda amb CSS, la web pot continuar carregant molt més pes del necessari.
3. La compressió
Un cop escollits el format correcte i la mida adequada, és quan entra la compressió.
La compressió busca reduir el pes sense perdre massa qualitat visual.
I aquí passa una cosa important: la majoria d’usuaris no notarà diferència entre una imatge al 100% de qualitat i una imatge ben comprimida.
En canvi, el pes es pot reduir enormement.
Eines online per comprimir imatges
Existeixen diverses eines senzilles per comprimir imatges abans de pujar-les a una web.
Malgrat el nom, també comprimeix JPG i WebP. És una de les opcions més simples: arrossegar, comprimir i descarregar.
Eina molt utilitzada per desenvolupadors. Permet comparar qualitat en temps real, exportar WebP, exportar AVIF i controlar millor la compressió.
Molt popular a Espanya. És pràctica per a usuaris no tècnics que necessiten comprimir imatges ràpidament.
WordPress i la compressió automàtica
La majoria de webs actuals funcionen amb WordPress, i la bona notícia és que existeixen plugins que automatitzen gran part de la feina.
Aquests plugins poden ajudar a:
- comprimir imatges en pujar-les
- convertir JPG i PNG a WebP
- optimitzar imatges ja existents
- reduir el pes general de la biblioteca multimèdia
Plugins recomanats per a WordPress
Molt utilitzat professionalment. Permet comprimir imatges, generar WebP i optimitzar imatges existents.
Una opció molt senzilla i amb bona qualitat, especialment útil per a webs corporatives i botigues online.
Molt útil per convertir automàticament imatges JPG i PNG a WebP dins de WordPress.
I què passa amb Shopify, Webflow i altres plataformes?
Moltes plataformes modernes ja apliquen certa optimització automàtica d’imatges.
Shopify redimensiona i serveix imatges optimitzades en molts casos. Tot i així, continua sent recomanable pujar imatges raonablement preparades des de l’inici.
Webflow també incorpora imatges responsive i eines d’optimització. Però, igual que a qualsevol plataforma, convé evitar pujar arxius gegants sense revisar.
Wix també compta amb optimització automàtica d’imatges, encara que pujar arxius ben preparats continua sent una bona pràctica.
La velocitat importa més del que sembla
Una web lenta genera abandonament, redueix vendes, empitjora campanyes i transmet una sensació de poca professionalitat.
I moltes vegades el problema principal simplement són imatges mal optimitzades.
Per sort, millorar-ho acostuma a ser ràpid i econòmic.
Entendre els formats, les dimensions i la compressió permet millorar enormement el rendiment d’una pàgina web.
