As velocidades da Internet de hoje estão fora deste mundo. De acordo com o Statista , a velocidade média de download da banda larga fixa é de 105,15 Mbps, e a do celular é de 55,95 Mbps.
Mesmo assim, o inchaço do código, falhas e outros problemas podem levar a tamanhos de página que se tornam um ponto crítico para o SEO.
Você não acreditaria nos tipos de tamanhos de página que você pode encontrar em auditorias de SEO, podendo chegar até 100 MB (não estou brincando).
Existem várias etapas que você pode seguir para diminuir o tamanho da página, mas primeiro é necessário determinar o tamanho da página.
Também precisamos dar uma olhada em Core Web Vitals e como a página corresponde às métricas do Google.
Neste guia, você encontrará tudo o que precisa para entender e verificar o tamanho da página e, em seguida, otimizá-lo.
O que você vai ler neste artigo
O ideal é manter o tamanho da página HTML DOM em cerca de 100 kb ou menos, dependendo do seu nicho.
As páginas podem ser maiores em alguns nichos; no comércio eletrônico, por exemplo, não é incomum ver páginas em torno de 150kb-200kb, dependendo de quantas imagens de produto estão na página.
Você não quer ficar muito grande, porque então você começa a impactar negativamente a experiência do usuário e pode estar perdendo oportunidades de obter um aumento de classificação com boas pontuações do Core Web Vitals.
Mas cortar o tamanho da página sem olhar para a experiência do usuário pode fazer com que sua página não seja tão útil quanto a de seus concorrentes. O equilíbrio é a chave.
Se você estiver procurando por ferramentas para verificar o tamanho da página HTML , a seguinte ferramenta no SEO Site Checkup é uma boa.
O resultado do teste para o site MBN Notícias obteve a seguinte nota:
Ao incluir CSS e JS padrão, você deseja ter certeza de que também está otimizando este código para o carregamento da página. Isso significa ter certeza de que todos esses arquivos foram minimizados de forma adequada e garantir que você não inclua um grande volume de código.
“Aumento do código” significa que o código desnecessário aumenta significativamente o tamanho da página, impactando assim a velocidade da página.
Existem diferentes maneiras de realizar a mesma coisa. Você deseja evitar aqueles que causam problemas por meio da codificação excessiva no lado CSS e JS.
Além de uma mentalidade de codificação otimizada, os arquivos CSS e JS precisam do processo de minimização. O processo de minificação remove espaços extras e outros artefatos de código aleatórios que não precisam estar lá.
É importante observar que a minimização não altera sua codificação real – apenas os artefatos de codificação. Sua mente e seus esforços de desenvolvimento ainda serão necessários para alcançar a otimização de código CSS e JS final no lado do servidor.
Um tamanho grande de árvore DOM é uma causa significativa de problemas de velocidade de página e pode retardá-lo tremendamente.
Isso impacta coisas como eficiência de rede, desempenho de carregamento, desempenho de memória e desempenho de tempo de execução, os quais podem impactar significativamente o carregamento geral da página e a experiência do usuário do Core Web Vitals.
Seu processo de desenvolvimento deve incluir algum tipo de alocação de recursos para a otimização do tamanho da árvore DOM.
Imagens grandes podem impactar negativamente o tamanho da página, especialmente se interferirem na satisfação do usuário.
Se um usuário tiver que esperar 5 minutos para que uma imagem de 15 MB carregue, você já os perdeu.
É por isso que é importante levar em consideração o tamanho físico do pixel junto com as dimensões da imagem quando você está trabalhando na compactação de suas imagens.
Existem várias ferramentas para verificar o tamanho da página. Dois que eu gosto são:
O Page Speed Insights do Google é uma ferramenta crítica para identificar problemas de tamanho de página que podem estar retardando o carregamento.
Além disso, ele o ajudará a marcar os itens da lista de verificação para o Core Web Vitals do Google para o tamanho da página.
Você também pode verificar o tamanho da página usando Screaming Frog SEO Spider para realizar um rastreamento do seu site.
Assim que o rastreamento for concluído, siga estas etapas para verificar o tamanho da página:
1. Clique no menu suspenso no canto superior esquerdo.
2. Selecione HTML . Isso exibirá apenas páginas HTML que foram rastreadas em seu site.
3. Em seguida, role para a direita até ver os números do tamanho da página, conforme mostrado abaixo.
É assim que você pode verificar o tamanho da página com Screaming Frog SEO Spider.
O tamanho da página é uma consideração importante no SEO porque pode impactar a velocidade geral da página de forma significativa, afetando tanto as classificações de pesquisa quanto o desempenho.
De acordo com a Central de Pesquisa do Google:
“Acelerar os sites é importante – não apenas para os proprietários de sites, mas para todos os usuários da Internet. Sites mais rápidos criam usuários felizes e vimos em nossos estudos internos que, quando um site responde lentamente, os visitantes passam menos tempo nele.
Mas sites mais rápidos não apenas melhoram a experiência do usuário; dados recentes mostram que melhorar a velocidade do site também reduz os custos operacionais.
Como nós, nossos usuários valorizam muito a velocidade – é por isso que decidimos levar a velocidade do site em consideração em nossas classificações de pesquisa. Usamos uma variedade de fontes para determinar a velocidade de um site em relação a outros sites. ”
Quase 70% dos consumidores admitem que a velocidade da página afeta sua vontade de comprar de um varejista online, e metade disse que estaria disposta a desistir da animação e do vídeo para tempos de carregamento mais rápidos.
E, de acordo com o Google, conforme o tempo de carregamento da página vai de um segundo a 10 segundos, a probabilidade de um visitante do site móvel saltar aumenta 123%.
Como você pode ver, acelerar sua página é importante – não apenas para a experiência do usuário, mas também para sua classificação nos mecanismos de pesquisa.
Dependendo do seu provedor de hospedagem na Internet e seus planos de hospedagem, você pode acabar economizando nos custos de hospedagem com tamanhos de arquivo de página menores.
Um tamanho de página menor se traduz em menor largura de banda (transferência de arquivos) usada, o que pode reduzir os custos de hospedagem mais baixos – especialmente em sites grandes.
Preste atenção às seguintes práticas recomendadas para a melhor otimização possível do tamanho da página em seu site:
Para criar as melhores e mais otimizadas imagens, certifique-se de marcar os seguintes itens de sua lista de verificação:
O tamanho físico do pixel se refere à densidade do pixel da imagem. Não importa se sua imagem for reduzida de 1600 x 1600 para 500 x 500 se a densidade de pixels da imagem permanecer a mesma.
Você ainda obterá imagens com um tamanho de arquivo de 1 MB, se foi assim que começou.
Para garantir a otimização adequada que leva em conta esses dois fatores, certifique-se de aproveitar as vantagens da compactação de imagem sem perdas com ferramentas como Adobe Photoshop ou versões pagas de ferramentas como Smush Pro.
Atualmente, o Adobe Photoshop é o padrão ouro quando se trata de compactação de imagens.
Isso o ajudará a identificar todos os três fatores e a manter as imagens nítidas no final do processo de compactação.
Você também deve considerar formatos de imagem mais rápidos e melhores do que seus predecessores, como WebP em vez de png.
Existem vários serviços que você pode usar para otimização de imagem, incluindo ShortPixel.com e TinyPNG.com.
Se você estiver usando o WordPress, existem vários plug-ins que são muito úteis para essa tarefa. Um é o Shortpixel Image Optimiser e o outro é o plugin Tiny Compress Images.
Todos nós já passamos por isso. Todos nós temos sido vítimas de “I-Want-That-Font-itis”!
É provável que exista uma fonte alternativa segura para a Web que corresponda ao que você deseja usar com bastante facilidade.
Caso contrário, é importante considerar que quaisquer fontes adicionais que você adicionar de um recurso de terceiros levarão mais tempo para baixar. Essa é apenas a natureza da besta.
Usar fontes seguras para a web como Arial, Verdana ou Helvetica são ótimas opções e você elimina a possibilidade de problemas surgirem com a fonte personalizada que você escolheu.
Também é mais compatível com várias plataformas e navegadores, o que significa que seu site será exibido em tantos navegadores e dispositivos quanto possível, sem parecer bagunçado.
O processo de minimização de seus arquivos HTML e CSS pode fornecer dividendos significativos quando se trata de diminuir o tamanho da página.
Ao reduzir seu HTML e CSS , você se livra do espaçamento indesejado e desnecessário no código e, como resultado, reduz o tamanho do arquivo da página.
Faz sentido buscar um processo de minificação para todas as suas páginas, especialmente se você sabe que todas as suas páginas estão inchadas com códigos desnecessários.
Existem várias ferramentas que você pode usar para reduzir seus arquivos HTML e CSS, incluindo:
Se você estiver procurando por uma otimização com um clique para suas tarefas de minificação do WordPress, a Cloudflare também oferece esse recurso se você estiver pensando em mudar para o serviço CDN (Content Delivery Network).
A ferramenta do Minifier.org também é bastante útil para esse propósito.
Adicionar plug-ins não é tão inócuo quanto parece. Se você adicionar 5, 10 ou 15 plug-ins de uma vez, convém reduzir bastante essa prática.
Apenas o ato de adicionar plug-ins a um site WordPress terá efeitos negativos no tamanho da sua página, junto com efeitos negativos em quaisquer usuários que possam visitar a página (eles podem experimentar quedas significativas no desempenho do site como resultado).
Tenha o cuidado de limitar seus plug-ins apenas aos necessários e adicione a funcionalidade correta necessária para sua página.
Você não quer se deparar com uma situação em que adicionar plug-ins em grandes números faça com que sua página fique atolada com problemas de velocidade de página.
O tamanho da página pode melhorar ou prejudicar o desempenho do seu site.
Não cometa o erro de sobrecarregar seus usuários com fontes desnecessárias, imagens excessivamente grandes e plug-ins desnecessários.
Todas essas práticas podem resultar em páginas de carregamento lento, o que frustrará seus usuários e poderá fazer com que abandonem sua página.
Este é apenas um primeiro passo entre muitos quando se trata de um sólido processo de otimização técnica que funciona.
Desde os seus primórdios até os dias atuais, o SEM tem passado por transformações significativas,…
Neste mundo digital em constante evolução, entender o valor do investimento em SEO (Search Engine…
Neste artigo abrangente, mergulharemos fundo no fascinante mundo do Google BARD e entenderemos o que…
A otimização do mecanismo de pesquisa é um dos principais impulsionadores das vendas e do…
Com a globalização dos negócios e o aumento do comércio eletrônico, o SEO internacional se…
O Instagram adiciona novas funcionalidades ao seu formato de vídeo curto Reels, fornecendo aos criadores…
View Comments
Nice post. I learn something totally new and challenging on websites
Pretty! This has been a really wonderful post. Many thanks for providing these details.
Awesome! Its genuinely remarkable post, I have got much clear idea regarding from this post
The anecdotes you've included really bring this topic to life. I enjoyed reading your post.