Saat ini Google telah meluncurkan Accelerated Mobile Pages atau yang biasa kita kenal dengan sebutan AMP dalam hasil penelusuran selulernya, namun bagaimana dengan sobat? Apakah sudah menerapkan Accelerated Mobile Pages (AMP) pada blog atau pun website sobat?
Proyek Google Accelerated Mobile Pages (AMP) sudah diluncurkan beberapa waktu lalu di Indonesia . Namun hingga saat ini apakah sobat sudah siapkan support Accelerated Mobile Pages untuk blog ataupun website sobat? Pada kesempatan kali ini saya akan memberikan ikhtisar tentang penawaran dan menunjukkan cara memulai dengan Google Accelerated Mobile Pages.
Sejak Oktober 2015 yang lalu, tim Google telah mengumumkan Accelerated Mobile Pages (AMP), kerangka kerja yang sangat mudah diakses untuk membuat halaman web mobile yang memuat dengan cepat. Prakarsa open-source dirancang untuk memungkinkan penayang meningkatkan kecepatan dengan mudah.
Berikut Cara Kerja AMP
- AMP HTML: Subset HTML, bahasa markup ini memiliki beberapa tag dan properti khusus dan banyak batasan. Tapi jika sobat terbiasa dengan HTML biasa, sobat seharusnya tidak akan mengalami kesulitan dalam mengadaptasi halaman yang ada ke AMP HTML. Untuk detail lebih lanjut tentang bagaimana hal itu berbeda dari HTML dasar, lihat daftar markup markup AMP Project yang harus dimiliki "halaman AMP HTML" sobat.
- AMP JS: Kerangka JavaScript untuk halaman mobile. Untuk sebagian besar, ia mengelola penanganan sumber daya dan pemuatan asinkron. Perlu dicatat bahwa JavaScript pihak ketiga tidak diizinkan dengan AMP.
- AMP CDN: Jaringan Pengiriman Konten opsional, akan membawa halaman AMP-enabled Anda, menyimpannya dan secara otomatis melakukan beberapa pengoptimalan kinerja.
Lalu Bagaimana Apakah Situs Sobat Sudah Valid AMP?
Sebagai permulaan seperti saya ini, sobat harus mempertahankan setidaknya dua versi dari setiap halaman artikel: Versi asli dari halaman artikel sobat yang biasanya pengguna lihat, dan versi AMP dari halaman itu.Karena AMP tidak mengizinkan hal-hal seperti elemen formulir dan JavaScript pihak ketiga, kemungkinan sobat tidak akan dapat memiliki formulir utama, komentar di halaman dan beberapa elemen lain yang mungkin sobat gunakan untuk memiliki halaman sobat dalam penerapan standar.
Hal ini juga kemungkinan bahwa sobat harus mendisain ulang template situs sobat untuk mengakomodasi batasan. Misalnya, semua CSS di AMP harus in-line dan kurang dari 50KB. Karena pemuatan-intensif font custom dan itu harus dimuat menggunakan ekstensi amp-font khusus, untuk lebih mengontrol pemuatan.
Multimedia harus ditangani secara khusus. Misalnya, gambar perlu memanfaatkan elemen img img dan harus menyertakan lebar dan tinggi eksplisit. (Saat mengubah situs web warisan ke template AMP, ini bisa menjadi masalah besar jika atribut lebar dan tinggi belum digunakan). Selain itu, jika gambar sobat adalah animasi GIF, sobat perlu menggunakan komponen perpanjangan amp-anim terpisah .
Seperti gambar, ada tag khusus yang harus digunakan untuk menyematkan video yang dihosting secara lokal melalui HTML5, yang disebut amp-video. Untuk menyematkan video YouTube, namun yang sebagian besar video web ada komponen tambahan terpisah, amp-youtube .
Ada juga dukungan untuk hal-hal seperti tayangan slide melalui kotak suara amp-carousel dan gambar melalui lightbox gambar-gambar, serta media sosial menyematkan Twitter, Instagram, Facebook, Pinterest and Vine melalui komponen extended mereka sendiri.
Tag dan komponen tambahan ini tidak sulit untuk digunakan; Mereka hanya memerlukan beberapa perencanaan dalam desain situs sobat.
Agar Google (dan teknologi lainnya mendukung Proyek AMP) untuk mendeteksi versi AMP dari artikel sobat, sobat perlu memodifikasi versi asli dari halaman artikel. Halaman artikel asli harus menyertakan tag berikut, yang pada dasarnya merupakan tag kanonik untuk halaman AMP:
<link rel="amphtml" href="http://www.example.com/blog-post/amp/">
Beberapa platform yang mendukung AMP akan memerlukan data meta Schema.org untuk menentukan jenis konten halaman. (Saat ini, "article", "recipe", "review" dan "video" tercantum sebagai contoh jenis halaman di GitHub.)
Selain itu, ini juga menunjukkan bahwa data metadata Schema.org "adalah persyaratan untuk membuat konten sobat layak muncul dalam demo korsel berita Google Penelusuran." Jadi, jika sobat mencoba mendapatkan manfaat masa depan dari Google dengan menerapkan AMP, Pastikan sobat mendapatkan skema dengan benar.
Apa yang akan terlihat seperti AMP di google?
Google telah menyediakan demo seperti apa fitur AMP di SERP. Sobat dapat mencobanya dengan menavigasi ke g.co/ampdemo di ponsel sobat (atau menirunya di dalam Alat Pengembang Chrome). Kemudian, cari sesuatu seperti "Mars." sobat akan melihat sebuah korsel menuju bagian atas dengan artikel AMP.Klik satu untuk pengalaman membaca yang disematkan di SERP. Sobat dapat menggesek ke kanan atau ke kiri untuk membaca artikel AMP-enabled lainnya. Ini adalah pengalaman yang berbeda dari sekadar navigasi ke halaman AMP penerbit.
Beberapa penerbit besar dapat ditemukan di dalam demo, seperti The Guardian dan The Washington Post. Itulah Bagaimana untuk memulai dengan akselerasi halaman Mobile (AMP) yang dapat saya ulas pada kesempatan kali ini.
Sumber: Search Engine Land