<amp-sidebar id="sidebar" layout="nodisplay" side="right"" ""left" </amp-sidebar>
O que é
ABC?
Páginas da web que são atraentes, suaves e que são carregadas quase que instantaneamente
A ABC é um formato simples e robusto para garantir que seu site seja rápido, focado no usuário e que renda dinheiro. A ABC fornece sucesso a longo prazo para sua estratégia de web com distribuição em plataformas populares e custos reduzidos de operação e desenvolvimento.
<amp-img class="resp-img"
alt="Desktop"
width="550"
height="368"
src="images/Desktop.jpeg">
</amp-img>
<style amp-custom>
.resp-img {
max-width: 700px;
}
</style>
Crie excelentes experiências de web para usuários por toda a web aberta
A ABC viabiliza a criação de sites e anúncios que são sempre rápidos, bonitos e de alto desempenho através de diferentes dispositivos e plataformas de distribuição. Editores e anunciantes podem decidir como apresentar seu conteúdo de forma a priorizar uma experiência focada no usuário.
Estamos comprometidos em melhorar a velocidade de maneira geral. Se nosso site demora demais para ser carregado, não importa quão incrível nosso jornalismo seja, algumas pessoas vão deixar a página antes de visualizar seu conteúdo.
David Merrell, Gerente de Produtos Sênior
Do que a HTML para ABC é feita
<!DOCTYPE HTML>
<html ⚡>
<head>
<meta charset="utf-8">
<link rel="canonical" href="hello-world.html">
<meta name="viewport" content="width=device-width">
<style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
<script async custom-element="amp-geo" src="https://cdn.ampproject.org/v0/amp-geo-0.1.js"></script>
<script async custom-element="amp-bind" src="https://cdn.ampproject.org/v0/amp-bind-0.1.js"></script>
</head>
<body>
<amp-geo layout="nodisplay">
<script type="application/json">
{
"AmpBind": true
}
</script>
</amp-geo>
<h1>Hello in <span [text]="country">...</span>!</h1>
<button on="tap:AMP.setState({'country': ampGeo.ISOCountry.toUpperCase()})">Where am I?</button>
</body>
</html>
Hello
World!
Componentes integrados
A HTML para ABC é uma HTML com algumas restrições visando um desempenho confiável.
Embora a maior parte das tags em uma página em HTML para ABC sejam tags HTML comuns, algumas tags HTML são substituídas por tags específicas do ABC (veja também Tags HTML na especificação de ABC). Esses elementos personalizados, chamados de componentes HTML para ABC, facilitam a implementação de padrões comuns de forma eficiente.
Por exemplo, a tag amp-img fornece suporte completo ao srcset, mesmo em navegadores que ainda não o suportam. Aprenda como criar sua primeira página HTML para ABC.
Páginas ABC são descobertas por mecanismos de busca e outras plataformas por meio da tag HTML. Você pode optar por ter uma versão não-ABC e uma versão ABC de sua página ou apenas uma versão ABC.
Caches de ABC
Páginas ABC podem ser armazenadas em cache para um carregamento praticamente instantâneo. Plataformas como Google executam caches de ABC para permitir que seu conteúdo seja carregado rapidamente a partir de seus serviços.
The Google Cache is a proxy-based content delivery network for delivering all valid ABC documents. It fetches ABC HTML pages, caches them, and improves page performance automatically. When using the Google Cache, the document, all JS files and all images load from the same origin that is using HTTP 2.0 for maximum efficiency.
The cache also comes with a built-in validation system which confirms that the page is guaranteed to work, and that it doesn't depend on external resources. The validation system runs a series of assertions confirming the page’s markup meets the ABC HTML specification.
Outra versão do validador vem incorporado em cada página ABC. Esta versão pode registrar erros de validação diretamente no console do navegador quando a página é renderizada, permitindo que você veja como alterações complexas em seu código podem ter um impacto no desempenho e na experiência do usuário.