Bagaimana Cara Membuat Accelerated Mobile Pages (AMP) di Blogger?
Tidak memanfaatkan lalu lintas mobile yang terus meningkat tampaknya itu mungkin akan tidak terlalu cerdas. Mungkinkah membuat blog AMP di Blogspot? Langkahnya ternyata cukup sederhana dan mudah. Ubah Blog Anda menjadi AMP dan tetap di atas Hasil Pencarian Google. Ikuti petunjuk Langkah demi Langkah. Selesaikan cepat dan kencangkan Blog kamu!
((
____; )
(6
Okay?
AMP Blogger - Kenapa tidak?
Itu untuk jawaban Google.
Kami memahami bahwa Accelerated Mobile Pages Project diluncurkan oleh Google untuk melawan Artikel Instan Facebook dan Berita Apple. Sementara teknologi yang digunakan oleh Facebook & Apple untuk menampilkan feed lebih cepat hanya untuk platform mereka, Google menggunakan framework open-source untuk digunakan oleh penerbit konten untuk menyajikan konten yang dibangun menggunakan AMP HTML.
Ini adalah berita besar untuk penerbit konten dan platform seperti Twitter, Pinterest dll.
Blogger adalah salah satu alat penerbitan blog paling awal yang dikreditkan untuk mempopulerkan format. Ini memberikan tampilan seluler dinamis untuk kompatibilitas blogging dengan perangkat seluler dan ponsel cerdas yang meningkatkan kemampuan keterbacaan pada perangkat cerdas ini.
Pembaca juga memang mengharapkan Blogger memiliki kemampuan pemuatan mobile yang dipercepat ini dengan diluncurkannya AMP. Tapi tidak! Belum Pasti kayaknya. AMP sekarang menjadi fitur yang paling diharapkan di Blogger Google.
AMP Blogspot - Mengapa tidak?
Jadi, apakah tidak mungkin membuat AMP Blogspot? Jawaban saya adalah - Mengapa tidak?
ChaklyRaflesia.blogspot.com adalah Accelerated Mobile Paged Blogspot.
Inilah pendekatan langkah demi langkah. Cara ini bisa digunakan untuk membuat Blog AMP blogspot yang baru. Sedikit pengetahuan coding sudah cukup - Langkah untuk membuat AMP Blogspot.
Apa itu AMP / Apa itu Halaman Mobile yang Terakreditasi?
AMP adalah cara untuk membangun halaman mobile untuk konten statis yang cepat.
Perpustakaan AMP JS memastikan rendering cepat halaman web AMP. Google memperkenalkan AMP dengan visi bahwa penerbit dapat membuat konten yang dioptimalkan untuk seluler satu kali dan memilikinya langsung dimuat di mana-mana.
Apa itu Google AMP Cache?
Google AMP Cache hanyalah jaringan pengiriman konten berbasis proxy yang mengirimkan semua dokumen AMP yang valid. Ini mengambil halaman HTML AMP, menyimpannya, dan memperbaiki kinerja halaman secara otomatis. The Google AMP Cache memuat dokumen, semua gambar dan file JS dari asal yang sama yaitu menggunakan HTTP 2.0 untuk memberikan efisiensi maksimum.
Mengapa tidak ada AMP di Blogger?
Meskipun Accelerated Mobile Pages adalah proyek yang didukung Google dan Blogspot adalah platform blogging Google, "Blogger saat ini tidak mendukung AMP HTML." Jadi itu yang bisa dijawab Google. Tapi kita tidak bisa membiarkannya seperti itu, bukan? Jadi ikuti langkah-langkah ini dan buat Blog AMP baru Anda.
Bagaimana cara mengimplementasikan Blog Blogger AMP?
Naah inilah yang pastinya sedang kita tunggu-tunggu, Jadi Perhatikan dan mulailah bekerja untuk membuat Blog kamu menjadi lebih baik!
((
____; )
((
Langkah 1:
Ganti kode <html> dengan kode berikut:
<html amp='amp'>
Langkah 2:
Periksa untuk tag meta charset dan viewport. Jika tidak ada, copy dan paste kode berikut setelah <head>.
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
Langkah 3:
Jadikan blog Anda mudah ditemukan menggunakan tag kanonik. Periksa untuk tag link kanonik. Jika tidak hadir, tambahkan link kanonik seperti <link rel = "canonical" href = "http://example.blogspot.in/article-metadata.html" /> yang hanya akan menunjuk pada dirinya sendiri. Copy dan paste kode berikut setelah tag viewport.
<link expr:href='data:blog.url' rel='canonical'/>
Langkah 4:
Ganti kode </ head> dengan kode berikut:
<style amp-boilerplate='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='amp-boilerplate'>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
<script async='async' src='https://cdn.ampproject.org/v0.js'></script>
</head>
Langkah 5:
Ubah tag img menjadi tag amp-img seperti contoh berikut:
<amp-img src="AmpImage.jpg" alt="amp-img" height="500" width="500"></amp-img>
Bagaimana cara memeriksa validitas halaman AMP?
Metode 1:
Buka halaman AMP Anda di browser Chrome, misalnya - https://example.blogspot.in/p/amp-page.html .
Tambahkan "# development = 1" ke URL, misalnya - https://example.blogspot.in/p/amp-page.html#development=1 .
Klik kanan dan buka konsol Chrome DevTools dan periksa kesalahan validasi.
Metode 2:
Buka antarmuka web di validator.ampproject.org.
Masukkan nilai url ke kolom URL, misalnya -
https://example.blogspot.in/p/amp-page.html .
Setiap perubahan pada sumber html yang dibuat dalam hasil editor interaktif ini adalah revalidation interaktif.