Cara Membuat Template ( AMP ) Accelerated Mobile Pages
Ada yang mau lihat lihat koleksi atau membeli KAOS DAKWAH atau KAOS DISTRO bisa di lihat stok nya di GHIRAH
Accelerated Mobile Pages adalah sebuah framework yang dirancang khusus untuk memudahkan developer membuat sebuah halaman web yang dapat diakses dengan cepat diperangkat mobile.


Visi dari Accelerated Mobile Pages adalah agar webmaster bisa merancang halaman web yang loading cepat, tanpa banyak pengaruh JS atau lainnya. AMPHTML memprioritaskan pengguna Web Mobile.
Komponen AMP sebagai berikut :

PERTAMA AMP HTML

Sebuah subset HTML, bahasa markup ini memiliki beberapa custom tags, properti dan terdapat banyak pembatasan-pembatasan didalamnya dibandingkan dengan HTML biasa. Jika Anda sudah familiar dengan HTML biasa tidak sulit untuk membuat halaman web dengan AMP HTML.

KEDUA AMP JS

Framework JavaScript untuk meningkatkan kinerja halaman web untuk perangkat mobile. Sebagian besar penggunaannya adalah dengan metode loading asynchronous. Perlu dicatat bahwa JavaScript dari pihak ketiga tidak dapat berjalan dengan AMP. Contoh penggunaannya dapat dilihat berikut ini:

<script async src="https://cdn.ampproject.org/v0.js"></script>

KETIGA AMP CDN

CDN (Content Delivery Network), akan mengambil halaman AMP Anda lalu menyimpannya dalam cache mereka dan secara otomatis meningkatkan optimasi beberapa kinerja web Anda.

Template AMP

<!doctype html>
<html amp lang="en">
  <head>
    <meta charset="utf-8">
    <title>Hello, AMPs</title>
    <link rel="canonical" href="http://example.ampproject.org/article-metadata.html" />
    <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
    <script type="application/ld+json">
      {
        "@context": "http://schema.org",
        "@type": "NewsArticle",
        "headline": "Open-source framework for publishing content",
        "datePublished": "2015-10-07T12:02:41Z",
        "image": [
          "logo.jpg"
        ]
      }
    </script>
    <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>
  </head>
  <body>
    <h1>Welcome to the mobile web</h1>
  </body>
</html>

Tutorial Selengkapnya langsung kesini www.ampproject.org atau disini github.com/ampproject/amphtml
Axact

KAOS DISTRO

KAOS DISTRO adalah blog membahas tentang cara pembuatan Kaos Distro sampai bagaimana cara menjual Kaos Distro Online maupun offline, Silakan cari arti www.kaosdistro.web.id..Terima Kasih telah berkunjung di blog sederhana ini, Jika antum PRODUSEN KAOS DISTRO MAU KERJASAMA SILAKAN KONTAK NO TLP YANG ADA DI WWW.KAOSDISTRO.WEB.ID

Post A Comment:

0 comments: