Redimensionar imagens

Dimensões ou porcentagem

Por dimensões mira um tamanho exato em pixels. Preencha só a largura e a altura é calculada — que é o que você quer quase sempre, porque garante as proporções. Preencha as duas e cada imagem é ajustada para caber dentro da caixa, então um lote misto de retratos e paisagens sai todo dentro do espaço permitido. Por porcentagem reduz cada imagem em relação ao próprio tamanho — use quando as fotos são diferentes entre si e você quer todas na mesma proporção de redução.

Que tamanho as imagens deveriam ter?

A regra que cobre a maioria dos casos: o espaço que a imagem ocupa, dobrado para telas de alta densidade.

• Imagens de post ou artigo — 1200 a 1600 pixels de largura.
• Banners de largura cheia — 1920 é suficiente.
• Miniaturas e avatares — 300 a 600 pixels.
• Anexos de e-mail — 1600 mantém nitidez num arquivo que dá para enviar.

Acima de uns 2400 pixels de largura, você quase sempre está despachando bytes que ninguém vê: o navegador baixa todos e joga o excedente fora, por conta do seu visitante.

Redimensionar é o jeito mais eficaz de encolher um arquivo

O tamanho do arquivo escala com a contagem de pixels, e ela escala com o quadrado das dimensões. Reduzir largura e altura à metade elimina três quartos dos pixels — economia maior do que qualquer controle de qualidade entrega sem dano visível. O melhor resultado vem de fazer as duas coisas em ordem: redimensionar para cerca do dobro do tamanho de exibição, e depois comprimir. Uma foto de celular de 5 MB vira rotineiramente 150 KB assim, sem perda que se veja.

Ampliar não cria detalhe

Aumentar além de 100% não recupera informação que nunca foi capturada. O navegador interpola — inventa pixels intermediários pela média dos vizinhos — e o resultado sai macio em vez de nítido. Até uns 150% é tolerável para imagem de fundo; além disso, fica óbvio. Se você precisa de uma versão maior, a resposta é sempre achar o arquivo original, nunca ampliar uma cópia pequena.

Proporção, e quando quebrá-la

Com a proporção travada, nada é distorcido. Destravar força as duas dimensões exatas, esticando ou achatando a imagem — ocasionalmente útil para textura ou fundo, quase nunca certo para foto de pessoa. Se o que você precisa é um quadrado exato a partir de um retângulo, o que você quer é cortar, não redimensionar.

Por que existe um tamanho máximo

Navegadores limitam a área de desenho, e o limite é bem menor no celular do que no computador. Peça mais e o navegador devolve uma imagem em branco, sem erro nenhum. Em vez de deixar isso acontecer, a ferramenta limita a saída ao maior tamanho que o aparelho aguenta com segurança e avisa quando o fez — uma imagem real, um pouco menor que o pedido, em vez de um vazio misterioso.