20 Dicas para Otimizar a Velocidade do seu Site

| 14/11/2009 - 03:44 AM | Comentários (0)

Sabemos que páginas com tempo de carregamento otimizado tem impacto em SEO tanto pensando pelo lado do usuário quanto pelo lado do webcrawler. Uma página muito carregada ou muito suja de código, dificulta o trabalho dos webcrawlers e, possivelmente, te prejudica ao ter o conteúdo analisado.

Webcrawlers não vão perder tempo se esforçando para abrir seu site pois ele tem milhares de outros sites para analisar. Pensando no usuário, acontece a mesma coisa, o usuário possivelmente sairá do seu site antes mesmo de esperar ele carregar por inteiro. Assim, trago neste artigo, 20 dicas que ajudam a diminuir o tempo de carregamento de páginas de websites.

velocimetro

20 Dicas para Deixar Páginas Web Mais Leves

  1. Comprima suas imagens
    Se você usa o photoshop use sempre a opção “Save for Web”. Se você não possui, pode usar alternativas gratuitas também.
  2. Não reduza as imagens com HTML
    Nunca use HTML puro para redimensionar suas imagens. Elas serão carregadas com o tamanho original (grande) e será redimensionada no browser. Isso também deixa as imagens feias (distorcidas, mal-redimensionadas ou de resolução alterada), o tratamento do browser não é eficiente e as imagens perdem suas características.
  3. Especifique as dimensões da imagem
    Sempre especifique os tamanhos das imagens no código HTML. Isso irá reduzir o tempo de renderização da página pois o browser saberá como encaixar os elementos na tela.
  4. Imagens grandes? Corte-as
    Se você precisa carregar uma imagem muito grande no seu site, divida-as em algumas partes para agilizar o carregamento. Claro, não reduzirá o tamanho mas passará impressão de agilidade na abertura do site.
  5. Não corte demais!
    Isso poderá gerar muitas requisições HTTP e consequentemente deixará mais lento e fará o efeito contrario do esperado. É preciso saber ponderar muito bem ao dividir ou não, e em quantas partes será dividido.
  6. Use CSS ao invés de imagens
    Use CSS para criar os efeitos necessários para seu site quando possível. Obviamente, o conteúdo a ser carregado será muito menor.
  7. Não use tabelas quando não forem necessárias
    Tabelas são feitas para apresentar dados tabelados, para layout arquitetura da pagina você deve usar CSS que tem esse propósito. Isso também deixará seu código mais limpo e melhor para ser lido e entendido. Os crawlers conseguem ler sites com tabelas, mas você irá dar uma mãozinha para ele usando tableless.
  8. Use arquivos CSS externos
    Usando arquivos externos, você irá ajudar o crawler e o seu usuário, pois uma vez lido o CSS externo, ele será jogado no cache e não precisará ser recarregado a cada nova página.
  9. Use arquivos Javascript externos também
    Segue o mesmo princípio do CSS externo, principalmente para Javascript, para o qual será mais importante o cache dos arquivos.
  10. Remova os espaços em branco do seu HTML
    Lembre-se, espaço em branco também é um caracter e consome banda e espaço em disco. É muito comum deixarmos sujeiras de espaço em branco em nossos códigos, remova-os sempre.
  11. Imagens com CSS ao invés de imagens em tag HTML
    Pode parecer estranho, mas o carregamento das imagens como background de uma div é mais rápido do que carregar a imagem com as tags HTML.
  12. Uso de links relativos
    Pensando ainda na questão de tamanho dos arquivos HTML, usar caminhos relativos ajuda a remover os caracteres http://www.seusite.com.br/ cada vez que criar um link. Será uma economia significativa no código, mas é um peso para SEO, considerando quando “emprestam” seu conteúdo. Em termos de SEO, o melhor é usar o caminho absoluto.
  13. Especifique o DocType
    Páginas que tem DocType definido tendem a ser mais rápidas para serem carregadas.
  14. Reduza requisições HTTP do seu site
    Cada vez que você faz uma requisição HTTP, será necessário pedir o pacote, esperar a resposta, receber o pacote e confirmar sua chegada. Por isso, quanto menos requisições HTTP você tiver, mais rápido será o carregamento da sua página.
  15. Não use HTTPS desnecessariamente
    Somente use HTTPS quando for necessário. Esse tipo de conexão segura é pelo menos 3 vezes mais lentas que o HTTP normal.
  16. Use Gzip para reduzir o tamanho do HTML
    Uma alternativa muito válida é comprimir seu HTML para ser entregue. Isso não tem impacto para imagens, flash ou arquivos embarcados, mas para HTML faz uma grande diferença.
  17. Separe servidores de conteúdo e de banco de dados
    Se você possui um alto tráfego no seu site, criar servidores dedicados pode ajudar, e muito, na velocidade do seu site. Cada servidor será otimizado para um serviço.
  18. Use AJAX quando puder
    Usar AJAX ao invés de ficar recarregando seu site pode ser muito útil para otimizar a velocidade. Isso reduzirá o número de requisições HTTP do seu site e apresentará uma aparência de velocidade na entrega do seu conteúdo.
  19. Coloque imagens indicando carregamento
    É importante também, ao se utilizar AJAX ou Javascript, colocar imagens que indiquem que o conteúdo está sendo carregado. Isso não melhora o desempenho real, mas passa mais conforto para o usuário que está utilizando seu site saber que está sendo processado o pedido.
  20. Reduza o número de cookies
    Cada vez que um browser faz uma requisição, cookies são transmitidos. Isso quer dizer que se você não tomar cuidado, pode sobrecarregar a página com cookies. Atente-se também para o tamanho de cada cookie transmitido.

Essas foram 20 dicas rápidas para otimizar a velocidade do seu site. Não foi especificado exatamente como fazer algumas dicas dessas acima, mas caso tenha dúvidas, poste em nosso fórum e debata sobre o assunto. Afinal, o debate é o que realmente gera conhecimento, concordam?

Tags: , ,

Categoria: Tutoriais

Sobre E-Commerce News: Fundado no ano de 2009, o E-Commerce News é um site projetado para profissionais de todas as áreas, interessados nos mais recentes conteúdos sobre o e-commerce no Brasil e no mundo. Ver mais artigos deste autor.

  • Todos Fornecedores
  • Plataformas
    • Gestão de Anúncios
    • Atendimento ao Cliente
    • E-Mail Marketing
    • Sistema de ERP
    • Pagamento Online
    • Plataforma de E-Commerce
    • Precificação Dinâmica
  • Serviços
    • Escola Espelicializada
    • Agência Especializada
 
 

Comente esta Matéria




Para incluir uma imagem ao lado do seu comentário, registre-se em Gravatar.