Accelerated Mobile Pages (AMP) ou páginas responsivas?

Quando a web surgiu, o aparato técnico usado para acessá-la era muito diferente do que se usa atualmente. Tínhamos computadores desktop fracos e conexões lentas e instáveis. Hoje, poderosos smartphones conectados ininterruptamente via conexões rápidas 4G são a norma. Essa mudança, somada a outras inúmeras no funcionamento da web, nos levou a um ponto crítico: os sites que acessamos todos os dias ficaram inadequados para os equipamentos que mais usamos.

Não é possível apontar um culpado. O que aconteceu foi uma confluência de fatores. Fato é que, em 2015, empresas e desenvolvedores perceberam certa insatisfação das pessoas no acesso a sites via dispositivos móveis: eles eram pesados, demoravam para carregar e nem sempre apresentavam um layout adequado às telas relativamente menores desses aparelhos.

Nesse cenário, Google e Twitter lançaram, em parceria com mais algumas empresas de tecnologia e um punhado de publicações ao redor do mundo, uma iniciativa chamada AMP, sigla para Accelerated Mobile Pages. O objetivo era, nas palavras de Richard Gingras, chefe de notícias do Google, “tornar a web boa novamente”.

O que é o AMP?

O AMP é uma forma inovadora de construir sites estáticos, como os que empresas de notícias (jornais, blogs) publicam. Ele se sustenta em um tripé composto pelo AMP HTML, um subconjunto do bom e velho HTML com restrições para melhor desempenho e algumas extensões que possibilitam conteúdo rico (vídeos, por exemplo); o AMP JS, uma biblioteca que ajuda a renderizar rapidamente o conteúdo HTML; e o Google AMP Cache, um sistema global de cache baseado nos servidores do Google a fim de garantir a melhor e mais rápida distribuição possível desse conteúdo.

A grande vantagem, o que justifica a existência do AMP se resume a uma palavra: velocidade. Há tempos o Google recomenda que sites carreguem os elementos visíveis da página, ou seja, aqueles que aparecem antes da “dobra” da tela, em menos de dois segundos. Isso porque qualquer período maior que isso gera impaciência nos usuários e aumenta as chances de elevar a taxa de rejeição (“bounce rate”). Mas a dificuldade em conseguir chegar a um site moderno, com visual atraente, recursos interativos e publicidade, tornam a recomendação quase paradoxal. O AMP se propõe ser a solução para tal impasse.

A grande vantagem que justifica a existência do AMP se resume a uma palavra: velocidade. Caso o tempo de carregamento seja muito alto, os usuários ficam impacientes e aumentam as chances de elevar a taxa de rejeição, fazendo seu site ficar menos colocado nos resultados do Google.

E, de fato, o AMP é rápido. Sites que aderiram ao formato, mesmo aqueles mais otimizados em suas versões tradicionais, carregam mais rapidamente no AMP. Graças ao cache do Google, o tempo de espera para que o conteúdo seja carregado é praticamente nulo. Ao tocar em uma página convertida para AMP nos resultados do Google, o conteúdo dela aparece na hora. Faça um teste aí: procure, no Google, termos de alguma notícia recente e toque em um dos resultados que aparecerem no carrossel do AMP que o Google implementou como forma de fomentar o uso do novo recurso. Rápido, não?

img_4260 img_4261

 

Dica: outra forma de acessar a versão AMP de sites compatíveis com a tecnologia é acrescentando um /amp no final do endereço.

Quem está usando o AMP?

A maioria dos grandes jornais e publicações nativas digitais adotaram o AMP. A iniciativa não surgiu num vácuo. Ela nasceu, em grande parte, como uma resposta aberta ao Instant Articles do Facebook, um projeto que oferece quase que as mesmas vantagens do AMP às publicações, porém restrito aos domínios do Facebook.

O AMP é um projeto aberto, com seu código publicado no GitHub e acessível a qualquer um. Assim, empresas que quiserem experimentar o AMP podem fazê-lo sem que para isso, em tese, tenham que ceder o controle dos seus visitantes a um terceiro, coisa que o Facebook pede para permitir o Instant Articles.

A proposta é tentadora e mesmo antes do lançamento do AMP diversas empresas já estavam envolvidas. Gigantes do jornalismo como The New York Times e Washington Post, publicações nativas digitais como as do conglomerado norte-americano Vox Media (Vox, The Verge, Polygon) e grandes portais brasileiros (os do grupo Abril, Uol e iG, para citar alguns) dão suporte ao AMP.

O Google destaca alguns casos de sucesso no uso do AMP. Um em especial chama a atenção: o do Washingont Post. Com 55% dos seus leitores acessando o site via dispositivos móveis, a direção do jornal achou uma boa testar a versão otimizada do AMP. Hoje, mais de mil artigos são publicados diariamente no formato. Foi percebido um aumento de 23% na taxa de retorno de leitores dentro dos sete dias posteriores à primeira visita e uma melhoria de 88% no tempo de carregamento da versão AMP em relação à mobile tradicional.

55% dos leitores do Washington Post acessam o site via dispositivos móveis. Hoje, mais de mil artigos são publicados diariamente no formato AMP. Foi percebido um aumento de 23% na taxa de retorno de leitores dentro dos sete dias posteriores à primeira visita e uma melhoria de 88% no tempo de carregamento da versão AMP em relação à mobile tradicional.

Dependendo do estado do site convencional, os ganhos vistos com a adoção do AMP se sobressaem mais. Numa análise mais fria, o que o AMP propõe é um recomeço e parcimônia no uso dos recursos disponíveis. Limitando a inserção de JavaScript, de rastreadores e de outros trechos de código que juntos somam vários megabytes, criar páginas leves, apenas com o essencial ao leitor passa a ser um objetivo viável. Mas será que o AMP é só vantagens?

A man hand holding screen Apple app showing on IPad mini and Iph

Os problemas do AMP

Nem todos os parceiros editoriais que embarcaram no AMP logo de cara estavam satisfeitos. Em junho de 2016, três meses após o lançamento oficial da iniciativa por parte do Google, algumas publicações grandes como a Slate e a Atlantic, ambas norte-americanas, declararam que o tráfego de visitantes na versão otimizada era bastante baixo. Talvez tenha sido uma questão pontual, mas na medida em que mais sites aderem ao AMP, a tendência é que as visitas extras derivadas do fator exclusividade na adoção do formato diminua.

Outro problema é a limitação que o formato impõe. O AMP permite apenas subconjuntos do HTML e JavaScript e, em relação a esse último, é especialmente restritivo. Não é à toa: os excessos no uso de JavaScript, uma linguagem de programação que é executada pelo navegador do dispositivo de quem acessa um site, é comumente apontado como um dos protagonistas do inchaço pelo qual os sites em geral passaram ao longo dos últimos anos. É essa tecnologia, também, que permite toda a sorte de rastreadores e códigos mal feitos do mercado de publicidade. Limitar o JavaScript, por si só, garante uma boa economia de bytes — e mais velocidade no carregamento das páginas web.

O problema é que algumas publicações dependem dos serviços de publicidade e rastreamento que usam esses códigos não permitidos pelo AMP. É preciso sacrificar esses canais de faturamento ou adequá-los às regras do formato, duas saídas nem sempre fáceis ou mesmo viáveis.

Outro efeito colateral das restrições do AMP é que elas limitam severamente os recursos multimídia e o visual das páginas. Há espaço para colocar o logo da publicação e alguns elementos de personalização mais elaborados, mas esse espaço é minúsculo perto do que o HTML convencional, somado a JavaScript e todas as demais linguagens, técnicas e soluções da web aberta oferecem. As versões AMP de sites tradicionais acabam muito similares e esse problema se agrava ao utilizar soluções de conversão prontas, como o plugin oficial do AMP para WordPress.

Nessa linha, o fato do Google usar seu cache para agilizar a renderização das páginas faz com que o buscador “sequestre” a URL dos sites originais. Uma página AMP de um site qualquer acessada via Google exibe, na barra de endereços, um “google.com…”, dificultando o compartilhamento da URL original e prejudicando a identidade do site. O Google garante que esse comportamento não afeta as estatísticas de visitação e impressão de anúncios, porém, recentemente acrescentou um botão de âncora/link no cabeçalho das páginas AMP a fim de facilitar, ao leitor, o acesso à URL original do site.

Resumindo: ao oferecer mais velocidade, o AMP pede em troca um pedaço da autonomia das publicações. E isso pode ser bastante, já que interfere no futuro das publicações dentro dos seus próprios sites — as soluções do Facebook e da Apple, pelo menos, não chegam a afetar os domínios das publicações. De qualquer forma, é uma cessão que a publicação aderente ao AMP faz.

Design responsivo como alternativa ao AMP

Alguns anos atrás, quando os smartphones se popularizaram, era comum que os sites oferecessem versões “móveis”, com layouts exclusivos, para esses novos visitantes. Posteriormente, surgiu uma técnica que permitiu usar o mesmo layout tanto para computadores quanto para smartphones, alterando a apresentação através de condicionais no CSS. Era o design responsivo.

O design responsivo resolve o problema da duplicidade de trabalho. Afinal, faz-se um site geralmente partindo da versão móvel, e depois, com algum código CSS extra, adapta-se esse mesmo layout para telas maiores. O custo de manutenção e o esforço para servir o site para diferentes tamanhos de tela compensam muito. É mais fácil, mais barato e, de quebra, ainda mantém a uniformidade do design, a identidade visual do site.

captura_de_tela_2017-02-16_as_09-12-44 img_4263

No sentido de servir páginas mais leves para visitantes de smartphones, o design responsivo pouco faz. Um ou outro código JavaScript e as imagens (se o servidor estiver configurado corretamente) podem ser servidos em versões menores dependendo do tamanho da tela, mas a base do site ainda é a mesma. A solução, pois, é colocar o site inteiro numa dieta de bits.

É possível. As facilidades no desenvolvimento web e soluções que agilizam partes mais monótonas do trabalho, como os frameworks, são compensadas com código mais sujo e exagerado. “Polir” esse código dá trabalho, mas resulta em sites mais leves — o que beneficia visitantes que os acessam por dispositivos móveis, mas não só eles.

Maciej Ceslog, desenvolvedor do Pinboard, um serviço de bookmarks online, é um ferrenho defensor dessas técnicas mais elaboradas e com resultados mais leves para a web. Em uma palestra sobre a obesidade dos sites contemporâneos, ele demonstra como estamos inchando o tamanho deles, ano após ano, sem qualquer justificativa plausível, apenas porque o poder de processamento dos dispositivos e a velocidade da Internet (nas regiões onde os desenvolvedores se concentram) permitem isso sem maiores prejuízos. Nesse ritmo, continuaremos a ter sites cada vez maiores e mais lentos, o que acaba anulando os avanços em hardware e rede que, idealmente, deveriam deixar tudo um pouco mais rápido.

O AMP é uma solução para um problema que nós mesmos criamos. E é uma solução fácil, quase mágica, o que explica o seu grande apelo.

Em redações de publicações digitais, onde nem sempre se tem à disposição programadores especializados em otimizar layouts e sistemas, é bastante tentador, com um plugin, transformar sites enormes e pesados em páginas extremamente leves que carregam instantaneamente. E, nesses casos, é uma solução válida, digna, no mínimo, de alguma consideração.

Mas não é a única solução. Se houver tempo, expertise e vontade, é possível alcançar resultados quase tão bons quanto os do AMP sem depender do Google. Para alguns que acham que já dependemos demais do Google e de outras gigantes do Vale do Silício como Facebook e Apple, essa independência pesa.

Na One Day Testing, ajudamos você no processo de conversão para o AMP, oferecendo feedback, identificando problemas e acompanhando todo o processo. Também ajudamos a otimizar sites no bom e velho HTML padrão a fim de reduzir o tempo de carregamento e tornar suas páginas mais amigáveis para seres humanos e buscadores (SEO). Cada caso pede uma solução específica; estamos aqui para ajudá-lo a tomar a decisão correta.