Blog Quero Dicas : Webp: Novo formato para reduzir o peso das imagens e o carregamento do seu blog


Webp: Novo formato para reduzir o peso das imagens e o carregamento do seu blog

| |




Quem tem um blog sabe da importância do seu carregamento na internet. Muitos ficam buscando o tempo todo um jeito de fazê-lo carregar muito mais rápido, principalmente, para quem utiliza a plataforma Blogger. Afinal, o Blogger não disponibiliza diferentes plugins para este feito.

Foi lançado em 2010, o formato de imagem chamado WebP, desenvolvido pelo Google que promete reduzir o tamanho das imagens em até 40%. Atualmente, se fala muito mais dele e hoje eu trago para vocês.


O que é WebP?

O WebP (pronuncia-se Weppy) é um formato de imagem desenvolvida pela Google Inc., com o objetivo de diminuir o tamanho dos arquivos e garantir uma transferência mais rápida para quem possui uma internet lenta

Foi descoberto "por acaso" por alguns engenheiros do Google quando estavam trabalhando em um CODEC de vídeo (VP8) e conseguiram chegar a uma compressão de imagem melhor que a do formato jpg, o melhor formato desde então. (Wikipédia)

Resumindo...

WebP é um método de compactação leve, ou seja, que mantém o máximo de qualidade das imagens visíveis em um blog ou site. É, infinitivamente, mais leve, carrega muito mais rápido e consume menos banda.

O impacto de quem utiliza esse formato em um website é mostrado já nas primeiras utilizações. O índice de carregamento é incrivelmente rápido! E sabemos que o carregamento do nosso blog é um dos principais fatores de ranqueamento no buscador Google.

O formato webp é suportado no Google Chrome, no Firefox, Edge, Opera e em muitas outras ferramentas e software. Os desenvolvedores também adicionaram suporte a várias ferramentas de edição de imagens, por exemplo: Plugin WebP para o photoshop (ainda não testei).


WebP é muito diferente dos formatos jpg e png?

Não! Veja você mesmo...
Coloquei essa imagem com alguns detalhes para vocês verem a diferença na prática.




Notaram a diferença?

Uma é jpg, uma é png e a outra é webp. As diferenças são muito sutis. Tem que prestar muita atenção para notar.

A primeira é jpg e pesa 59,7kb, a segunda é png e pesa 148kb, a terceira é a conversão webp e pesa  57,6kb. Viram a diferença de peso, principalmente, para o formato png?

Lembrando que eu comprimi e otimizei as duas primeiras imagens antes de postá-las, como eu sempre faço devido ao peso original delas, que era de jpg 338,7kb e a png 675kb. Mas não precisa comprimir as imagens. Você pode utilizar o peso original das imagens no conversor de webp. Ele automaticamente faz a otimização e a conversão ao mesmo tempo.


Como converter imagens jpg e png em webp?

Hoje em dia exitem alguns sites que fazem este procedimento de conversão. Vamos a lista.


Convertio : O site é simples e rápido. Basta carregar as imagens que deseja converter (jpg ou png) e clicar em converter e salvá-las em seu computador. Lembrando que as imagens não precisam estar necessariamente em seu computador, pode estar hospedadas no Google Drive, Drop Box ou ter a url dela para a conversão.

Infelizmente, o site só oferece 10 minutos de conversão por dia no plano gratuito. Convertio oferece uma extensão para o Chrome.


Ezgif  : Este é um site bem legal e, acredito, que o mais completo. Exite alguns recursos básicos de edição, além da conversão. No site da pra visualizar como a imagem ficará ao ser convertida e há a possibilidade de converter de webp para os formatos tradicionais. No site você pode produzir gifs.


• WebP Converter : Este é super básico e simples. No site aparece uma caixa com publicidade, MAS basta clicar dentro da área vazia ao lado para abrir a janela para você selecionar sua imagem. Após a conversão, automaticamente irá abrir a janela para você salvar.

Infelizmente, só dá para converter uma imagem por vez, apesar disso, a redução de peso é menor do que os 2 sites anteriores mas a qualidade da imagem é bem maior.


• Online Convert : O processo nesse site é o mesmo! Carregar as imagens que deseja, clique para iniciar e fazer o download das imagens já convertidas.  As imagens não precisam estar necessariamente em seu computador, pode estar hospedadas no Google Drive, Drop Box ou ter a url dela para a conversão.

Além da conversão para webp, o site oferece outros tipos de conversor: Arquivos, áudio, para diferentes formatos de imagens, vídeo...
Online Convert também oferece uma extensão para o Chrome.

• Além dos sites acima você também pode baixar um plugin para abrir e salvar imagens WebP no Photoshop, caso você utilize esse editor. Lembrando que eu nunca tentei, mais se quiser testar basta baixar aqui "File Formats" e seguir este tutorial WebP no Photoshop.


Quais os pontos positivos e negativos ao usar WebP


Pontos Positivos

Exite diversos pontos positivos ao utilizar este formato em um blog: Este formato mantém a qualidade das imagens, diminuindo o seu peso, juntamente com o tempo de carregamento do blog. Deixando incrível! 

Pontos Negativos

• Nem todas as imagens ficam boas.

• Atualmente apenas o Google Chrome, Firefox, Edge e Opera suportam o WebP. Por isso, preste atenção nos navegadores. Para aqueles que utilizam a plataforma Wordpress existe plugins que auxiliam esse suporte.

• Uma coisa chatinha, mais nada grave, é: 

Ao baixar as imagens convertidas, não aparece uma miniatura da imagem, como costumamos ver e sim a logo do Chrome (meu navegador), com o nome que demos para a imagem. 

Outra coisa é que em 9 anos de lançamento, a maioria dos editores de imagem como Photoscape, Gimp, Photofiltre, etc não abrem imagens webp. Devido a este atraso de evolução, infelizmente, para quem utiliza esses editores, obviamente, tem que editar a imagens antes de convertê-la.

Quero saber mais!

Felizmente, sempre estou verificando o blog Quero Dicas no PageSpeed e por tentar sempre corrigir os erros, acabei descobrindo sobre esse novo formatos de última geração. Para saber mais, acesse essa pagina do Google: Servir imagens em formatos de nova geração ou Um novo formato de imagem para a Web.


Gostou? Já está utilizando Webp em seu blog? 
Deixe seu comentário!
Beijinhos



Compartilhe

* Você reservou um tempinho para comentar? *

Desde já agradeço!

Mas, devido a falta de tempo, não prometo responder a todos os comentários.

Mais, farei o possível, ok? Beijinhos!


Nenhum comentário:

Postar um comentário

subir