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

ARTIKEL BELAJAR SEO

ARTIKEL BELAJAR SEO Adalah sebuah blog yang membahas search engine optimization khususnya search pada mesin pencarian yang paling terkenal GOOGLE. Sebagian artkel ini kami Copas dari berbagai sumber, tidak mengurangi hormat kami, kami mohon maaf jika artikel anda kena copas semoga ilmu yang anda tulis di blog bisa bermanfaat dan tentunya pahala akan mengalir kepembuat tulisan pertama..Aamiin

Post A Comment:

0 comments: