Com reduir la mida del fitxer GIF per a un millor rendiment del lloc web

El baix GIF fa una reaparició simplement perquè amb l'ús creixent dels telèfons intel·ligents i els usuaris d'ample de banda limitats, s'han esperat moments de càrrega gairebé immediats. Com més petites siguin les imatges web, més ràpidament es carreguin les imatges i més feliços seran els visitants. A més, molts llocs web tenen restriccions sobre la mida dels banners publicitaris.

Imatges GIF i la web

Les imatges GIF no es poden considerar com una solució d'una sola mida. Les imatges GIF tenen un màxim de 256 colors, és a dir, podeu esperar una imatge greu i una degradació del color si no teniu cura. El format del fitxer GIF, en molts aspectes, és un format hereu que es remunta als primers dies de la web. Abans de la introducció del format GIF, les imatges web eren en blanc i negre i es comprimien amb el format RLE. Van aparèixer per primera vegada en 1987 quan Compuserve va publicar el format com una solució d'imatge web. En aquell moment, el color emergia a l'escriptori i els mòdems connectats a la xarxa tenien accés a la línia telefònica. Això va crear una necessitat d'un format d'imatge que mantingués imatges prou petites com per ser lliurades, a través d'una línia telefònica, a un navegador web a curt termini.

Les imatges GIF són ideals per als gràfics de fragments amb una paleta de colors limitada, com ara un logotip o un dibuix de línia. Tot i que es poden utilitzar per a fotografies, la paleta de colors reduïda introduirà artefactes a la imatge. Tot i així, el moviment Glitch Art i l'ascens del cinemagraph han despertat un interès renovat en el format GIF.

Com reduir la mida del fitxer GIF per a un millor rendiment del lloc web

Aquests consells us ajudaran a fer que els vostres GIF siguin tan petits com sigui possible.

  1. Retalla qualsevol espai addicional al voltant de la imatge. Reduir les dimensions del píxel de la vostra imatge és la manera més efectiva de reduir la mida del fitxer. Si utilitzeu Photoshop, l'ordre Trim funciona bé per a això.
  2. Quan prepareu una imatge gif, podeu reduir les dimensions de sortida.
  3. Redueix la quantitat de colors a la imatge.
  4. Per als GIF animats, reduïu el nombre de marcs a la imatge.
  5. Si utilitzeu Photoshop CC 2017, podeu crear un fitxer GIF mitjançant l'element de menú Exportar com. Seleccioneu Fitxer> Exporta com ... i quan s'obre el menú, seleccioneu GIF com a format de fitxer i reduïu les dimensions físiques (ample i alçada) de la imatge.
  6. Si utilitzeu Adobe Photoshop Elements 14, seleccioneu Fitxer> Desa per a web. Això obrirà el quadre de diàleg Desa per a la web que també es troba a Adobe Photoshop CC 2017, Fitxer> Exporta> Desa per a web (Llegat) . Quan s'obre, podeu aplicar el taquetatge, reduir el color i les dimensions físiques de la imatge.
  7. Eviteu el taquetatge. Dithering pot fer que algunes imatges es vegin millor, però augmentarà la mida del fitxer. Si el vostre programari ho permet, utilitzeu un nivell de tinta inferior per estalviar bytes addicionals.
  1. Alguns programes tenen una opció "perjudicial" per guardar GIF. Aquesta opció pot reduir significativament la mida del fitxer, però també redueix la qualitat d'imatge.
  2. No utilitzeu l'entrellaçat. L'entrellaçat normalment augmenta la mida del fitxer.
  3. Tant Photoshop com Photoshop Elements us mostraran el temps de descàrrega. No cal atendre'l. Es basa en l'ús d'un mòdem de 56 k. Apareixerà un número més vàlid si seleccioneu un mòdem de cable al menú desplegable.

Consells:

  1. Eviteu l'animació inútil. L'animació excessiva no només s'afegeix al temps de descàrrega de la vostra pàgina web, però molts usuaris la distraen.
  2. Les imatges GIF amb grans blocs de color sòlid i patrons horitzontals es comprimeixen millor que les imatges amb gradacions de color, ombres suaus i patrons verticals.
  3. Quan reduïu els colors dels GIF, obtindreu la millor compressió quan el nombre de colors s'estableixi al més petit possible d'aquestes opcions: 2, 4, 8, 16, 32, 64, 128 o 256.

Actualitzat per Tom Green