Desabilite seu adblock e script blocker para visualizar esta página

Você já trabalha com Webp?

webp photoshop

Você já trabalha com Webp?

Postado em Destaques, Diversos, Imagens, Web design

Nesse tutorial vamos o formato de imagem webp criado pela Google para otimizar o carregamento de sites e que está sendo cada vez mais aceito, pois reduz demais a quantidade de bytes que utiliza ao servir cada imagem.

Afinal o que é WebP? É um formato de imagem criado para melhor desempenho em carregamento de imagens na web. Como já sabemos, é recorrente no trabalho de vários devs a necessidade de diminuir o peso de imagens e conteúdos diversos carregados nos sites produzidos; A gigante google por ter parte na entrega do site ao usuário final tomou a frente em um projeto que originou esse e outros formatos de imagens, vídeos, arquivos para sua otimização e utilização em sites, plataformas web, jogos, entre outras utilizações; As imagens sem perdas do WebP são 26% menores em tamanho em comparação com os PNGs. Link do projeto google original: https://developers.google.com/speed/webp

Download

Postagem da Adobe divulgando o plugin do google:

https://helpx.adobe.com/pt/photoshop/kb/support-webp-image-format.html

Links para download direto:

Windows(x64):

https://github.com/webmproject/WebPShop/releases/download/v0.3.3/WebPShop_0_3_3_Win_x64.8bi

macOS (extraia o ZIP):

https://github.com/webmproject/WebPShop/releases/download/v0.3.3/WebPShop_0_3_3_Mac_Universal.zip

Após baixar o plugin você precisa colocar ele na pasta certa, no windows é:

disco local (geralmente C: ) / Arquivos de Programas / Adobe / Adobe Photoshop 2022 / Plug-ins

Bem fácil né? Agora meu exemplo é uma imagem PNG de 318kb que irei salvar em webp:

*Obs.: Salvar em formato webp é somente para imagens já prontas, não funciona se tiver em um PSD ou edição de uma imagem… salve a imagem em JPG ou PNG do tamanho final e após abra no PS e salve em .webp.

Abra o arquivo (JPG ou PNG) no photoshop e para salvar no formato webp aperte ( CTRL + s – no windows ) ( CMD + s – macOS ):

Após escolha o formato webp e após salva na qualidade que achar melhor, pois pode ser feito com maior ou menor qualidade, o que irá impactar para o menor peso da imagem:

Meu resultado foi de ( 318kb – PNG ) | ( 17kb – webp ):

O que acharam, será que tem futuro esse webp???