Converta JPG para WebP para a biblioteca de imagens do seu site

Mantenha seu JPEG ou projeto de edição original como o mestre e crie uma cópia do WebP para entrega. Isso permite que você crie tamanhos diferentes posteriormente sem compactar repetidamente uma exportação já compactada. Use nomes de arquivo claros que identifiquem o assunto e o posicionamento pretendido, em vez de substituir cada fotografia em seu arquivo por um novo formato.

O WebP é uma opção para fotografias do site, mas seu sistema de gerenciamento de conteúdo deve aceitar o upload e servir a saída corretamente. Verifique esse fluxo de trabalho com um arquivo antes de converter uma biblioteca inteira. Alguns sistemas geram suas próprias alternativas ou redimensionam as imagens enviadas automaticamente. Se o seu fizer isso, compare o arquivo entregue aos visitantes, pois um arquivo otimizado localmente pode ser processado novamente após o upload.

A predefinição inicial mantém as dimensões originais com qualidade de 90%. Isso lhe dá uma comparação de formato simples. Para um arquivo de entrega de um site, mude para caber dentro assim que souber a maior largura de exibição necessária no layout. Uma imagem de resolução completa da câmera geralmente é desnecessária para um cartão, mas um banner grande pode precisar de um candidato maior.

Faça exportações separadas para funções de exibição diferentes em vez de forçar uma pequena imagem a preencher cada espaço. Uma miniatura, uma imagem de artigo e uma visualização de produto grande servem a propósitos diferentes. Os Resizer Retina Image Explica como escolher candidatos ilustrativos de alta densidade sem presumir que todos os dispositivos precisam do mesmo arquivo. Evite ampliar uma pequena fonte para atender a um grande número de exportação; O alargamento não pode criar os detalhes que faltam.

Escolha uma área difícil ao comparar o WebP com o JPEG: cabelo, galhos de árvores, tecido fino, céu liso ou parede escura. Verifique o tamanho pretendido da tela e uma visão fechada. Uma configuração que fica bem em um fundo desfocado pode ser muito agressiva para uma foto de produto texturizada. O número da qualidade é um controle do codificador, não uma pontuação visual universal.

Se o WebP for maior que a fonte, mantenha o arquivo melhor para seus requisitos reais ou tente uma configuração de qualidade inferior com cuidado. Não assuma que uma extensão mais recente vence todas as comparações. Esta ferramenta cria um WebP codificado em navegador; Ele não oferece um modo separado de WebP sem perdas, um painel de ajuste de codecs personalizado ou uma garantia sobre a economia de uma imagem individual.

Após o download, coloque o arquivo na página real e confirme o corte, o texto alternativo e as dimensões exibidas. Uma imagem com menos bytes ainda pode carregar com atraso se a página solicitar com atraso. Reserve seu espaço de layout, escolha fontes responsivas adequadas e evite o carregamento preguiçoso de uma imagem necessária imediatamente na parte superior da página. Essas são decisões de implementação do site além da conversão.

Verifique o layout do telefone, bem como um monitor grande. Se a mesma imagem se tornar uma faixa irreconhecível na área recortada do telefone, faça uma composição diferente em vez de aumentar a qualidade JPEG ou WebP. Processe as fotos relacionadas ao mesmo tempo depois que a primeira página funcionar. A conversão permanece no seu dispositivo e os arquivos originais permanecem disponíveis para uma exportação diferente.

Por exemplo, compare a paisagem frondosa de um artigo com seu retrato de estúdio simples. Eles podem precisar de configurações de qualidade diferentes, mesmo com a mesma largura. Mantenha uma nota das dimensões e dos bytes medidos ao lado de cada candidato para que a decisão permaneça vinculada a um arquivo real.