Otimização de imagens para web com o Smush.it

Otimizar imagens para web já foi uma atividade mais trabalhosa. Desenhar sites na época das conexões dial-up exigia mais esforço dos designers para não deixar o site pesado. Apesar de não estarmos mais naquela época otimizar imagens ainda é uma valiosa boa prática. Uma razão para se preocupar com o tamanho delas no seu projeto hoje é o fato do Google considerar o tempo de carregamento do site como uma das variáveis do Pagerank. Ou seja, quanto mais rápido e mais leve for seu site, mais score você ganha no SEO.

O Smush.it é um otimizador de imagens desenvolvido pelo Yahoo! que remove bytes desnecessários e que não afetam a aparência ou a qualidade da imagem. Ele otimiza PNG, GIF e JPG. As imagens são submetidas a vários algoritmos para terem seus tamanhos reduzidos.

Funciona assim: você faz o upload de todas suas imagens para o Smushi.it — ele aceita múltiplos uploads — e ele te devolver um arquivo compactado em .zip com todas suas imagens otimizadas. Para cada imagem que você subir ele te informa o tamanho original e o tamanho final depois da otimização, além de exibir os ganhos totais ao submeter várias imagens juntas. Uma observação importante é que ao subir as imagens em GIF elas serão automaticamente convertidas para PNG quanto a conversão for responsável por gerar uma imagem de tamanho físico menor do que o GIF.

A otimização de imagens no meu fluxo de trabalho com o Smush.it é a última coisa a ser feita, no final do projeto e antes de publicar o site. Não precisa se preocupar com isso antes. Legal né?

17 Responses to “Otimização de imagens para web com o Smush.it”

  1. Legal. Eu já tinha ouvido falar do Smush.it, mas nunca me usei, creio que por falta de um conhecimento maior de como ele funciona. Vou usar ele assim que chegar nos meus próximos The Ends e ver o ganho dele. :)

  2. Junio Vitorino

    Bastante útil a dica, não conhecia e a partir de hoje vou usar certamente.

  3. Interessante a dica. Até o momento faço a otimização das imagens na mão mesmo.

    Vou testar a dica.

    Abraços.

  4. Excelente dica! Como sempre o Henrique nos mostrando ótimas dicas

  5. Thiago

    Está ai se for otimizar lembre-se Revolução + Yahoo

    Muito Show Revolução

  6. Não gostei no momento em que ele muda a extensão do meu arquivo para PNG. Ainda somos mercê do IE6 e não gostaria de ter que usar recursos para que ele interprete a transparência do meu "PNG" sem deixar um fundo cinza horroroso. Se escolhi usar GIF, que assim seja. Mudar a extensão eu faço, e com o photoshop posso otimizar tal como o smush.

  7. Loja Virtual dos Blo

    muito boa a dica

  8. Rodrigo Ribeiro

    muito maneiro…nao sabia q isso era possivel ainda mais online

    vlw pela dico abç

  9. Luan Ramos @LuanAPik

    Muito bom Smush.it uso ele direto ajuda bastante, deixando meu site mais leve, assim contribuindo com Seo =/

    @LuanAPiki

  10. Não sabia sobre este critério para avaliação de pagerank. Outra dica interessante para otimizar o tempo de carregamento do site, é não utilizar plugins para WordPress que desempenham a mesma função ou funções muito semelhantes. O gerente do site deverá escolher qual plugin melhor atende à sua demanda, desativando e excluindo aqueles que só fazem repetir processos, podendo colidir entre si, pesando a página.

  11. Muito bom, Henrique! Uso e recomendo muito o Smush.it. As imagens são usadas em larga escala na web e saber como deixa-las mais leves é muito importante. A Google, pensando sobre o peso das imagens para a web, criou o formato WebP. Segundo a Google, este formato é totalmente aberto e promete uma ótima redução no tamanho final das imagens. Para mais informações, visite http://code.google.com/intl/pt-BR/speed/webp/

    Abraço a todos.

  12. Rodrigo Ribeiro

    muito boa dica …vou usar abraço

Leave a Reply

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>