Como reduzir o tamanho de JPEG e outros arquivos de imagem

Publicados: 2021-01-20

As imagens que você usa em seu site são um dos elementos mais importantes. Você não quer apenas ter imagens visualmente atraentes, mas também não quer que essas imagens sejam tão grandes que diminuam o tempo de carregamento do seu site. Um dos principais motivos de atraso de um site é porque as imagens incluídas nele não foram redimensionadas para um desempenho ideal do site.

Neste artigo, exploraremos métodos manuais para reduzir o tamanho das imagens no Photoshop, incluindo alterar o tipo de arquivo, redimensionar e compactar arquivos usando a função Salvar para a Web. Se você estiver procurando por algo mais automatizado, também veremos alguns plug-ins e opções baseadas na web.

Inscreva-se no nosso canal no Youtube

Mudando o tipo de arquivo

“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, portanto, maior será seu tamanho.

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

  • PNG - Portable Network Graphics - este tipo de arquivo é usado principalmente para arquivos gráficos, como logotipos, í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 compacta. Eles são chamados de “sem perdas” por esse motivo. Esses arquivos tendem a ser maiores por esse motivo.
  • JPEG - Joint Photographic Experts Group - Este é 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 compactado, preservando a qualidade. Eles são chamados de “com perdas” porque o processo de compactação remove pixels da imagem.

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

Aqui está uma foto de amostra. Seu formato original era um arquivo JPG.

Usei o comando Arquivo> Salvar como no Photoshop e escolhi o formato PNG e concluí a função de salvar.

Quando mudei o tipo de arquivo, o tamanho do arquivo foi de 646 MB para 1,3 KB. Conforme observado acima, os arquivos PNG são geralmente maiores, portanto, para este tipo de imagem com muitas cores e detalhes, é melhor ficar com a versão JPEG para garantir tempos de carregamento mais rápidos. Se você sabe que sua imagem precisa ser escalonada sem perder a resolução, escolha 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 da imagem para redimensionar manualmente a imagem. A ferramenta é parecida com esta:

reduzindo o tamanho do arquivo no photoshop

Você pode ver o tamanho da imagem atual e as dimensões de pixel indicados na parte superior da ferramenta. Quaisquer ajustes que você fizer aqui irão alterar o tamanho.

Ajustar a é uma lista suspensa que possui tamanhos e configurações de pixel predefinidos.

redimensionar arquivos de imagem no photoshop

Se eu escolher a primeira opção dessa lista para ajustar as dimensões e pixels por pol. (Ppi), posso ver como o tamanho do arquivo mudará.

redimensionar arquivos de imagem no photoshop

Você pode experimentar essas configurações para determinar se um tamanho padrão da lista suspensa funcionará ou se você precisa alterar manualmente as opções de largura, altura ou resolução para obter o tamanho que você precisa.

Salvar para função da web

Salvar para a Web é diferente de Salvar como, pois a opção da Web remove metadados (detalhes sobre o tipo e a origem da imagem) do arquivo antes de salvar. Esta função destina-se especificamente a imagens que serão exibidas na Internet, por isso pode ser uma forma muito rápida de redimensionar enquanto mantém a qualidade.

Encontre a opção Salvar para a web navegando até Arquivo> Exportar> Salvar para a web:

redimensionar imagens no photoshop

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

redimensionar imagens no photoshop

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 o seu novo arquivo atende ou não aos seus padrões de qualidade por meio da visualização da imagem e pode validar a alteração no tamanho do arquivo observando os dados de 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 trata especificamente de redimensionamento, não estamos cobrindo as outras opções mostradas na tela Salvar para a Web, mas você pode ler aqui para obter informações mais detalhadas.

Ferramentas de otimização de imagem WordPress

O Photoshop é uma ótima opção se você gosta de girar os dials para reduzir o tamanho do arquivo de imagem. Se você está procurando por algo mais automatizado para ajudar a redimensionar suas imagens, há um bom número de opções de plug-ins 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 vez, redimensione com facilidade e restaure as fotos às suas versões originais quando necessário. Também é acessível. Este plugin é gratuito para download e inclui 20 MB de espaço de arquivo. Outras opções são $ 5 por mês para 500 MB e $ 10 por mês para espaço ilimitado.

ShortPixel - Sem limite de tamanho de arquivo e uma chave de API para vários sites permite grande utilização para este plugin. Eles também oferecem planos únicos e mensais para flexibilidade de orçamento.

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

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

Recursos da web para otimização de imagens

Se você está com problemas de tempo e / ou dinheiro, existem várias ferramentas de otimização de imagens online gratuitas.

Compressjpg permite fazer upload de vários arquivos e redimensioná-los de uma vez. Ele também possui um recurso que converte fotos no formato HEIC do iPhone para JPEG. Outros sites semelhantes são o Tinypng e o Image Compressor.

Canva Pro é outro site popular que não apenas redimensiona, mas também permite criar e animar imagens, bem como formatá-las para uso na web ou em redes sociais. Seu layout é intuitivo e fácil de usar.

Empacotando

Não subestime a importância de otimizar suas imagens. Os sites lentos não apenas desanimam os visualizadores, como também não ganham força na pesquisa do Google. Imagens nítidas de carregamento rápido podem fornecer aquele pequeno algo extra que diferencia o seu site do resto. Um site otimizado fará com que os visitantes voltem para mais.

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

Imagem em destaque via Prihanto Edi / shutterstock.com