Optimizar e gardar imaxes GIF

Pin
Send
Share
Send


Despois de crear unha animación en Photoshop, cómpre gardala nun dos formatos dispoñibles, un dos cales GIF. Unha característica deste formato é que está destinado á exhibición (reprodución) nun navegador.

Se estás interesado en outras opcións para aforrar animación, recomendámosche ler este artigo:

Lección: Como gardar un vídeo en Photoshop

Proceso de creación GIF a animación foi descrita nunha das leccións anteriores e hoxe falaremos de como gardar o ficheiro no formato GIF e sobre a configuración de optimización.

Lección: Crea unha animación sinxela en Photoshop

Aforro GIF

En primeiro lugar, repita o material e familiarizarse coa xanela de configuración de gardar. Abre facendo clic no elemento. Aforrar para web no menú Arquivo.

A xanela consta de dúas partes: un bloque de vista previa

e bloqueo de configuración.

Bloque de vista previa

A elección do número de opcións de visualización está seleccionada na parte superior do bloque. Dependendo das túas necesidades, podes seleccionar a configuración desexada.

A imaxe en cada xanela, agás a orixinal, configúrase por separado. Isto faise para que poida escoller a mellor opción.

Na parte superior esquerda do bloque hai un pequeno conxunto de ferramentas. Só usaremos "Man" e "Escala".

Con Mans Pode mover a imaxe dentro da xanela seleccionada. Esta selección tamén se fai con esta ferramenta. "Escala" realiza a mesma acción. Podes facer zoom e reducir cos botóns na parte inferior do bloque.

Debaixo hai un botón coa inscrición Ver. Abre a opción seleccionada no navegador predeterminado.

Na xanela do navegador, ademais dun conxunto de parámetros, tamén podemos obter Código HTML GIFs

Bloqueo de configuración

Neste bloque axústanse os parámetros da imaxe, consideraremos máis en detalle.

  1. Esquema de cores. Esta configuración determina que táboa de cores indexada se aplicará á imaxe durante a optimización.

    • Perceptual, senón simplemente un "esquema de percepción". Cando se aplica, Photoshop crea unha táboa de cores, guiada polas cores actuais da imaxe. Segundo os desenvolvedores, esta táboa é o máis próxima posible a como o ollo humano ve as cores. Ademais, a imaxe máis próxima ao orixinal, as cores consérvanse ao máximo.
    • Selectivo O esquema é similar ao anterior, pero emprega principalmente cores seguras para a web. Tamén fai fincapé na exhibición de tons próximos ao orixinal.
    • Adaptativa. Neste caso, a táboa créase a partir de cores máis comúns na imaxe.
    • Limitada. Consta de 77 cores, algunhas substituídas por branco en forma de punto (gran).
    • Personalizado. Ao escoller este esquema, é posible crear a túa propia paleta.
    • Branco e negro. Nesta táboa só se usan dúas cores (branco e negro), empregando tamén o tamaño do gran.
    • En escala de grises. Aquí úsanse varios 84 niveis de tons de gris.
    • MacOS e Windows. Estas táboas están compiladas en función das características de visualización de imaxes nos navegadores que executan estes sistemas operativos.

    Aquí tes algúns exemplos de uso de circuítos.

    Como podes ver, as tres primeiras mostras son de calidade bastante aceptable. A pesar de que visualmente case non se diferencian entre si, estes esquemas funcionarán de forma diferente en diferentes imaxes.

  2. Número máximo de cores nunha táboa de cores.

    O número de tons na imaxe afecta directamente ao seu peso e, en consecuencia, a velocidade de descarga no navegador. Valor máis empregado 128, xa que este axuste non ten case ningún efecto sobre a calidade, ao tempo que reduce o peso do gif.

  3. Cores web. Esta configuración establece a tolerancia coa que os tons son convertidos a equivalentes desde unha paleta Web segura. O peso do ficheiro está determinado polo valor definido polo control deslizante: o valor é maior - o ficheiro é máis pequeno. Ao configurar cores web, non te esquezas da calidade.

    Un exemplo:

  4. Dithering permite suavizar as transicións entre cores mesturando os tons contidos na táboa de indexación seleccionada.

    Ademais, o axuste axudará, na medida do posible, a preservar os gradientes e a integridade das seccións monofónicas. Cando se aplica o dithering, aumenta o peso do ficheiro.

    Un exemplo:

  5. Transparencia Formato GIF só admite píxeles absolutamente transparentes ou absolutamente opacos.

    Este parámetro, sen axuste adicional, visualiza mal liñas curvas, deixando escaleiras de píxeles.

    Chámase afinación fina "Matt" (nalgunhas edicións "Fronteira") Coa súa axuda configúrase a mestura de píxeles da imaxe co fondo da páxina na que se ubicará. Para obter a mellor visualización, elixe unha cor que coincida coa cor de fondo do sitio.

  6. Entrelazado. Un dos máis útiles para a configuración web. Nese caso, se o ficheiro ten un peso importante, permítelle mostrar inmediatamente a imaxe na páxina, mellorando a súa calidade a medida que se carga.

  7. A conversión sRGB axuda a manter o máximo das cores da imaxe orixinal mentres aforra.

Personalización "Derrocamento da transparencia" degrada significativamente a calidade da imaxe e sobre o parámetro "Perdas" falaremos na parte práctica da lección.

Para unha mellor comprensión do proceso de configuración do aforro GIF en Photoshop, cómpre practicar.

Práctica

O obxectivo de optimizar imaxes para Internet é minimizar o peso dos ficheiros mantendo a calidade.

  1. Despois de procesar a imaxe, vai ao menú Ficheiro: Gardar para web.
  2. Fixamos o modo de visualización "4 opcións".

  3. A continuación, ten que facer unha das opcións o máis semellante posible á orixinal. Que sexa a imaxe á dereita da fonte. Isto faise para estimar o tamaño do ficheiro á máxima calidade.

    A configuración dos parámetros é a seguinte:

    • Esquema de cores "Selectivo".
    • "Cores" - 265.
    • Derrocamento - "Aleatorio", 100 %.
    • Eliminamos o daw diante do parámetro Entrelazado, xa que o volume final da imaxe será bastante pequeno.
    • Cores web e "Perdas" - cero.

    Compara o resultado co orixinal. Na parte inferior da xanela coa mostra, podemos ver o tamaño actual do GIF e a súa velocidade de descarga na velocidade de Internet indicada.

  4. Vai á imaxe de abaixo configurada. Intentamos optimizalo.
    • Deixamos o esquema sen cambios.
    • O número de cores redúcese a 128.
    • Valor Derrocamento reducir ata o 90%.
    • Cores web non tocamos, porque neste caso non nos axudará a manter a calidade.

    O tamaño GIF diminuíu de 36,59 KB a 26,85 KB.

  5. Dado que a imaxe ten algúns defectos pequenos e graciosos, intentaremos aumentar "Perdas". Este parámetro define o nivel aceptable de perda de datos durante a compresión. GIF. Cambia o valor a 8.

    Conseguimos reducir aínda máis o tamaño do ficheiro, perdendo un pouco de calidade. Os GIF agora pesan 25,9 quilobytes.

    En total, puidemos reducir o tamaño da imaxe en aproximadamente 10 KB, o que supón un 30%. Un moi bo resultado.

  6. Outras accións son moi sinxelas. Fai clic no botón Gardar.

    Elixe un lugar onde gardar, dálle o nome do gif e, de novo, fai clic en "Gardar ".

    Teña en conta que existe unha posibilidade con GIF crear e HTML documento no que se incorporará a nosa imaxe. Para iso, é mellor seleccionar un cartafol baleiro.

    Como resultado, obtemos unha páxina e un cartafol cunha imaxe.

Consello: ao nomear un ficheiro, intente non usar caracteres cirílicos, xa que non todos os exploradores son capaces de lelos.

Esta é a lección para gardar a imaxe en formato GIF completado Sobre el descubrimos como optimizar un arquivo para a súa publicación en internet.

Pin
Send
Share
Send

Mira o vídeo: Gimp:Captura pantalla (Novembro 2024).