Paul Stamatiou é de Houston, Texas e está estudando Mídia Computacional na Georgia Institute of Technology em Atlanta (EUA). Atualmente está participando no projeto skribit.com que surgiu de uma ideia durante a conferência "Startup Weekend" em Atlanta. Paul mantém o seu próprio blog no site paulstamatiou.com.
Veja todos os artigos de Paul StamatiouDe todos os blogs que eu já vi na web, estou sempre vendo aqueles blogs, que, enquanto se parecem muito legais, são lentos e extremamente sobrecarregados.
Nos últimos meses eu me tornei em um tipo de especialista para otimização de sites, reduzindo o homepage do meu próprio site de mais de 250 kB para um tamanho atual de 34 kB.
Eu vou ajudá-lo a conseguir fazer o mesmo com seu site com algumas poderosas dicas.
A maioria daquelas dicas são coisas básicas, mas extremamente importantes. Neste artigo eu vou dar o foco mais na otimização de um site e não do servidor, já que para a otimização de um servidor existem muitas coisas para discutir, que precisam de um artigo separado.
1. Reduzir latência geral por reduzir solicitações HTTP (HTTP requests)
Toda solicitação HTTP, ou seja, carregando cada item no seu site, tem uma média de latência de 0,2 segundos. Então, se seu site está carregando 20 itens, independentemente do tipo (stylesheets, imagens ou scripts), isso já equivale a 4 segundos de latência (em conexão típica de banda larga). Se seu site contém uma área com muitas imagens, como por exemplo o rodapé, você pode reduzir o número de solicitações HTTP com Image Maps.
Mais sobre isso mais tarde. Se você está usando o tema K2 do WordPress, você também pode reduzir os HTTP requests em usar somente um stylesheet style.css.
Não Confie em Outros Sites!
Se você tem vários componentes no seu site que estão carregando itens de outros sites, eles estão diminuindo a velocidade do seu site.
Vários HTTP requests do mesmo servidor já são mais que suficiente, mas com HTTP requests de servidores diferentes a latência vai aumentar, algo que é muito crítico para o tempo de carga do seu site se um daqueles servidores está fora do ar.
Por exemplo, quando um dia o servidor para anúncios Yahoo estava agindo estranho, meu site demorou muito para carregar, porque ele estava esperando o servidor da Yahoo antes de carregar o resto do conteúdo do meu site. Por isso não estou usando mais anúncios Yahoo no meu site. Eu não confio mais em nenhum servidor e você também não deve mais confiar. A única coisa que ainda tenho carregado de um outro servidor é o contador do FeedBurner.
2. Salve suas imagens corretamente
Um grande erro as pessoas fazem é salvar imagens no Photoshop da forma regular. Photoshop tem uma função Salvar para web por um motivo - usá-la. Mas isso não é suficiente. Você deve experimentar diferentes configurações e formatos para seu arquivo. Por exemplo, eu percebi que para o cabeçalho e os rodapés do meu site os formatos PNGs ou GIFs são os formatos mais adequados. Um fator importante para o tamanho de uma imagem é o número ou a paleta de cores utilizadas na imagem. Gradientes sempre vão aumentar bastante o tamanho de uma imagem e por isso devem ser evitados. Somente mudar o formato do texto no meu cabeçalho e substituir o gradiente com um overlay de cores (ou apenas reduzir a opacidade do gradiente) economizou alguns kilobytes. Porém, se você precisa manter seu gradiente você pode experimentar com a ferramenta Websnap que remove cores semelhantes da paleta. Experimente um pouco com Photoshop, salvando sua imagem para web com várias configurações. Uma vez que você domina esta habilidade, você pode economizar muitos kilobytes em todo o site.
Além disso, se você está usando o contador do FeedBurner, você pode economizar aproximadamente 2.1kB se você usa a versão não-animada.