Desempenho do site: criar um site pensando em seu desempenho
4 min
Neste artigo
- Otimizar a ordem de carregamento dos elementos
- Fazer o design de uma seção de alto desempenho acima da dobra
- Usar páginas dedicadas
- Otimizar imagens e vídeos
- Carregamento lento (lazy loading)
- Gerenciar elementos adicionais
- Perguntas frequentes
Crie um site rápido e envolvente tomando decisões de design que priorizam a performance. Ao escolher o que mostrar primeiro, onde posicionar imagens e vídeos e como organizar seu conteúdo, você ajuda suas páginas a carregarem mais rápido e facilita para as pessoas encontrarem o que procuram. Siga estas dicas focadas em performance para melhorar a velocidade do seu site, manter os visitantes interessados e oferecer uma experiência fluida e profissional em qualquer dispositivo.
Otimizar a ordem de carregamento dos elementos
Os elementos do seu site são carregados em uma ordem específica com base no seu tipo e tamanho. Entender essa ordem ajuda você a priorizar o que aparece primeiro e a garantir uma ótima experiência.
- Elementos estáticos: incluem texto e formas básicas que carregam mais rapidamente. Adicione-os acima da dobra para garantir uma visibilidade rápida.
- Elementos responsivos: imagens e vídeos entram nessa categoria. Apesar de deixarem seu site mais interessante, eles podem afetar a performance. Sempre que possível, posicione esses elementos abaixo da dobra da página.
- Elementos interativos: elementos como iFrames, animações e apps externos são carregados por último. Use-os estrategicamente e com moderação para evitar um carregamento demorado.
Dica:
Recomendamos dar uma atenção especial à página inicial, pois essa geralmente é a primeira página que seus visitantes acessam.
Fazer o design de uma seção de alto desempenho acima da dobra
A seção acima da dobra refere-se à área da página web que aparece antes de o usuário começar a percorrer por ela. Como ela é carregada primeiro, é fundamental que ela seja leve e informativa.
Elementos recomendados:
- Texto: use um texto conciso e impactante que transmita claramente o propósito da sua página. Use fontes do sistema e evite o uso excessivo de fontes pesadas.
- Calls to action (CTA): inclua botões ou links claros para guiar as ações dos usuários, como "Compre agora" ou "Saiba mais". Evite colocar elementos que tiram a atenção perto de CTAs.
Elementos a serem minimizados:
- Imagens ou vídeos grandes
- Animações
- Uso excessivo de imagens de alta resolução
Dica:
Use recursos como o Google PageSpeed Insights ou o painel de controle Velocidade do site Wix para garantir que o conteúdo acima da dobra seja otimizado para um carregamento rápido.
Usar páginas dedicadas
Sobrecarregar páginas com muitos elementos afeta o desempenho, especialmente a página inicial. Em vez disso, crie páginas dedicadas para recursos ou apps específicos do site.
Adicione páginas para recursos como lojas, blogs ou vídeos e vincule-as a partir da página inicial com botões ou itens do menu. Mantenha o tamanho da página em aproximadamente oito telas ao distribuir conteúdo pelas páginas do seu site e limitar elementos desnecessários.
Otimizar imagens e vídeos
Os arquivos de mídia geralmente tornam os sites mais lentos devido a tamanhos e resoluções grandes. Confira como gerenciá-los de forma eficaz:
Imagem:
- Use formatos leves como WebP ou JPEG.
- Comprima arquivos antes de fazer upload no Wix.
- Mostre imagens em uma galeria Pro para otimização integrada.
Vídeos:
- Organize vídeos no Wix Vídeo, YouTube ou Vimeo para otimizar o desempenho.
- Evite colocar vídeos acima da dobra para que a página inicial seja carregada mais rapidamente.
Carregamento lento (lazy loading)
O carregamento lento atrasa o carregamento de imagens e vídeos até que eles apareçam na janela de visualização do usuário, melhorando o tempo de carregamento inicial da página. Esse recurso é ativado automaticamente no Wix, mas funciona melhor quando imagens e vídeos são colocados dentro de elementos compatíveis, como galerias ou faixas, e o conteúdo acima da dobra é mais limpo para uma visibilidade mais rápida.
Gerenciar elementos adicionais
Outras decisões de design também podem afetar a velocidade e o desempenho do seu site:
- Botões: crie botões claros e concisos com links para conteúdo relevante em outro lugar do seu site. Por exemplo, você pode usar "Explore o catálogo" ou "Veja mais projetos".
- Código personalizado: certifique-se de que qualquer código personalizado seja otimizado e use atributos como "defer" ou "async" para reduzir o atraso.
- Paginação ou botões "Ver mais": especialmente para sites com muitos produtos, evite mostrar todos os produtos de uma vez em uma única página. Implemente recursos de paginação ou carregamento sob demanda para manter o carregamento eficiente.
Dicas:
- Teste regularmente: use o Google PageSpeed Insights e o painel de controle Velocidade do site do Wix para monitorar e melhorar o desempenho.
- Priorize o conteúdo acima da dobra: certifique-se de que o conteúdo principal seja carregado rapidamente adicionando elementos leves e estáticos.
- Minimize apps externos: use apenas apps ou widgets essenciais para evitar compartilhamentos desnecessários.
Perguntas frequentes
Clique nas perguntas abaixo para saber mais.
Por que meu site Wix demora para carregar e como posso melhorar sua velocidade?
Por que meu site mobile é mais lento que meu site para desktop?
Como posso melhorar minha pontuação do Largest Contentful Paint (LCP)?
Qual é a melhor maneira de exibir um grande número de produtos sem deixar o carregamento da minha loja mais lento?
Contrate um profissionalEncontre um Parceiro Wix que pode ajudar você a alcançar os objetivos do seu site.
