A web para celular continua crescendo em ritmo acelerado.
Os smartphones continuam a vender fortemente, com a Apple sozinha prevendo trazer US $ 180 bilhões de seus smartphones até 2021. Existem mais de 224 milhões de usuários de smartphones nos Estados Unidos, tornando a Web para dispositivos móveis um foco essencial para qualquer proprietário de site.
O crescimento contínuo de usuários da Web para dispositivos móveis torna importante que os designers e desenvolvedores front-end compreendam o design adequado para páginas móveis aceleradas.
A prática de páginas móveis aceleradas enfatiza as escolhas de design que se alinham com o que motores de busca percebem como amigável , incluindo um público-alvo definido, conteúdo de alta qualidade, formatação adequada e compatibilidade móvel perfeita. Você notará uma variedade de páginas para celular aceleradas ao navegar no Google em dispositivos móveis pela abreviatura AMP nos resultados da pesquisa .
As páginas para dispositivos móveis aceleradas ainda usam HTML, embora incorporem elementos especiais que priorizam a velocidade em dispositivos móveis. Os requisitos técnicos de AMP são estabelecidos por o projeto AMP , com os padrões trabalhando ao lado de grandes influenciadores de tráfego como o Google. O projeto foi criado em resposta a interfaces de usuário desajeitadas e tempos de carregamento lentos ao navegar em sites em um dispositivo móvel.
A AMP enfatiza a velocidade instantânea e uma aparência familiarizada, dando aos criadores a capacidade de estilizar suas páginas na estrutura AMP. O design centralizado na maioria das páginas AMP dá uma sensação semelhante de navegação, apesar das diferenças na apresentação de conteúdo e nos esquemas de cores.
O resultado é uma experiência de navegação mais rápida e mais coesa, que melhora as taxas de desistência, aumenta o engajamento do leitor e introduz a navegação na web móvel como um dos principais elementos.
Com o poder e o potencial da AMP tão evidentes, é prático que os designers considerem as dicas abaixo para ajudar a otimizar a experiência da AMP, para que seus clientes se beneficiem de várias maneiras.
Faça uma impressão na página com a qual a maioria dos visitantes começará. O conteúdo estático pode ser exibido em AMP para mostrar produtos disponíveis, despertando interesse para sites de comércio eletrônico, bem como para aqueles que exibem conteúdo geral.
o Recurso de carrossel AMP permite que os designers exibam várias partes semelhantes de conteúdo em um eixo horizontal. Depois de importar o componente carrossel no cabeçalho, você pode utilizar type = ”carrossel” para mostrar uma lista de imagens, aparecendo como uma faixa contínua. É um recurso atraente que é ideal para a primeira página quando você está tentando atrair visitantes para ver algo além da página inicial.
Incentive os visitantes do site a aprofundar seu conteúdo. Você pode fazer isso mostrando uma lista de produtos ou posts relacionados ao que eles estão visualizando no momento. Você pode publicar estaticamente uma lista de conteúdo relevante, realizando-o instantaneamente usando
Se os visitantes inserirem uma página de destino que não esteja alinhada com suas solicitações, eles deixarão o site ou procure mais pelo que eles estão procurando . A sugestão de alternativas de produto é um excelente método para acomodar o processo de busca do usuário, no mínimo, atraindo-o mais para o site. Mesmo que não encontrem exatamente o que estão procurando, talvez encontrem uma alternativa que faça o trabalho da mesma maneira.
É importante para qualquer proprietário de site saber como os visitantes estão interagindo com o conteúdo. o
É importante ter em mente ao analisar as análises que, com o AMP, o cache inteligente é naturalmente incorporado. O resultado é que você pode ver menos tráfego do que o normal. Apenas mantenha o elemento de armazenamento em cache ao analisar seus números inicialmente.
Idealmente, os designers nunca conseguirão algo errado, mas isso pode acontecer. Para garantir que tudo esteja funcionando corretamente em uma página, use o validador integrado da AMP adicionando # development = 1 ao final do URL da página. Se você abrir as ferramentas de desenvolvimento do Chrome e vir a mensagem "Validação de AMP com êxito", tudo estará funcionando. Se não, você pode se aprofundar até que o problema seja resolvido. Você também pode usar as ferramentas de desenvolvimento do Chrome para verificar se todos os recursos externos, desde imagens e vídeos até fontes e iframes personalizados, são carregados corretamente.
Além disso, você pode validar metadados usando Ferramenta de teste de dados estruturados do Google , buscando uma URL ou inserindo um snippet de código. Essas ferramentas podem ajudar a garantir que tudo seja validado, portanto, o rastreamento do mecanismo de pesquisa é ativado. Na nota do rastreamento do mecanismo de pesquisa, verifique também o arquivo robots.txt para verificar se "Disallow: / amp /" não está presente em nenhuma linha. Se estiver lá, os rastreadores não poderão acessar seus arquivos AMP.
Outro benefício do AMP é uma estrutura preexistente para a implementação de anúncios. O componente amp-ad ou incorporado, é um contêiner para exibir um anúncio. Os anúncios são carregados ao lado de todos os outros recursos, com o
JavaScript é inexistente dentro do documento AMP. Em vez disso, o AMP carrega um iframe de uma caixa de proteção de iframe. Você pode definir os valores de largura e altura
Você também pode definir um espaço reservado ou uma opção para nenhum anúncio disponível, por meio do atributo de espaço reservado. Anúncios em vídeo também são possíveis com suporte nativo, com suporte completo a componentes de mídia .
As páginas para dispositivos móveis aceleradas ajudam a aumentar a visibilidade dos mecanismos de pesquisa entre os usuários de dispositivos móveis, especialmente agora que o Google está adotando páginas AMP em seus resultados de pesquisa.
Além disso, tempos de carregamento mais rápidos, personalização flexível e componentes visuais que buscam melhorar a taxa de rejeição proporcionam uma melhor experiência de usuário móvel do que nunca.
As páginas para dispositivos móveis aceleradas fornecem uma estrutura fantástica para o crescimento contínuo dos usuários da web para dispositivos móveis.