fbpx

Bem vindo ao
Blog da FULL.

Aprenda, crie e cresça seu negócio na internet.

Encontre conteúdos, dicas, tutoriais e novidades sobre as principais ferramentas Wordpress

Siga a FULL.

Como configurar AMP no WordPress

Você está em:

Como configurar AMP no WordPress
  1. 1. Introdução ao Google AMP para WordPress
  2. 2. Atualmente lendo: Como configurar AMP no WordPress

Bem-vindo à segunda parte do Guia AMP para WordPress. Em nosso último artigo, aprendemos sobre a importância de uma estratégia da Web voltada para dispositivos móveis e como o AMP pode ser um divisor de águas em potencial. No guia de hoje, vamos aprender sobre:

  • Como integrar AMP com WordPress
  • Melhores plugins do WordPress para personalizar AMP
  • Realmente precisamos implementar AMP em nosso site WordPress?

Vamos começar.

Guia de vídeo AMP para WordPress

Continuando de onde a última postagem da nossa série parou, você pode acompanhar o vídeo do WPCrafter sobre como configurar facilmente o AMP com seu site WordPress. O vídeo de Adam orienta você em cada etapa do nosso guia – divirta-se!

Como configurar AMP para WordPress

Configurar o AMP para WordPress é um processo muito simples. Tudo o que você precisa fazer é instalar o plugin WordPress AMP desenvolvido pela Automattic e o resto se seguirá.

  • Vá para Painel do WordPress > Plugins > Adicionar Novo
  • Procure por “AMP”

Selecione o plugin e clique em Instalar agora

Ao ativar o plugin, todos os URLs de postagem em seu site terão uma versão AMP. Você pode acessar o link de qualquer postagem, anexar /amp/ ao final do URL e verá a versão AMP.

Vamos dar uma olhada na versão normal da página da web.

E esta é a versão AMP da mesma página:

É isso – você configurou com sucesso o AMP no WordPress. Difícil de acreditar que é tão simples, não é?

No entanto, se você não tiver  permalinks bonitos  ativados, você pode obter a versão do amplificador anexando  ?amp=1 ao link do post. Por exemplo, o link do post seria:

  • Versão normal: http://example.com/2016/01/01/hello-mobile-web/
  • Versão AMP: http://example.com/2016/01/01/hello-mobile-web/amp/
  • Versão AMP (com Pretty Permalinks desativados): http://example.com/2016/01/01/hello-mobile-web/?amp=1

O plug-in AMP adiciona uma metatag padrão no cabeçalho de suas páginas HTML “normais” que possibilita que o Google e outros mecanismos de pesquisa reconheçam a versão AMP das páginas existentes. Ele usa o logotipo do site que você pode definir no WordPress Theme Customizer .

É importante observar que o plug-in suporta apenas a conversão de postagens em versões AMP. De acordo com a descrição do plugin acessada em 1º de novembro de 2016, o suporte para a versão AMP das páginas do WordPress está em desenvolvimento e em breve.

Como medir o impacto no desempenho de AMP

Decidimos medir o impacto no desempenho da versão AMP da página no Pingdom. Os resultados foram dramaticamente diferentes. Tenha em mente que nossa configuração do WordPress estava em um ambiente de hospedagem compartilhada usando o tema padrão Twenty Fourteen sem nenhum cache ou plugins de otimização instalados.

A captura de tela a seguir mostra o benchmark de desempenho da versão básica da página:

E este é o resultado da versão AMP da página:

Os resultados são surpreendentemente separados.

Cada um dos componentes experimentou uma tremenda melhoria:

  • O tamanho da página foi reduzido em 70%
  • O tempo de carregamento diminuiu 35% para menos de 900 milissegundos
  • O número de solicitações foi reduzido em quase 60% de 17 para apenas 7!

Tudo isso foi conseguido pelo AMP, mantendo o conteúdo da página. A tabela a seguir captura os detalhes do teste para sua referência:

Fator NormalAMPMelhoria
Tamanho da página (KB)563,816770%
Tempo de carregamento (s)1,420,92935%
Nº de solicitações17759%

Olhando para esses números, é evidente que obter AMP é um acéfalo. Isso não apenas ajudará a melhorar suas pontuações de SEO, mas também fornecerá uma experiência de usuário bonita e organizada.

Além disso, você também pode incluir mecanismos de rastreamento na versão AMP da página. Abordaremos isso na seção a seguir.

Ampliando os recursos do AMP

Embora otimizar seu conteúdo para os leitores seja uma boa prática, também é importante manter a consistência da marca. Isso significa que mesmo as versões AMP do seu conteúdo existente devem seguir o esquema de cores, as fontes e a interface geral do usuário da sua marca.

O plugin AMP WordPress não tem as opções para fazer essas alterações. Seu objetivo era fornecer uma maneira rápida e fácil de tornar todo o seu conteúdo existente do WordPress compatível com AMP – um trabalho que faz muito bem.

Digite o plugin AMP para WP – Accelerated Mobile Pages .

Este plugin gratuito estende os recursos do AMP no WordPress, oferecendo funcionalidades adicionais, como:

  • Integração do Google Analytics
  • Suporte para páginas AMP WooCommerce
  • Posts relacionados abaixo do post
  • Lista de comentários recentes
  • Upload de logotipo personalizado
  • Barra de compartilhamento social
  • Suporte para incorporar conteúdo rico, incluindo vídeos e conteúdo de plataformas de conteúdo como YouTube, Instagram, Twitter, Vine, etc.

Como pré-requisito, o plug-in exige que você instale e ative o plug-in AMP para funcionar corretamente. Como de costume, você pode instalar este plugin da mesma forma que instalamos o plugin AMP no início deste post.

Uma vez ativado, você está pronto para configurar as várias opções que o plugin oferece. Vá para WordPress Dashboard > AMP para acessar as configurações.

Das muitas configurações que o plugin oferece, tentamos:

  • Ativando comentários
  • Adicionando postagens relacionadas
  • Adicionando uma navegação às postagens seguintes/anteriores

Aqui está uma captura de tela de como a versão AMP ficou depois de salvar as alterações:

E aqui está o desempenho:

Aqui está a captura de tela da página AMP vanilla para comparação:

O tempo de carregamento diminuiu ainda mais 7,4%. É interessante notar que, embora o tamanho da página e o número de solicitações tenham aumentado um pouco, houve uma melhora no Grau de desempenho geral (aumento de 3 pontos).

Em suma, este plug-in é excelente se você levar a sério o AMP e fazer com que seu conteúdo, anúncios e análises funcionem bem com a plataforma.

Conclusão

Dado o crescimento explosivo do uso de telefones celulares nos últimos anos, não é mais uma opção para as empresas on-line priorizarem os dispositivos móveis. É uma necessidade absoluta . O projeto Accelerated Mobile Pages é um esforço ambicioso em direção a esse objetivo e cada vez mais casas de mídia estão adaptando-o rapidamente.

Embora seja mais simples para blogs mais novos incorporarem AMP, blogs com milhares de páginas de conteúdo certamente podem achar isso particularmente desafiador. A razão é simples – nem todos seguem os padrões adequados ao publicar online. As organizações evoluem. Mesmo as tecnologias da web que estavam “quentes” cinco anos atrás estão obsoletas hoje. Embora o AMP faça o possível para se basear nas tecnologias da Web existentes, pode haver vários casos em que existam incompatibilidades/erros. E esses erros podem afetar negativamente suas pontuações de SEO.

Idealmente, as empresas devem medir suas fontes de tráfego de entrada – que porcentagem disso vem de um dispositivo móvel? Quantos deles vêm da pesquisa móvel? Qual é a taxa de rejeição dos visitantes móveis? Estas são as perguntas que você deve fazer antes de considerar o AMP.

Se você está convencido de que o conteúdo do seu site está tecnicamente estruturado de acordo com os padrões mais recentes, então vá em frente com o AMP! Você só vai aumentar o seu SEO.

No entanto, se você souber que há muitas configurações incorretas internas, links quebrados e erros, seria melhor abordar (e possivelmente resolver) esses problemas antes de prosseguir com o AMP.

Quais são seus pensamentos sobre AMP? Você usa para consumir conteúdo? Você implementou em seu site? Adoraríamos ouvir de você!

Aprenda com a FULL.

Junte-se a mais de 50 mil pessoas que recebem em primeira mão as principais ferramentas e tecnologia para desenvolvimento web

Meu carrinho
🎁 Faltam R$300,00 para liberar o Cupom Secreto
Seu carrinho está vazio.

Parece que você não adicionou nada ao seu carrinho =(