Principal Disseny Gràfic Com reduir la mida del fitxer GIF per a un millor rendiment del lloc web

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



Què saber

  • Retalla l'espai addicional al voltant de la imatge per reduir-ne les dimensions en píxels. Quan prepareu el GIF, reduïu-ne les dimensions de sortida.
  • Redueix el nombre de colors de la imatge. Per als GIF animats, reduïu el nombre de fotogrames.
  • Eviteu tramades i entrellaçats. Si el vostre programari té una opció amb pèrdua per desar GIF, això reduirà significativament la mida del fitxer.

Aquest article explica les regles generals que cal tenir en compte per reduir la mida dels fitxers GIF al vostre lloc web perquè les imatges es carreguin més ràpidament i el vostre lloc web funcioni de manera més eficient.

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

Per fer que el vostre GIF sigui el més eficient possible:

  1. Retalla qualsevol espai addicional al voltant de la imatge. Reduir les dimensions de píxels d'una imatge és la manera més eficaç de reduir la mida del fitxer. Si feu servir Photoshop, el Retallar La comanda funciona bé per a això.

  2. Quan prepareu una imatge GIF, reduïu les dimensions de sortida. Cada programa d'edició de gràfics ofereix diferents ordres per canviar la mida.

  3. Redueix el nombre de colors de la imatge. Els GIF només mostren 256 colors, però si la vostra imatge només en té uns quants, reduïu el nombre de colors de totes maneres. Quan reduïu els colors als GIF, obteniu la millor compressió quan els colors del nombre s'estableixen en la més petita possible d'aquestes opcions: 2, 4, 8, 16, 32, 64, 128 o 256.

  4. Redueix el nombre de fotogrames de la imatge per als GIF animats. Eviteu animacions inútils, en general. L'excés d'animació augmenta el temps de descàrrega de la pàgina web i molta gent la distraeix.

    com reproduir la vostra pròpia música a gta 5 xbox one
  5. Si utilitzeu Photoshop , creeu un fitxer GIF utilitzant el Exporta com a element del menú. Seleccioneu Dossier > Exporta com a . Quan s'obri el menú, seleccioneu GIF com a format de fitxer i reduir les dimensions físiques (amplada i alçada) de la imatge.

  6. Si utilitzeu Adobe Photoshop Elements, seleccioneu Dossier > Desa per a la web . Aquest procés obre el Desa per a la web quadre de diàleg que també es troba a Adobe Photoshop a Dossier > Exporta > Desa per al web (heretat) . Quan s'obri, apliqueu tramades, reduïu el color i modifiqueu les dimensions físiques de la imatge.

    com fer captures de pantalla a Snapchat sense que la gent ho sàpiga
  7. Eviteu el dithering. Dithering pot millorar algunes imatges, però augmenta la mida del fitxer. Si el vostre programari ho permet, utilitzeu un nivell inferior de tramado per estalviar bytes addicionals.

  8. Alguns programes tenen una opció amb pèrdues per desar GIF. Aquesta opció pot reduir significativament la mida del fitxer, però també redueix la qualitat de la imatge.

  9. No utilitzeu entrellaçat. L'entrellaçat sol augmentar la mida del fitxer.

  10. Tant Photoshop com Photoshop Elements mostren el temps de descàrrega. No hi facis cas. Es basa en l'ús d'un mòdem de 56k. Apareix un número més vàlid si seleccioneu un mòdem per cable al menú desplegable.

Imatges GIF i la web

Les imatges GIF no són una solució única. Les imatges GIF tenen un màxim de 256 colors, el que significa que podeu esperar una degradació severa de la imatge i del color si no aneu amb compte.

El format de fitxer GIF, en molts aspectes, és un format heretat que es remunta als primers dies del web. Abans de la introducció del format GIF, les imatges web eren en blanc i negre i es comprimien amb el format RLE. Els GIF van aparèixer per primera vegada l'any 1987 quan Compuserve va llançar el format com a solució d'imatge web. En aquell moment, el color acabava de sorgir a l'escriptori i s'accedia a la web mitjançant mòdems connectats a la línia telefònica. Aquesta nova infraestructura va crear la necessitat d'un format d'imatge que mantingués les imatges prou petites per ser lliurades, a través d'una línia telefònica, a un navegador web en poc temps.

Les imatges GIF són ideals per a gràfics de vores nítides amb una paleta de colors limitada, com ara un logotip o un dibuix de línies. Tot i que el format GIF es pot utilitzar per a fotografies, la paleta de colors reduïda introdueix artefactes a la imatge. Tot i així, el Moviment Glitch Art i l'auge de la cinemagraph han despertat un renovat interès pel format GIF.

Preguntes freqüents
  • Com puc dimensionar un GIF emoji per a Discord?

    Quan carregueu un GIF a Discord, ajustarà automàticament la imatge a 128x128 píxels si cal. Tot i que Discord permet compartir imatges i altres fitxers de fins a 8 MB (o més amb una subscripció a Nitro), el límit de mida dels emojis és de 256 kb.

  • Com comprimir un GIF sense perdre qualitat?

    La manera més senzilla de comprimir un GIF sense afectar la qualitat és utilitzar la funció de compressió pròpia de l'Explorador de fitxers . Alguns programaris de compressió de tercers, com WinZip , també es poden utilitzar per comprimir GIF sense reduir la seva qualitat visual general.

    quin RAM té el meu ordinador
  • Com puc combinar diversos GIF en un sol GIF?

    Feu servir un programari d'edició d'imatges com Photoshop, seleccioneu Dossier > Importar > Marcs de vídeo a capes i tria tots els GIF que vulguis combinar. Seleccioneu tots els fotogrames d'animació del primer GIF i, a continuació, copieu-los seleccionant-los Finestra > Animació . A continuació, aneu al GIF següent, trieu on voleu inserir el GIF anterior i, a continuació, enganxeu els fotogrames copiats. Repetiu-ho amb altres GIF que vulgueu afegir i, a continuació, exporteu la fusió acabada quan hàgiu acabat.

Articles D'Interès

L'Elecció De L'Editor

Com obrir el símbol del sistema (Windows 11, 10, 8, 7, etc.)
Com obrir el símbol del sistema (Windows 11, 10, 8, 7, etc.)
A continuació s'explica com obrir el símbol del sistema a Windows 11, 10, 8, 7, Vista i XP. Heu d'obrir el símbol del sistema abans d'executar una ordre.
Com arreglar una càmera web que no funciona a OBS
Com arreglar una càmera web que no funciona a OBS
Open Broadcaster Software, o OBS en breu, és una eina útil i gratuïta que podeu utilitzar per transmetre o gravar vídeo. Funciona molt bé en la seva major part, però és possible que us trobeu amb un singlot aquí i allà. Si la càmera web s’atura
S’hi mostren icones de colors de Windows 10 per a persones d’interès
S’hi mostren icones de colors de Windows 10 per a persones d’interès
Microsoft és conegut per crear noves icones de colors per a Windows 10X. S’esperava que les noves icones s’utilitzessin en aquesta edició especial del sistema operatiu per a dispositius de doble pantalla. A partir d’avui, Microsoft llança les noves icones a Insiders a l’anell ràpid de Windows 10. Publicitat Les noves icones les han trobat inicialment entusiastes,
Data de llançament, funcions i bloc en directe d’Apple Watch Series 2 al Regne Unit: Apple presenta Apple Watch a prova de bany
Data de llançament, funcions i bloc en directe d’Apple Watch Series 2 al Regne Unit: Apple presenta Apple Watch a prova de bany
Apple ha anunciat la seva nova iteració de rellotge intel·ligent: l’Apple Watch Series 2. S’assembla (i presumiblement fa olor) al primer Apple Watch, però amb algunes actualitzacions d’especificacions, GPS integrat i
Com habilitar el mode HiDPI a macOS
Com habilitar el mode HiDPI a macOS
Voleu una nitidesa semblant a la retina al vostre monitor de definició estàndard? A continuació s'explica com aconseguir-ho amb el mode HiDPI a OS X, tot i que hi ha una gran advertència que el fa útil només en circumstàncies especials. Continua llegint per saber-ne més.
Revisió de Motorola Moto G6: com va recuperar la seva ranura el Moto G
Revisió de Motorola Moto G6: com va recuperar la seva ranura el Moto G
Si Joc de trons m’ha ensenyat alguna cosa (i, sincerament, no és un bon professor), és que la posició al tron ​​titular és difícil de mantenir. El tron ​​del pressupost dels telèfons intel·ligents és igualment competitiu, encara que amb un
Com desactivar la correcció automàtica al Moto Z2 Force
Com desactivar la correcció automàtica al Moto Z2 Force
Tot i que les funcions de text predictiu són cada cop més precises, encara els queda molt camí per recórrer. De moment, utilitzar la correcció automàtica pot suposar més problemes del que val la pena. Llavors, com desfer-se del telèfon?