Quem de nós, usuários de internet, gosta de ficar esperando muito tempo um site carregar? Na realidade, ninguém gosta. A instantaneidade das informações nos dias de hoje, além da grande oferta de conteúdo, nos faz pegar aversão a sites e páginas que demoram a carregar, nos convidando para apertar o botão de fechar quando não recebemos alguma resposta de interação da página em 3 segundos (ou menos). Funciona dessa forma para nós, funciona dessa forma para o Google. Hoje em dia os robôs do Google estão cada vez mais preocupados em oferecer um conteúdo mais assertivo para seus usuários. E uma das métricas levadas em consideração para eleger os sites e páginas que devem ter prioridade e ocupar as primeiras posições das páginas de resultados de pesquisas é o tempo de carregamento. 

Este post vai mostrar, de forma rápida, alguns pontos e dicas que podem ajudar na hora de otimizar a sua página, fazendo com que ela tenha um tempo de resposta baixo, agradando o seu usuário e também o Google.

Um primeiro ponto que devemos nos atentar é relacionado ao carregamento mobile. 

Tenha um site otimizado para dispositivos móveis. Atualmente, um grande número de acessos a um site é realizado por dispositivos móveis. Além disso, Devemos pensar que mesmo com a grande oferta de WI-FI muitas navegações e troca de conteúdo são realizadas através de uma operadora telefônica, com uma cobertura que na maioria das vezes, pode ser 4G, mas nem sempre. Então, pensar em um site otimizado é levar em consideração o número de acessos via mobile, além de pensar que esses acessos podem ser realizados fora da WI-FI. Se você ainda não está atento a isso, mude seu pensamento rapidamente, pois o Google já está fazendo isso há um bom tempo. Em 2019, o Google passou a olhar os dispositivos móveis como principal forma de navegação e estão passando a dar mais prioridade para sites que são otimizados e respondem de uma forma bastante satisfatória durante um acesso via mobile.

Sabendo desse fato como podemos otimizar o nosso site para que ele tenha um bom tempo de resposta?

1- Cuidado com o tamanho das imagens (Clichê, mas vale a pena falar). Imagens tornam a navegação mais dinâmica para o usuário e enriquecem o seu conteúdo, além de conseguir transmitir o que muitas vezes apenas textos não conseguem. Porém, imagens gastam mais tempo para serem carregadas e exibidas para o usuário. Dessa forma, sempre utilize imagens otimizadas, ou seja, imagens de boa qualidade, porém pequenas, diminuindo o tempo de carregamento e proporcionando uma melhor experiência com o usuário. Hoje em dia, existem muitas formas de otimizar uma imagem, utilize algum serviço gratuito na internet para realizar essa ação ou então use um software que seja capaz de salvar uma imagem com um espaço menor em disco, sem perder qualidade. O Google recomenda o uso de um formato de imagem chamado webp. Esse padrão foi criado pelo próprio Google e possui uma grande otimização das imagens, porém em alguns browsers, esse formato de imagem não é reconhecido e consequentemente não é “renderizado”. Como um complemento para essa parte de imagens, faça uso de estratégias ou ferramentas que possibilitam um carregamento “atrasado” das imagens, ou seja, a técnica do lazy load. Carregue as imagens à medida que o seu usuário vai demandando o seu carregamento. 

2- CDN para imagens. Outro ponto importante e poderoso é fazer uso de CND para imagens. CDN significa Content Delivery Network, ou seja, é uma rede de computadores espalhados por todo o mundo que tem a capacidade de armazenar conteúdos dos sites. A CDN tem a capacidade de enviar para um usuário o conteúdo de um site que ele está acessando de forma mais rápida, promovendo um menor gasto de tempo na hora de carregar um determinado conteúdo. Como a rede de CDN está espalhada pelo mundo todo, ela tem a capacidade de se mostrar mais eficiente ao atender usuários de diversos lugares.

3- De prioridade para o carregamento do primeiro conteúdo que o usuário irá ver. Imagine a altura da tela do browser de um computador ou de um dispositivo móvel. Agora, imagine todo o conteúdo que pode ser exibido nesse espaço. Neste espaço está todo o conteúdo que aparecerá para o usuário assim que sua página carregar, antes de qualquer rolagem. Otimize sempre o aparecimento desse conteúdo, use técnicas para carregar o restante da página após o carregamento desse trecho de conteúdo. Isso fará com que seu usuário tenha uma boa experiência ao visualizar o seu site ou página. Além de seu usuário, o Google também está de olho para essa métrica e a usa para ranquear as posições de seu site em um resultado de pesquisa.

4- JavaScript e CSS minificados e, sempre que puder, unidos em um único arquivo. Minificar seus arquivos de JavaScript e CSS também é uma boa estratégia para diminuir o tempo para sua página ser carregada. Minificar estes arquivos podem reduzir razoavelmente o tamanho deles, além disso se pudermos condensar todo o conteúdo de CSS em uma menor quantidade de arquivos também é uma boa prática, assim como o de JavaScript. Fazendo uso desta segunda técnica estamos reduzindo o número de chamadas ao servidor responsável por entregar esses arquivos. Ou seja, de uma maneira prática, ao invés de usar 10 arquivos CSS (que carregam o estilo de seu site) e ter que realizar 10 chamadas ao servidor para trazê-los, use 1 único arquivo e faça apenas uma chamada para trazer esse conteúdo.

5- CSS carregado depois. Outra boa estratégia é carregar o seu arquivo de estilo no final do carregamento da página. Isso fará com que o conteúdo apareça de forma mais rápida para o usuário, mesmo que um pouco fora do layout. O seu usuário irá ter uma experiência positiva, pois o seu conteúdo irá aparecer mais rápido e depois irá se ajustar na tela.

6- Não carregue conteúdo desnecessários. Sempre reduza a quantidade de arquivos desnecessário. Essa dica é muito importante para quem usa algum tipo de framework, plugins, etc. Muitas dessas ferramentas carregam em sua página arquivos que muitas vezes podem ser desnecessários para o seu site. Por isso, sempre revise seus arquivos e confira se não há duplicidade em chamadas de arquivos, chamadas redundantes ou até mesmo chamadas desnecessárias.

Essas são pequenas ações para ter uma resposta mais rápida de seu conteúdo, causando uma boa experiência para o seu usuário, e também agradando o Google. Se ambos estiverem satisfeitos com a experiência que seu site proporciona, melhor ranqueado ele irá ficar. Existem algumas ferramentas online que fazem um detalhamento do tempo que cada arquivo, cada componente demorar para ser carregado. Faça uso dessas ferramentas para sempre melhorar a experiência do usuário com o seu conteúdo. 
Se quiser saber mais sobre algumas das principais ferramentas e como elas podem lhe ajudar quando o assunto é otimização do site, dê uma olhada nesse link aqui.