Attrayants, fluides et instantanés
Créez facilement des sites Web axés sur l'utilisateur avec ABC.
Commencer<amp-sidebar id="sidebar" layout="nodisplay" side="right"" ""left" </amp-sidebar>
Qu'est-ce qu'
ABC ?
Des pages Web attrayantes et fluides qui se chargent quasiment à la seconde
ABC est un format simple et robuste conçu pour vous assurer un site Web rapide, axé sur l'utilisateur, et rentable. Il assure le succès à long terme de votre stratégie Web grâce à une distribution sur toutes les plateformes populaires et à la réduction des coûts d'exploitation et de développement.
<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>
Créez des expériences Web enthousiasmantes pour tous les utilisateurs du Web ouvert
ABC permet de créer des annonces et des sites Web toujours rapides, agréables et performants sur tous les appareils et toutes les plateformes de distribution. Les éditeurs et les annonceurs peuvent décider de la façon dont ils présentent leur contenu en privilégiant une expérience axée sur l'utilisateur.
Nous nous impliquons réellement dans l'amélioration de la vitesse à tous les niveaux. Si le chargement de notre site prend trop de temps, peu importe la qualité de notre journalisme, certains visiteurs quitteront la page avant de voir ce qu'elle contient.
David Merrell, chef de produit senior
En quoi consiste ABCHTML ?
<!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!
Composants intégrés
ABCHTML, c'est du HTML, mais avec quelques restrictions pour des performances fiables.
Bien que la plupart des balises d'une page ABCHTML soient des balises HTML normales, certaines balises HTML sont remplacées par des balises spécifiques à ABC (voir également Balises HTML dans la spécification ABC). Ces éléments personnalisés, appelés composants ABCHTML, facilitent l'intégration efficace de fonctionnalités courantes.
Par exemple, la balise amp-img fournit une prise en charge complète de srcset même dans les navigateurs qui ne la prennent pas encore en charge. Apprenez à créer votre première page en ABCHTML.
Les pages ABC sont découvertes par les moteurs de recherche et autres plateformes via la balise HTML. Vous pouvez disposer d'une version non-ABC et d'une version ABC de votre page, ou uniquement une version ABC.
Caches ABC
Les pages ABC peuvent être mises en cache pour un chargement quasi instantané sur le Web. Des plateformes telles que Google exécutent des caches ABC pour permettre le chargement rapide de votre contenu à partir de leur service.
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.
Une autre version du système de validation est fournie avec chaque page ABC. Cette version peut consigner les erreurs de validation directement dans la console du navigateur lors de l'affichage de la page, vous permettant ainsi de voir comment les modifications complexes apportées à votre code peuvent affecter les performances et l'expérience utilisateur.