Top 7 WordPress Themes For Good Core Web Vitals (Classificação de 2023)

Publicados: 2023-03-14

Existem mais de 10.500 temas gratuitos disponíveis no repositório do WordPress.

E o número continua crescendo a cada dia.

Então, como você poderia identificar os melhores? Você deveria testar todos os temas de que gosta e comparar todas as métricas de desempenho, pontuações e milissegundos?

Sejamos honestos - não parece uma tarefa que você deseja passar o dia inteiro fazendo.

Especialmente quando fizemos isso por você!

Portanto, em vez de perder tempo ativando, desativando, testando, anotando resultados e comparando, continue lendo para descobrir os 7 temas do WordPress que se destacaram após nossa pesquisa e testes completos.

Como testamos os melhores candidatos a temas do WordPress para bons principais sinais vitais da Web

Observação: a melhor maneira de aproximar o desempenho de um tema no mundo real sem gerar tráfego era confiar no Core Web Vitals baseado em laboratório. Nossa experiência mostra que temas aprovados em LCP, CLS e TBT no laboratório têm maiores chances de reproduzir os mesmos bons resultados em campo.

Começamos nossa pesquisa coletando um grande conjunto de temas com os quais nossos desenvolvedores WordPress trabalharam no passado, junto com temas baseados em sua popularidade no repositório WP.

Em seguida, iniciamos o longo processo de teste de velocidade:

  • Instale e ative o tema em uma instalação em branco do WordPress.
  • Deixe o tema como está - sem conteúdo, menus, páginas, postagens ou plug-ins adicionados.
  • Execute o site com o tema por meio do PageSpeed ​​Insights do Google.
  • Execute o tema através do GTmetrix.
  • Execute o tema através do Pingdom Speed ​​Test.
  • Reúna todos os resultados e compare-os.

Decidimos usar três ferramentas de teste porque cada uma tem padrões e métricas variados. Queríamos garantir que uma ferramenta não estivesse dando resultados melhores ou piores do que outra.

Em cada ferramenta, decidimos monitorar métricas específicas:

Insights de velocidade de página

O PageSpeed ​​Insights (PSI) do Google é a ferramenta ideal para testar a velocidade e os Core Web Vitals de um tema. Considerando que não tínhamos tráfego no mundo real, focamos na pontuação de desempenho e suas métricas em dispositivos móveis e computadores.

Pontuação de desempenho do Google PSI

Aqui estão as métricas em que nos concentramos:

  • Pontuação de desempenho . É de 100 e com base nas seguintes métricas - LCP, CLS, Índice de velocidade, TBT e FCP. Cada métrica tem um peso diferente.
  • Primeira pintura de conteúdo. FCP é o tempo que o navegador leva para visualizar a primeira parte do conteúdo do DOM.
  • Maior pintura de conteúdo. O LCP mede quanto tempo leva para o maior elemento acima da dobra carregar em uma página.
  • Índice de velocidade . Ele mostra a rapidez com que o conteúdo de uma página é visivelmente preenchido. Menor é melhor.
  • Tempo total de bloqueio. Ele mostra como uma página não responde antes de se tornar totalmente interativa.
  • Mudança cumulativa de layout. O CLS mede o quanto mudanças inesperadas de layout afetam a experiência do usuário em uma página.

GTmetrix

O GTmetrix analisa a velocidade e a otimização de um site, tornando-o uma ferramenta valiosa para identificar problemas de desempenho e determinar se um tema contém um número excessivo de arquivos desnecessários.

Grau GTmetrix

As métricas nas quais nos concentramos foram:

  • Grau GTmetrix. É uma nota ponderada das pontuações de Desempenho e Estrutura.
  • Pontuação de desempenho. É o Lighthouse Performance Score, conforme capturado pelo GTmetrix, com suas auditorias personalizadas, opções de análise, navegador e especificações de hardware.
  • Pontuação da estrutura . É uma avaliação proprietária das auditorias Lighthouse e Custom GTmetrix. Representa o quão bem um tema/página é construído para desempenho ideal.
  • Vitais da Web. Métricas do Core Web Vitals baseadas em laboratório que medem se um tema/página oferece uma excelente experiência geral.
  • Tempo de carregamento. Quanto tempo leva para uma página da web carregar totalmente.

Pingdom

Embora o Pingdom compartilhe semelhanças com o GTmetrix, preferimos usar ambas as ferramentas simultaneamente, pois fornecem métricas diferentes. Além disso, o Pingdom oferece uma maneira fácil de testar uma página da Web de diferentes locais.

Todos os temas foram testados da América do Norte - EUA - Washington DC

Teste de velocidade do site Pingdom

Métricas que monitoramos:

  • Nota de desempenho Esta é uma nota cumulativa de 100.
  • Tempo de carregamento. A quantidade de tempo que o Pingdom leva para carregar todo o site com um tema instalado.
  • Tamanho da página. O tamanho de todos os arquivos do site da página. O tema tem um enorme impacto sobre este.
  • Solicitações de. O número de solicitações do servidor para entregar o tema e o conteúdo do site ao usuário.

Resumo rápido dos temas WordPress de melhor desempenho

Antes de nos aprofundarmos em cada tema, seus recursos, preços e pontuações de desempenho, aqui está um resumo de nossos testes.

Observação: a classificação a seguir é baseada nos resultados do Pingdom e, mais especificamente, no tamanho da página e no tempo de carregamento. Mais adiante no artigo, revisamos cada tema e seus resultados de CWV.

  1. Vinte e vinte e três –Tamanho da página:26,3 KB;Tempo de carregamento:520ms
  2. Hello Elementor –Tamanho da página: 32,7 KB;Tempo de carregamento:520ms
  3. GeneratePress –Tamanho da página: 37,7 KB;Tempo de carregamento:538ms
  4. Neve –Tamanho da página: 42,4 KB;Tempo de carregamento:552ms
  5. Sydney –Tamanho da página: 48,1 KB;Tempo de carregamento:560ms
  6. Astra –Tamanho da página: 48,5 KB;Tempo de carregamento:619ms
  7. Kadence –Tamanho da página: 54,8 KB;Tempo de carregamento:628ms

Resultados do teste de desempenho de temas do WordPress

Melhores temas do WordPress para passar nos principais sinais vitais da Web em 2023

Recursos, preços, resultados de desempenho - vamos começar com uma visão geral detalhada de cada concorrente.

1. Twenty Twenty-Three - Melhores amigos com Gutenberg

Tema WordPress Vinte e Vinte e Três

O tema padrão Twenty Twenty-Three foi desenvolvido para usar as ferramentas de design mais recentes introduzidas no WordPress 6.1.

O tema utiliza uma base simples e organizada e fornece dez variações de estilo distintas fornecidas pela comunidade WordPress.

O Twenty Twenty-Three permite que você crie facilmente um site de qualquer nível de complexidade, seja utilizando os estilos pré-concebidos ou adotando uma abordagem mais prática e personalizando-o ao seu gosto.

O que chama a atenção no mais recente tema padrão do WordPress é sua simplicidade e leveza. O Twenty Twenty-Three é flexível e perfeitamente adequado aos recursos de edição do site do Gutenberg, como edição de modelos, variações de estilo, tipografia e padrões de bloco.

Preço: Gratuito

Instalações ativas: mais de 800.000

Melhores características: design minimalista, estilos leves e pré-concebidos

Adequado para: ambiente de teste e construção de uma variedade de sites

O que nossos testes mostraram

Twenty Twenty-Three obteve resultados notáveis ​​em todos os três testes. Mais importante, seus Core Web Vitals baseados em laboratório estavam no verde, um pré-requisito para um excelente desempenho no mundo real.

Vinte e vinte e três resultados do teste de desempenho do tema WordPress

No PSI, pontuou perfeitamente no celular e no desktop, alcançando 100/100 em ambos os testes. Ele também obteve nota A no GTmetrix (98% de pontuação de desempenho, 100% de pontuação de estrutura) com 1,4s no tempo de carregamento.

Nossos testes Pingdom confirmaram o rótulo “leve” de Twenty Twenty-Three. Com apenas 26,3 KB de tamanho de página, esse tema foi o vencedor claro de todos os que testamos.

2. Hello Elementor - O endereço de e-commerce

Olá Tema Elementor WordPress

O Elementor é usado por 8,0% de todos os sites, o que não é surpresa, considerando a facilidade de criar uma página da web. Bem, os mesmos desenvolvedores responsáveis ​​por criar um dos construtores de páginas mais populares produziram um tema rápido e leve chamado Hello Elementor.

O tema é anunciado para ser rápido e flexível. Como você pode esperar, ele se integra perfeitamente ao Elementor e a vários outros plugins, como WooCommerce, Advanced Custom Fields, Yoast e outros.

Além disso, oferece mais de 100 designs prontos, o que permite criar um site perfeitamente funcional a partir do zero.

Preço: Gratuito

Instalações ativas: mais de 1 milhão

Melhores recursos: Leve, mais de 100 designs prontos, personalizáveis

Adequado para: Construir um site do zero

O que nossos testes mostraram

Como o Twenty Twenty-Three, o Hello Elementor obteve excelentes resultados de CWV tanto no desktop quanto no celular.

Resultados do teste de desempenho Hello Elementor

Pontuou perfeitamente em GTmetrix e Pingdom. Na verdade, nossos testes Pingdom o classificaram como o segundo tema mais leve, com um tempo de carregamento de 520ms, o mesmo que o tema padrão do WordPress.

Você deve estar ciente de que, embora seja comercializado como leve, o Hello Elementor não é personalizável por si só. Você precisará adicionar o Elementor como uma solução de criação de página, o que pode afetar o desempenho do seu site.

3. GeneratePress - O baseado em blocos

Tema WordPress GeneratePress

GeneratePress é um tema WordPress projetado para priorizar velocidade, usabilidade e acessibilidade.

Sua utilização do Gutenberg garante a você liberdade na hora de criar seu conteúdo. Se você usa construtores de páginas, adoraria saber que GeneratePress é totalmente compatível com todos os principais, incluindo Beaver Builder e Elementor.

O GeneratePress é totalmente responsivo e foi traduzido para mais de 25 idiomas. Além disso, inclui mais de 60 controles de cores, tipografia dinâmica poderosa, 5 locais de navegação, 5 layouts de barra lateral, menus suspensos e 9 áreas de widgets.

Preço: Gratuito; $ 59/anual, $ 249/vida

Instalações ativas: mais de 500.000

Melhores recursos: orientado para a velocidade, responsivo, compatível com construtores de páginas

Adequado para: Todos os tipos de sites

O que nossos testes mostraram

Uma coisa que nos chamou a atenção na busca por temas foi a declaração do GeneratePress “100% Page Scores”. Então, estávamos ansiosos para testar isso.

Podemos dizer que GeneratePress falou por falar e caminhou. Obteve pontuações de desempenho quase perfeitas em todos os três testes:

Resultados do teste de desempenho do tema GeneratePress WordPress

No que diz respeito ao tamanho da página, ficamos surpresos com os resultados. Executando nosso site através do Pingdom, o tamanho da página chegou a 37,7 KB, um pouco diferente dos “7,5 KB” que eles prometem em seu site.

4. Neve - A versátil

Tema WordPress Neve

Neve é ​​um tema versátil e rápido que pode ser personalizado para diversos fins. É ideal para blogueiros, pequenas empresas, startups, agências, empresas e lojas de comércio eletrônico que usam a vitrine WooCommerce, sites de portfólio pessoal e vários outros projetos.

Ele é otimizado para AMP e capacidade de resposta, garantindo tempos de carregamento rápidos e exibição ideal em qualquer dispositivo. Embora tenha um design minimalista, o Neve pode ser facilmente estendido e possui um código altamente otimizado para SEO que pode resultar nas principais classificações de pesquisa do Google.

Neve também é compatível com Gutenberg e criadores de páginas populares, como Elementor, Brizy, Beaver Builder, Visual Composer, SiteOrigin e Divi.

Preço: Gratuito; $ 69/ano; $ 149/ano; $ 249/ano

Instalações ativas: mais de 300.000

Melhores recursos: Responsivo, otimizado para SEO, design minimalista

Adequado para: Uma ampla variedade de finalidades e locais

O que nossos testes mostraram

Em relação ao Core Web Vitals e pontuações de desempenho, o Neve é ​​tão bom quanto as opções anteriores.

Resultados do teste de desempenho do tema Neve WordPress

O motivo pelo qual vem em quarto lugar em nossa lista é o tamanho da página e o tempo de carregamento, mas isso não deve impedi-lo de testá-lo.

Um dos benefícios do Neve é ​​que ele emprega o vanilla JS em vez de um framework como o JQuery. Isso contribui para uma melhoria no desempenho e resulta em um site mais responsivo.

5. Sydney - Freelancers adoram

Tema Sidney WordPress

Sydney é um tema robusto que permite que empresas ou freelancers estabeleçam rapidamente uma presença online notável.

Este tema é totalmente compatível com Elementor e oferece várias opções de personalização, incluindo acesso a todas as fontes do Google, controle completo de cores, controle de layout, upload de logotipo, controle deslizante de tela inteira, imagem de cabeçalho, navegação fixa e muitos outros recursos.

Além disso, Sydney fornece todos os blocos de construção necessários para criar prontamente uma página atraente.

Preço: Gratuito; $ 69/anual, $ 99/ano; $ 199/vida

Instalações ativas: mais de 100.000

Melhores recursos: acesso ao Google Fonts, controle de cores

Adequado para: sites de negócios

O que nossos testes mostraram

Depois de concluir uma nova instalação do Sydney, testamos o desempenho do tema.

Os resultados:

Tem todos os ingredientes para construir um site que irá satisfazer os seus visitantes e motores de busca.

Resultados do teste de desempenho do tema Sydney WordPress

Em termos de velocidade e Core Web Vitals, Sydney classifica o mesmo que os outros temas. No entanto, o tamanho total da página é duas vezes maior (48,1 KB) do que o Twenty Twenty-Three.

6. Astra - Conhecido por todos, amado por todos

Tema WordPress Astra

Astra é o tema WordPress mais popular. É rápido, totalmente personalizável e visualmente atraente, tornando-o uma escolha adequada para vários fins, como blogs, portfólios pessoais, sites comerciais e vitrines WooCommerce.

O Astra também foi projetado para ser leve, com um tamanho de front-end inferior a 50 KB, contribuindo para sua velocidade inigualável. O tema foi desenvolvido com o SEO em mente, integrando o código Schema.org e o suporte Native AMP para melhorar a visibilidade do mecanismo de pesquisa do seu site.

Além disso, o Astra oferece recursos e modelos exclusivos compatíveis com construtores de páginas populares, como Elementor, Beaver Builder, Visual Composer, SiteOrigin e Divi, garantindo integração perfeita com seu construtor de páginas preferido.

Preço: Gratuito; $ 47/anual, $ 137/ano; $ 187/ano; opções vitalícias disponíveis

Instalações ativas: mais de 1 milhão

Melhores recursos: sites pré-construídos, várias opções personalizáveis, rápido

Adequado para: Todos os sites

O que nossos testes mostraram

Ao contrário das nossas expectativas, o Astra não teve um desempenho tão bom quanto pensávamos. Sim, as pontuações móveis do PSI foram excelentes, mas mostraram resultados abaixo da média no computador.

Resultados do teste de desempenho do tema Astra WordPress

Além disso, foi surpreendente que obteve apenas 85% de pontuação de desempenho no GTmetrix. No entanto, todas as outras métricas foram semelhantes aos líderes em nosso ranking.

7. Kadence - O favorito discreto

Tema WordPress Kadence

Kadence é um tema WordPress leve e repleto de recursos, permitindo que você crie sites bonitos, de carregamento rápido e acessíveis com facilidade.

Um de seus recursos notáveis ​​é um construtor de cabeçalho e rodapé intuitivo de arrastar e soltar que permite construir qualquer tipo de cabeçalho em questão de minutos. O tema também possui uma biblioteca abrangente de modelos iniciais impressionantes que podem ser facilmente personalizados com a ajuda de fontes globais inteligentes e controles de cores.

Além disso, o Kadence Theme é altamente compatível com os plug-ins de terceiros mais populares, permitindo que você desenvolva rapidamente sites de comércio eletrônico impressionantes, sites de cursos, sites de negócios e outros tipos de sites.

Preço: Gratuito; US$ 129/primeiro ano, US$ 199/primeiro ano

Instalações ativas: mais de 200.000

Melhores recursos: arrastar e soltar intuitivo, modelos iniciais, voltado para o desempenho

Adequado para: Todos os tipos de sites

O que nossos testes mostraram

Kadence tem um tamanho de página padrão de 54,8 KB. Embora seja o maior do grupo, ele ainda conseguiu se destacar em ambos os testes PSI e obteve um A no GTmetrix.

Resultados do teste de desempenho do tema Kadence WordPress

Considerando o quanto esse tema inclui, isso pode ser drasticamente melhorado com alguma otimização e um bom plug-in de otimização de velocidade do site.

Qual tema devo instalar?

Todos eles.

Sim, você leu certo.

Reduzimos nossa lista a apenas 7 temas porque queríamos fornecer a você um pequeno conjunto de opções que você pode testar por conta própria.

É muito mais rápido e fácil passar por sete temas sozinho, em vez de sobrecarregá-lo com uma lista enorme de mais de 50 temas.

Acreditamos que os que foram incluídos neste artigo oferecem a melhor base para construir e ter um site de bom desempenho.

E enfatizamos na fundação.

Em nossa pesquisa, testamos os temas sem nenhum conteúdo ou plugins adicionados sobre eles.

Portanto, recomendamos experimentar todos eles, brincar com seus recursos de personalização, adicionar algum conteúdo e instalar alguns plug-ins.

Em seguida, teste e veja o que oferece os melhores resultados com base em suas necessidades e requisitos específicos.

Como melhorar ainda mais suas principais métricas da Web [lista de verificação]

Com base em um tema otimizado para velocidade, você terá uma vantagem inicial em sua jornada do Core Web Vitals.

No entanto, em muitos casos, confiar apenas em um tema rápido não é suficiente para que suas pontuações ultrapassem a linha.

É por isso que preparamos uma lista de verificação rápida de boas práticas que você pode seguir para otimizar cada métrica CWV:

1. Maior pintura de conteúdo (LCP)

  • Use um tema leve
  • Não encha seu site com plugins desnecessários
  • Comprima suas imagens
  • Sirva imagens em formatos de última geração
  • Pré-carregue suas imagens de herói
  • Minimize e comprima seus arquivos de código
  • Implementar CSS Crítico
  • Usar um CDN
  • Instale um plug-in de cache

2. Primeiro atraso de entrada (FID)

  • Atrasar ou remover scripts de terceiros não críticos
  • Minimize e comprima seus arquivos de código
  • Reduzir CSS não utilizado
  • Adiar JavaScript não utilizado

3. Mudança cumulativa de layout (CLS)

  • Adicione atributos de largura e altura a imagens e vídeos
  • Reserve espaço para anúncios, incorporações e iFrames
  • Otimize a entrega de fontes

Embora possa parecer muito trabalho, os benefícios da aplicação de todas essas práticas recomendadas acabarão levando a excelentes resultados de negócios no mundo real.

Tudo o que você precisa fazer é otimizar uma coisa de cada vez.

Ou…

Passe seu Core Web Vitals no piloto automático com NitroPack →