(Last Updated On: 26/02/2018)

Google AMP acelerando suas páginas em dispositivos móveis.

Em outubro de 2015, o  Google lançou um projeto chamado Google AMP, que é a forma abreviada para Accelerated Mobile Pages – carregamento rápido de páginas móveis.

Com este projeto, o Google tem como objetivo melhorar a velocidade – (carregamento de conteúdo) – da navegação móvel em Smartphones oferecendo uma experiência positiva para os usuários de internet móvel.

Se você, como eu, frequenta fóruns de SEO (otimização para mecanismos de busca) e blogs de marketing na internet, são grandes as possibilidades de já ter ouvido falar sobre o AMP.

Será que você já aplicou o AMP em seu site?

Muitas pessoas ainda estão confusas com o termo. Elas não têm ideia clara sobre o que o AMP faz, por que é importante e como implementá-lo em um site WordPress.

O Google AMP é um projeto de código aberto (open source), que serve para carregar com melhor desempenho as páginas da Web e os anúncios publicados.

Esse artigo é destinado para esclarecer tais dúvidas. Aqui você poderá ter uma ideia melhor sobre o AMP e como usá-lo em seu site WordPress.

 

O que é o AMP?

Google AMP acceleration

Como eu disse na introdução, o projeto AMP visa garantir a velocidade de carregamento mais rápida possível durante a navegação em dispositivos móveis.

Hoje em dia, a maioria das pessoas acessa a internet a partir de seus Smartphones.

Porém, o que chama bastante atenção é que um número significativo de pessoas está usando conexões lentas de internet. Portanto, as páginas originais levam muito tempo para carregar em seus dispositivos.

O Google AMP agiliza o carregamento das páginas Web acessadas pelos usuários durante a navegação realizada através de um Smartphone ou Tablet.

No entanto, o AMP mantém o conteúdo principal. Isso significa que tanto a versão original como a versão AMP de uma página oferecerão a mesma informação.

O que vai ficar diferente na apresentação das páginas são: o estilo de conteúdo, a localização da barra lateral, apresentação de mídia e, obviamente, a velocidade de carregamento.

O AMP possui uma estrutura leve chamada AMP HTML. No entanto, você não terá que se preocupar com esse framework, afinal existem plugins que fazem todo o trabalho necessário para os sites que usam o WordPress.

Continue lendo, abaixo vou demonstrar como usar o AMP em um minuto. Antes porém, vamos descobrir por que você precisa usar o AMP.

Por que o Google AMP é importante?

O Google vai dar cada vez mais importância às páginas AMP nos resultados de busca na pesquisa móvel. E essa é a razão principal para você usar o AMP em seu site.

Já era verdadeiro o fato de que o Google estava promovendo as páginas otimizadas para dispositivos móveis em uma posição superior para os visitantes móveis. E agora, com o projeto AMP, tornou-se mais importante do que nunca para o seu website.

benchmarks speed Google AMP

Uma velocidade maior no carregamento das páginas terá um impacto positivo na sua taxa de conversão e na experiência geral do seu usuário no site.

Isso fica bem evidente em uma publicação do próprio Google. De acordo com essa publicação, as páginas médias de aterragem móvel levam 22 segundos para carregar, enquanto 53% dos visitantes móveis deixarão de acessar uma página se ela demorar mais de 3 segundos para ser carregada.

Usar o Google AMP pode ajudá-lo a lidar com esse problema de forma eficiente. E para o negócio ficar melhor ainda, você receberá cache grátis do Google.

O cache do AMP é um CDN desenvolvido profissionalmente que organiza continuamente as páginas AMP e as armazena em cache para melhorar o desempenho móvel do site.

Graças ao sistema de validação integrado, você pode ter certeza de que as páginas serão sempre carregadas perfeitamente.

Como se parecem as páginas AMP?

Neste ponto, você já consegue ter uma boa ideia do quanto o AMP é importante. Mas você sabe como as páginas AMP se parecem?

Se você usa dispositivo móvel para pesquisar na internet, talvez tenha notado um pequeno ícone de um flash ao lado da palavra AMP que aparece nos resultados da pesquisa. Estas são as páginas AMP.

Caso ainda, não tenha notado as páginas da AMP, faça uma pesquisa no Google, usando uma palavra qualquer, no seu dispositivo móvel, ou pesquise utilizando a palavra Google AMP. A página resultante incluirá várias páginas AMP como as seguintes:

pesquisa google amp

Como usar o AMP no WordPress?

Existem duas maneiras de usar o AMP em um site do WordPress

  • Instalando o plugin AMP
  • Instalando outros plugins que possuem mais opções de configurações.

O primeiro passo é instalar e ativar o plugin AMP criado pela Automattic.

Usar o plugin é muito simples. É só instalar. Você não terá que fazer mais nada. Depois de ativar o plugin, ele criará automaticamente as versões AMP de suas postagens.

plugin-amp-wordpress

Você pode verificar as versões AMP de suas postagens adicionando ” / amp ” após a URL da publicação. Deixe-me dar um exemplo, esta seria a URL de um post ou página do seu site:

http://www.yoursite.com/be-positive/

A URL da versão Google AMP desta publicação ficaria assim:

http://www.yoursite.com/be-positive/amp/

E se você ainda estiver usando a estrutura de permalinks simples, pode encontrar a URL AMP adicionando “? Amp = 1” após a URL. Isso significa que a URL da versão AMP seria assim:

http://www.yoursite.com/?p=123?amp=1

Esse foi um primeiro passo. Agora, vamos dar uma olhada nos outros plugins gerenciadores de páginas AMP.

Gerenciando o AMP com Plugins

Agora que você instalou o plugin AMP, você está pronto para usar outros plugins que vão gerenciar outras opções para suas páginas AMP.

Existem vários plugins disponíveis para esse fim. Vou apresentar os 3 melhores para AMP

1 – Glue for Yoast SEO & AMP

glue for yoast seo amp

Desenvolvido pela Equipe da Yoast, este plugin integra o AMP com o popular plug-in Yoast SEO.

Depois de instalar e ativar o plugin em seu site WordPress, você encontrará as opções de configurações do plugin na página SEO -> AMP.

Yoast-SEO-AMP-addon1

 As opções de configurações são divididas em três seções.

1 – A seção “Tipos de posts” permite que você controle quais tipos de postagem devem ter suporte AMP. Enquanto os posts originais são ativados por padrão, você também pode ativar postagens personalizadas.

2 – A seção “Design” permite que você defina uma imagem padrão exibida e as cores de vários elementos, como o título, o texto, as informações da meta, o texto do link, o link e as cores de bloqueio.

Você também encontrará campos separados para fornecer CSS personalizado e adicionar código personalizado ao cabeçalho.

3 – A seção “Analítica” inclui um único campo que permite adicionar o código de acompanhamento do Google Analytics .

2 – Custom AMP

Custom Amp -AMP project

Custom AMP é um complemento que oferece recursos adicionais para o original plugin AMP. O plugin criará um novo item de menu “Painel AMP personalizado”, onde você encontrará as opções disponíveis.

Existem campos disponíveis para carregar o logo do AMP e do logo dos metadados para os internautas móveis.

Você pode executar algumas configurações como: adicionar imagens destacadas, exibir comentários, mostrar postagens relacionadas, etc.

painel-custom-amp - Google

Custom AMP também permite que você mostre uma largura de conteúdo personalizada para suas páginas AMP.

Graças ao recurso de seleção de menu, você pode escolher qual menu deve ser exibido nas páginas AMP.

Existe um campo dedicado para fornecer o código do Google Analytics.

Por último, mas não menos importante, o plugin também facilita a aplicação de CSS personalizado e permite que adicione código HTML personalizado ao rodapé.

3 – Facebook Instant Articles & Google AMP

facebook-instant-articles-google-amp

O plugin PageFrog funciona independente do plugin AMP. E, como você pode adivinhar a partir do título, o plugin suporta os formatos Google AMP e Facebook Instant Articles.

Para usar o plugin, você deve habilitar o formato desejado da página.

Vai em Formatos Móveis -> Configuração .

Você encontrará as opções de configuração na página “Configurações”. Você pode optar por habilitar o AMP para todas as postagens existentes e para os futuros posts.

O plugin também permite que você mostre a imagem em destaque nas páginas AMP.

A página “Styling” inclui todas as opções de personalização.

Você pode fazer o upload de um logotipo personalizado e selecionar as fontes para título, cabeçalho do artigo, corpo, citações e rodapé.

Também é possível escolher a cor para todas as fontes.

Depois de fazer todas as alterações, clique no botão “Salvar Configurações”.

A seção “Pré-visualizar” à direita mostrará uma visualização ao vivo das mudanças.

Esse recurso de pré-visualização é bastante útil. Você pode usar esse recurso para verificar como suas postagens serão vistas com o AMP e Instant Articles.

O painel de visualização estará disponível na barra lateral direita do editor de postagens.

O plugin PageFrog também permite que você mostre anúncios do AdSense e ative o Google Analytics ou outros tipos de análises nas páginas do AMP.

Conclusão

De acordo com a tendência atual, pode-se dizer que o futuro é móvel. Isso significa que os proprietários de sites precisam se concentrar mais em tornar seus sites tão amigáveis ​​quanto possível para dispositivos móveis. Habilitar a AMP poderia ser um grande passo em direção a esse objetivo.

Agora que você leu esse tutorial sobre como configurar o AMP em seu site WordPress, você está pronto para agir.

Instale os plugins AMP necessários, configure-os e aproveite a nova velocidade de carregamento do seu site em dispositivos móveis.

Nota:

O site Search Engine Land descobriu que o Google AMP após testes, mostrará nas pesquisas instantâneas móveis, destacado com a cor azul, o símbolo do raio e a palavra “instant”. Como na imagem abaixo.

Google-AMP-Label-Azul

Porque usar o Google AMP no seu site WordPress
4.6 (92.5%) 8 votes

Publicado por Mauricio Alex

Blogueiro, Radialista, Diretor de TV, Escritor, Piloto e Empreendedor Digital.

Deixe um comentário

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

Esse site utiliza o Akismet para reduzir spam. Aprenda como seus dados de comentários são processados.

Copy Protected by Chetan's WP-Copyprotect.