Como reduzir o tamanho do JPEG e outros arquivos de imagem (gratuitamente!)

por | 18 maio, 21 | Design

Reduzir o tamanho das imagens pode ajudar seu site ou blog a carregar mais rápido – fator importante para a experiência de usuário.

As imagens que você usa em seu site são um dos elementos mais importantes. Você não só quer ter imagens visualmente atraentes, mas também não quer que essas imagens sejam tão grandes que reduzam o tempo de carregamento para o seu site. Uma das principais razões para um site ficar defasado é porque as imagens incluídas nele não foram redimensionadas para o desempenho ideal do site. Por isso, reduzir o tamanho da imagem é algo importante para seu site.

Neste artigo, exploraremos métodos manuais para reduzir o tamanho da imagem no Photoshop, incluindo alterar o tipo de arquivo, redimensionar e comprimir arquivos usando a função Salvar para Web. Para aqueles que procuram algo mais automatizado, também veremos alguns plugins e opções baseadas na Web.

Alterando o tipo de arquivo para reduzir o tamanho da imagem

O “tamanho do arquivo” para um arquivo de imagem refere-se ao número de pixels por polegada. Geralmente, quanto mais pixels por polegada, mais informações o arquivo contém, assim, maior o seu tamanho.

Os dois tipos de arquivos mais comuns para imagens são JPG e PNG.

  • PNG – Portable Network Graphics – Este tipo de arquivo é usado principalmente para arquivos gráficos como logos, ícones, ilustrações e texto. Quando editados em um aplicativo de edição de fotos como o Photoshop, esses arquivos não perdem muitos dados quando você os manipula ou comprime. Eles são chamados de “lossless” por essa razão. Esses arquivos tendem a ser maiores em tamanho por esse motivo.
  • JPEG – Joint Photographic Experts GroupEste é o tipo de arquivo mais comum que você encontrará para a maioria das imagens na internet. Este tipo de arquivo pode gerenciar milhões de cores, pode ser altamente comprimido, preservando a qualidade. Estes são chamados de “lossy” porque o processo de comprimi-los remove pixels da imagem.

Qualquer tipo de arquivo pode funcionar. Qual você escolhe realmente depende do seu site, do número e do tipo de fotos que você escolher usar.

Aqui está uma foto de exemplo. Seu formato original era como um arquivo PNG.

Usei o comando Arquivo > Salvar como… no Photoshop, escolhi o formato JPG e completei a função de salvar.

Quando mudei o tipo de arquivo, o tamanho do arquivo passou de 646 MB para 1,3 MB. Como observado acima, os arquivos PNG são tipicamente maiores, então para este tipo de imagem com muitas cores e detalhes, pode ser melhor ficar com a versão JPG para garantir que carregue mais rápido. Se você sabe que sua imagem precisa ficar num tamanho maior sem perder a resolução, vá com a versão PNG.

Observe que existem muitos outros formatos de arquivo disponíveis. Eu me concentrei em JPEG e PNG porque eles são os mais populares.

Redimensionamento manual no Photoshop

No Photoshop, você pode usar a função Imagem>Tamanho de Imagem para redimensionar manualmente sua imagem. A ferramenta se parece com esta:

Você pode ver que as dimensões atuais do tamanho da imagem e dos pixels são notadas na parte superior da ferramenta. Todos os ajustes que você fizer aqui mudarão o tamanho.

Fit To é uma lista de drop-down que tem tamanhos predefinidos e configurações de pixels.

Se eu escolher a primeira opção nessa lista para ajustar as dimensões e pixels por polegada (ou PPI) posso ver como o tamanho do arquivo vai mudar.

Você pode experimentar essas configurações para determinar se o tamanho padrão via drop-down funcionará ou se você precisa alterar manualmente as opções de largura, altura ou resolução para obter o tamanho necessário.

Salvar para função Web

Salvar para Web é diferente do Salvar como…, pois a opção web remove metadados (detalhes sobre o tipo e a origem da imagem) do arquivo antes de salvar. Esta função é especificamente destinada a imagens que serão exibidas na internet, por isso pode ser uma maneira muito rápida de redimensionar mantendo a qualidade.

Encontre a opção Salvar para Web navegando para Arquivo>Exportar> Salvar para Web:

Quando a janela Salvar para Web for aberta, você notará outro benefício desta função. Se você selecionar a guia na parte superior, você pode ver uma comparação da imagem original lado a lado com a imagem alterada.

A partir daqui, use as predefinições no canto superior direito para escolher o formato JPG e ajustar a qualidade como desejar. Depois de fazer as alterações, você pode ver se seu novo arquivo está ou não dentro de seus padrões de qualidade através da visualização de imagem, e você pode validar a alteração no tamanho do arquivo olhando para os dados em cada imagem:

Observe que você também pode alterar o tamanho usando os campos de largura e altura no canto inferior direito. Como este artigo está especificamente olhando para a redimensionamento, não estamos cobrindo as outras opções mostradas na tela Salvar para Web, mas você pode ler aqui para obter informações mais detalhadas.

Ferramentas de otimização de imagem do WordPress

Photoshop é uma ótima opção se você gosta de mudar as opções para reduzir o tamanho do arquivo de imagem você mesmo. Se você está procurando algo mais automatizado para ajudar no redimensionamento de suas imagens, há um bom número de opções de plugins do WordPress que podem ajudar. Aqui está uma lista de algumas opções populares e uma breve descrição de seus benefícios:

Imagify – Otimize todas as suas imagens de uma só vez, redimensione com facilidade e restaure as fotos às suas versões originais quando necessário. É acessível também. Este plugin é gratuito para download e inclui 20 MB de espaço de arquivo. Outras opções são $5 por mês para 500MB e $10 por mês para espaço ilimitado.

ShortPixel – Nenhum limite de tamanho de arquivo e uma chave de API para vários sites permitem uma grande utilização deste plugin. Eles também oferecem planos únicos e mensais para flexibilidade orçamentária.

Optimole – Para os dados orientados, a Optimole oferece um painel onde você pode rever estatísticas de otimização. Seu plano gratuito permite 5.000 visitantes por mês e banda ilimitada.

Para uma comparação mais completa dessas opções e de um punhado de outras, consulte este artigo.

Recursos da Web para reduzir o tamanho da imagem

Se você está com problema de tempo e/ou dinheiro, há muitas ferramentas gratuitas e online para mudar o tamanho de imagens.

O Compressjpg permite que você carregue vários arquivos e redimensione todos eles de uma só vez. Ele também tem um recurso que converterá fotos do formato HEIC do iPhone para JPEG. Outros sites semelhantes são  Tinypng,  bem como Image Compressor.

O Canva Pro é outro site popular que não só redimensiona, mas também permite projetar e animar imagens, bem como formatá-las para uso na web ou nas mídias sociais. Seu layout é intuitivo e fácil de usar.

Concluindo

Não subestime a importância de otimizar suas imagens. Sites lentos não só espantam os espectadores, como também não têm tração na pesquisa do Google.  Imagens nítidas e que carregam rápido podem fornecer algo extra que diferencia seu site do resto. Um site otimizado fará com que os visitantes voltem mais vezes.

Você está usando algum desses métodos para redimensionar suas imagens? Se não, qual você acha que vai tentar primeiro? Conte para a gente nos comentários!

Imagem em destaque via Prihanto Edi / shutterstock.com

Artigo original:  Amber Fogel

Tradução e adaptação:

0 comentários

Enviar um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Tem muito mais

Novos produtos, novidades da Divi e seus parceiros em português para você.

E-book - Como se tornar um profissional de sucesso com Divi

Uma jornada de aprendizado para aprender a construir sites até se tornar um web designer de sucesso.

Já possui a licença do Divi?

Você receberá em seu e-mail o acesso ao e-book. Esperamos que possa ajudar a alavancar sua carreira de web designer.