Quando pensamos em proporcionar uma melhor experiência para os usuários, ou mesmo em conseguir um melhor posicionamento nos resultados de buscas do Google, não há dúvidas: ter um site bem estruturado é um fator de extrema importância. E, dentro disso, o tempo de carregamento das páginas é um dos aspectos que pode se tornar essencial para o sucesso do seu site – e, por que não, da sua empresa!

Isso quer dizer, em resumo, que não basta apenas ter um site bonitinho e com um layout que agrade seu público. Se as suas páginas demorarem muito para carregar, o usuário vai perder o interesse no seu conteúdo e isso pode prejudicar o seu negócio em muitos aspectos.

Foi pensando nisso que nós fizemos esse vídeo explicando melhor como funciona o Tempo de Carregamento e demos algumas dicas de práticas que ajudam a melhorá-lo. Gostou do assunto? Então fique a vontade: você pode clicar para assistir no player acima ou então conferir abaixo a transcrição do que foi dito no nosso vídeo! 🙂


Opa, tudo bonzinho? Hoje nós vamos falar de algo bastante importante para SEO e também para a experiência do usuário: o tempo de carregamento das páginas. A gente vai dar algumas dicas de como melhorar a performance do seu site e também algumas ferramentas que podem ajudar nesse trabalho. Confira!

Quanto tempo seu site demora para carregar?

Para começar, precisamos falar da importância de ter um site que carregue rápido. Não só para SEO, mas também para experiência do usuário.

O tempo de carregamento é essencial pois é um dos fatores de rankeamento do Google. Principalmente se tratando de mobile, que vem crescendo muito nos últimos anos. E você precisa se preocupar com isso, porque quem está acessando o celular não quer ficar carregando muito uma coisa inútil!

Como o tempo de carregamento do celular é muito lento, isso porque a conexão de internet no Brasil, principalmente, ainda é muito ruim, você precisa dar muita importância para a otimização do seu carregamento. Site que demora muito, o Google interpreta que ele causa uma má experiência para o usuário.

E não é só o Google que deve se preocupar com isso. Quando pensamos na usabilidade do site (que faz uma grande diferença nos acessos quando nos referimos a um e-commerce ou até mesmo um blog), pode acontecer a perda de um usuário muitas vezes porque o tempo de carregamento é muito grande.

Então, aqui vão as nossas dicas para melhorar o tempo de carregamento da sua página:

1 – Repense o tamanho das imagens

A nossa primeira dica é sobre as imagens usadas no site. A problemática é a seguinte: para e-commerce, a foto de qualidade faz diferença na hora do cliente olhar e entender o produto, conseguir ver detalhes e tudo mais. Mas, o que acontece é que muitas vezes as fotos de qualidade são grandes, muito pesadas e demoram para carregar. Nesse caso, o ideal é ponderar entre a qualidade e rapidez: não atrase o carregamento de uma página por causa de uma foto. O tamanho da imagem e o “peso” dela precisam reduzir ao máximo sem perder muitos detalhes.

Existe uma funcionalidade no Photoshop que é salvar para web, ou save for web. Ela ajuda a diminuir o peso das imagens sem prejudicar muito a qualidade, tanto que a gente quase nem percebe a diferença. Então, esse é um dos recursos que você pode usar para que uma foto não atrase o carregamento da página.

Opção de Salvar para a Web no Photoshop

Outra dica importante para quem tem e-commerce é sobre a funcionalidade do zoom: para ver as imagens com um pouco mais de detalhe, só carregue aquela foto em tamanho maior quando o usuário fizer alguma ação. Ou seja, quando ele aproximar o mouse para ver detalhes do produto ou, inclusive, clicar na imagem para ver mais sobre ela. Evite fazer um pré-load dela.

Uma outra dica importante, também, é economizar as imagens quando for preciso. Então, tudo que puder ser escrito em texto normal, escreva. Isso é bom não só para SEO, mas também porque economizando imagens você vai ter uma página mais rápida.

2 – Invista em um servidor de qualidade

Outro fator muito importante é o servidor. É indispensável investir em um servidor de qualidade, que seja rápido, com bastante memória e, principalmente, que tenha um bom processador. Isso vai influenciar muito no tempo de resposta do servidor.

Um fator que influencia nesse tempo de resposta do servidor é a chamada vizinhança, que são os outros sites que também estão hospedados no mesmo servidor que o seu. Quando se contrata essas hospedagens que são compartilhadas, você acaba dividindo seu espaço com outros sites que, muitas vezes, podem exigir demais do servidor e tornar ele mais lento.

Por isso que muitas vezes se fala que dividir a hospedagem com sites de pornografia, ou conteúdo ilegal, prejudica no SEO. Eles podem prejudicar, sim, porque normalmente esse tipo de site tem uma grande demanda por tráfego. Imagine um site que hospeda conteúdo de pirataria: o cara está fazendo download de arquivos gigantes! E um site de conteúdo pornográfico, por exemplo, geralmente tem muitos vídeos e isso gera uma grande demanda de servidor. É por isso que eles podem prejudicar quando hospedados no mesmo servidor que o seu.

3 – Diminua a latência do seu servidor

O local onde o servidor está também têm uma certa influência no tempo de carregamento, por causa da latência. Imagine que você tem foco no usuário brasileiro, sendo que o seu servidor está instalado nos EUA, por exemplo. Esse tempo entre o usuário acessar o site e ele ser respondido muito longe daqui se chama latência. É o tempo que vai levar até esse endereço se resolver e voltar para o usuário.

Isso tem influência no tempo de carregamento, então, prefira hospedagens que sejam o mais próximas possível do seu público-alvo. Se ele está aqui no Brasil, prefira hospedagens brasileiras. Se ele estiver fora do Brasil, como na Europa, por exemplo, prefira hospedagens que são de lá.

4 – Revise o javascript e CSS do seu site

A nossa quarta dica é revisar os JavaScripts e os CSS de cada página do seu site. Muitas vezes eles podem estar dentro da página, o que não é bom, e mesmo os arquivos externos, às vezes, podem demorar para responder. Então, o melhor é dar uma olhada em que local esse arquivo externo está alocado.

Também acontece, muitas vezes, a importação de um monte de bibliotecas e plugins, então começa a acumular um monte de lixo em nossas páginas, como muitos JavaScripts e CSS que não são utilizados pra nada.

  • Por exemplo: quando a gente instala um plugin no WordPress e depois desinstala, esses CSS acabam ficando, ainda, dentro do nosso site, sendo carregados em todas as páginas, o que é desnecessário e atrasa o carregamento das páginas.
  • Outro exemplo disso são sites onde, na home, existe aquele banner que fica trocando as imagens automaticamente. Essa função é feita com JavaScript. Mesmo quando o usuário está em uma página interna, que não traz essa funcionalidade, o site continua incluindo aquele JavaScript. E isso é tempo de carregamento desnecessário, já que o usuário vai fazer download daquele script mas ele não vai ser usado naquela página. Então, muito cuidado com isso.

5 – Unifique seus arquivos

E para complementar a dica do JavaScript e do CSS, é importante consolidá-los no mínimo de arquivos possível. Porque, quanto mais arquivos você tiver, serão mais chamadas extras que o servidor precisará fazer.

Cada chamada dessa tem aquela latência que a gente tinha falado na dica três, onde ocorre uma consulta no servidor para receber esse arquivo. Se você tem diversos arquivos, então vai ter diversas chamadas e isso pode demorar. Então, consolide! Junte o máximo que for possível e coloque tudo no mesmo arquivo.

Também existem ferramentas que comprimem esses arquivos e tiram todos os espaços que, na verdade, não servem para nada. Por exemplo, o JavaScript, se estiver em uma linha só, consegue executar normalmente uma função. Então, se você conseguir reduzir esse espaço, já consegue diminuir o tamanho do arquivo, o que vai melhorar o tempo de carregamento dele.

E essa dica também serve pra quem for fazer download de uma biblioteca, como o JQuery, por exemplo. Quando você for baixar o JQuery, existe a possibilidade de fazer o download completo ou do arquivo já compactado, eliminando esses espaços e linhas em branco.

Isso vale também para o HTML. Os comentários, por exemplo, são trechos de códigos que não servem para nada e só vão aumentar o tamanho do arquivo e o tempo de carregamento. Então, quando tiver alguma funcionalidade no seu site e você quiser remover ela de lá, não coloque comentários e, sim, apague aquele trecho de HTML do arquivo.

6 – Habilite o cache do navegador

A nossa dica número seis é habilitar o cache do navegador. Mas o que é cache? Muitas vezes, quando o site é programado em PHP, ASP ou alguma outra linguagem de programação, ele depende de um processamento para conseguir desenvolver o HTML final que vai ser visto pelo usuário. Quando o cache é habilitado, ele já vai salvar em HTML, formato que vai ser entregue, algumas coisas pré-processadas. Isso vai deixar o tempo de carregamento mais rápido.

  • No vídeo sobre WordPress, que a gente deu algumas dicas, falamos sobre plugins que habilitam o cache. E se quiser assistir esse vídeo, clica aqui para ver as dicas.

Mas como habilitar o cache envolve um processo um pouco mais técnico, para quem usa o WordPress, a dica é usar plugins prontos, já que é mais fácil e mais amigável. Quem trabalha com outras plataformas vai precisar da ajuda de um programador para ver como isso pode ser feito, ou até verificar se existe uma outra funcionalidade da própria plataforma que ajude, também, a habilitar o cache.

Ferramentas que otimizam o tempo de carregamento

Existem algumas ferramentas que podem nos ajudar a otimizar o tempo de carregamento de uma página, então, segue aí algumas dicas:

PageSpeed

Uma ferramenta muito legal é o PageSpeed, do Google, que dá várias dicas de como melhorar a performance de um site. Essa ferramenta gera uma nota para página que for testada, tanto pra mobile quanto para desktop. Além disso, você vai ter algumas dicas e instruções do que pode ser feito para melhorar seu tempo de carregamento.

Otimizar o tempo de carregamento com Google PageSpeed

O PageSpeed é como uma análise e, inclusive, pode ser usado como um relatório que você pode passar para seu programador e facilitar a vida dele. O Pagespeed pode ser usado através de um plugin, instalado no navegador do Google Chrome, ou também diretamente pelo site.

Pingdom Tools

Outra ferramenta muito legal é o Pingdom Tools, que também é online e basta colocar o endereço do seu site para ela mostrar todos os arquivos que estão sendo carregados naquela página e indicar o tempo individual do carregamento de cada uma delas e o peso desses arquivos.

Melhorar tempo de carregamento com Pingdom Tools

E isso possibilita fazer uma análise um pouco mais criteriosa: muitas vezes um site está demorando para carregar porque tem um arquivo, por exemplo Java Script, que está grande ou porque ele está no servidor externo. Com essa ferramenta, você vai conseguir identificar esse tipo de problema, o tempo de chamada do servidor, o tempo de resposta do arquivo, o tempo de transferência do arquivo, se teve que resolver o DNS (que tem a ver com o servidor estar muito longe) e mais detalhes.

OBS: no vídeo também demos a dica de usar o Firebug, uma ferramenta que dava um relatório sobre o tempo de carregamento das páginas e ainda ajudava a identificar problemas de HTML. Mas essa ferramenta foi descontinuada, como você pode ver no seu site oficial.

E será que existe um tempo de carregamento ideal?

O tempo de carregamento ideal é algo bem subjetivo. Dependendo do tipo da página, ela pode ter um tempo de carregamento mais rápido ou não. É muito difícil a gente comparar, por exemplo, o tempo de carregamento de uma landing page com uma página de e-commerce, pois são objetivos totalmente diferentes.

Uma landing page geralmente é enxuta, com pouca informação, ou muitas vezes a informação está dentro do próprio HTML e não tem nada em banco de dados, o que não demanda processamento e faz a página carregar muito mais rápido. Enquanto um e-commerce tem centenas de informações que estão totalmente no banco de dados, como as imagens, descrições dos produtos, preços, informações de frete, itens de menu e muitas outras informações. Logicamente que uma página de e-commerce vai demorar muito mais tempo pra carregar.

Segundo a ferramenta do Google, o tempo ideal seria de um 1,5 segundos, mas isso é praticamente impossível e a gente não vê quase que nenhum site carregando nesse tempo. É muito importante comparar o seu site com os outros, principalmente aqueles que já estão aparecendo bem posicionados ou que são muito semelhantes ao seu segmento.

  • Por exemplo: quanto tempo leva o site do Submarino pra carregar? Em torno de 10 segundos. Se você tem um e-commerce semelhante ao do Submarino, então tem que se preocupar em fazer suas páginas carregarem em até 10 segundos.
  • Outro exemplo é se você tem uma landing page e ela está demorando mais de 3 ou 4 segundos para carregar, por exemplo, isso já é preocupante. Por quê? Porque outras páginas semelhantes a ela carregam em torno de 2 segundos.

Então, não existe um tempo de carregamento ideal. O melhor é comparar o seu tempo de carregamento com outros sites semelhantes.


Assine o canal da Mateada no YouTube:

Essas foram as nossas dicas para melhorar a performance do seu site. Esperamos ter te ajudado e esclarecido algumas dúvidas! Se você quer saber mais sobre como alcançar bons resultados com seu site, indicamos o conteúdo sobre 8 métricas que você não pode deixar de acompanhar, onde falamos sobre os dados mais importantes de analisar no seu site. Até o próximo post! 🙂