AMP (Accelerated Mobile Pages). Saiba o que é e como implementar essa tecnologia que está revolucionando as buscas móveis!

Você provavelmente ainda não ouviu falar sobre ele, mas pode ter certeza que ele vai mudar muito como você interage com conteúdo pelo celular. É o AMP (Accelerated Mobile Pages), uma iniciativa open-source lançada em outubro de 2015 pelo Google com o objetivo de carregar rapidamente páginas com conteúdo e fazer a internet mobile mais rápida.

Parece simples – e tecnicamente é. Mas as consequências da aplicação dessa técnica são imensamente benéficas.

Normalmente quando você está no celular e faz uma busca, a experiência pode ser bem frustrante: encontrar o resultado ideal, páginas não otimizadas para o mobile, anúncios que são impossíveis de fechar ou escapar, imagens e vídeos pesados que consomem todo o plano de dados, etc.

E esses são só os empecilhos na ponta do usuário. Para o criador do conteúdo, essa frustração gerada resulta em penalidades no Google, falta de exposição do site e, principalmente, falta de exposição de anúncios – uma das principais fontes de receitas para criadores.

O AMP veio justamente para melhorar todo esse fluxo para os dois lados: um HTML mais focado para uma performance e experiência de ponta para o usuário e a segurança que seu conteúdo será mais visto e aproveitado, aumentando a taxa de retorno de visitantes e o clique em seus anúncios.

Como funciona o AMP?

O Accelerated Mobile Pages é basicamente um HTML customizado. É uma marcação que você faz para identificar o que vai e como vai na página otimizada. A implementação é bem fácil, existem vários guias fornecidos pelo próprio Google de como o fazer.

Por isso, o objetivo desse post é outro: mostrar as aplicações e as vantagens do AMP. Essa técnica consiste em:

• AMP HTML: como citado, um HTML com propriedades customizadas para se obter mais performance. Existem diversas marcações e variações do HTML tradicional, e o uso de metadados é encorajado;

• AMP Javascript: é mais restrito, não permite script autoral e nem de terceiros, mas ainda existe um Javascript do AMP. É uma biblioteca mais reduzida e focada em performance, voltada para estruturar o carregamento da página de forma assíncrona, para que nenhum objeto externo impeça o carregamento imediato do que está hospedado internamente;

• AMP Cache: é um CDN (Content Delivery Network) específico para conteúdo já validados em AMP. Se você tem conteúdo em AMP e usa essa ferramenta, o Google vai guardar e servir em cache essa página ao invés da sua.

AMP é só pra conteúdo e notícias?

Quando foi lançado, a tecnologia era voltada a conteúdo de publishers de notícias, principalmente para promoção do AMP, já que esses conteúdos ficavam no carrossel de notícias quando se fazia uma busca.

Mas vendo o impacto positivo da experiência do usuário e da performance das páginas, era óbvio que haveria cada vez mais e mais interessados de diferentes segmentos da Internet. Hoje já temos exemplos de diversos sites de e-commerce e até plataformas de anúncios que estão apostando no Accelerated Mobile Pages para gerar tráfego e receita.

Estamos com cada vez mais plataformas disponíveis e preparadas para o AMP. Plataformas de conteúdo, como Linkedin, Reddit, Twitter (um dos parceiros de criação do AMP); CMSs, como WordPress (que já tem plugin para adaptar sua página); ferramentas de analytics, como o Adobe Analytics e o do próprio Google. E pensando no incentivo em produção de conteúdo, até plataformas de anúncios, como Adsense, Double Click e OpenX.

Em breve, com a priorização cada vez maior de conteúdo otimizado para o mobile feito pelo Google, veremos  cada vez mais páginas aceleradas por essa tecnologia. E como o formato dela é open-source, é de se esperar uma verdadeira revolução em como consumimos conteúdo no celular.

Por que usar o AMP? Quais suas vantagens?

Já citamos alguns dos benefícios aqui, mas nunca é demais ressaltar o que você pode obter ao implementar o Accelerated Mobile Pages:

• Tempo de carregamento: até 4x mais rápido das páginas em mobile;

• Melhora no ranking: apesar de AINDA não ser um fator de ranking, velocidade de carregamento e boa versão mobile são. Como o AMP melhora esses dois índices, é natural associar a implantação da tecnologia a melhores resultados;

• Alta taxa de conversão: há uma conexão direta entre maior tempo de carregamento da página e menor taxa de conversão. Tendo em vista que o AMP influencia direto nisso, é natural (e provado via estudo de caso) que seu CTR aumente;

• Visibilidade: hoje os acessos mobile já configuram metade das buscas do Google, então é essencial estar preparado. Mas mais do que isso, resultados em AMP tem destaque, seja pelo símbolo do trovão ao lado do resultado ou por ir parar no carrossel de notícias, antes dos outros resultados;

• Maior clique em anúncios: por incrível que pareça, um dos resultados da boa experiência proporcionada pelo AMP é o controle no tamanho e visibilidade dos anúncios. Tornando-se menos invasivos, os usuários prestam mais atenção e rejeitam menos a ideia de clicar.

AMP é difícil de implementar?

O AMP é mais simples do que parece de implementar. Você pode usar plugins ou simplesmente adotar o código HTML. Implementar não é o problema, mas sim garantir o bom uso. Por isso, destaco:

• Teste seu artigo na ferramenta de validação de AMP

a. Abra sua página;

b. Adicione “#development=1” na URL. Por exemplo:

https://ampbyexample.com/#development=1

c. Abra o Chrome DevTools console, emulando dispositivos mobile e faça a verificação de erros.

d. Conserte-os!

• Cheque se seu conteudo está devidamente documentando de acordo com o Schema.org

 a. Use o Rich Snippet correto.

• Em caso de uso implementação manual (sem plugin), é sempre bom verificar os links

a. Existe um link rel=amphtml na pagina canonizada?

b. Existe a tag rel-canonical no código html da página AMP?

DICA EXTRA: Se você não tem um desenvolvedor para implementar o AMP para você, use o PostLight Mercury! É simples e rápido!

Tenha cuidado com recursos externos

O propósito do AMP é garantir uma boa experiência, então imagens ou vídeos que não carreguem corretamente podem comprometer isso. Use conteúdo hospedado em lugares que você pode controlar para evitar surpresas desagradáveis.