Cara Mengatur Google AMP Pada Blog atau Web
Saya adalah pengguna Google Blogger dan ini adalah tempat yang sangat menakjubkan bagi pemula untuk memulai. Beberapa Blog saya masih di Blogspot. Semua orang berdengung tentang AMP dan brilian jika Anda berbicara dalam arti halaman web mobile memuat kecepatan. Ini telah membawa pemuatan halaman ke tingkat yang baru.
Saya telah menulis posting tentang Accelerated Mobile Pages dan banyak orang bertanya kepada saya dan bahkan hasil pencariannya di isi dengan kata kunci seperti "bagaimana menggunakan google amp di blogger" dan "google amp wiki". Jadi saya akhirnya memutuskan untuk menulis panduan yang mudah untuk setup Google AMP di Blogspot atau Blogger.
Tetapi sebelum ketahap berikutnya saya akan menjelaskan beberapa hal yang berkaitan dengan AMP (Accelerated Mobile Pages ) ini.
Apa itu Google AMP
AMP adalah singkatan dari Accelerated Mobile Pages. Ini adalah proyek baru oleh Google untuk membuat laman web seluler untuk konten statis yang dirender dengan cepat. Halaman AMP menggunakan AMP HTML, AMP JS, dan AMP CDN untuk memproses dan mengirimkan halaman web ringan dengan kecepatan kilat.
Google memperkenalkan AMP dengan visi bahwa penerbit dapat membuat konten yang dioptimalkan untuk seluler satu kali dan memilikinya langsung dimuat di mana-mana.
AMP Blogger - Mengapa Tidak?
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.
ini 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.
Kami memang mengharapkan Blogger memiliki kemampuan pemuatan mobile yang dipercepat ini dengan diluncurkannya AMP. Tapi tidak! Belum atleast. 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?
Platform blogger dan WordPress pun bisa, Inilah pendekatan langkah demi langkah. Cara ini bisa digunakan untuk membuat Blog AMP blogspot yang baru.
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 Blogger AMP
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 Menggunakan AMP Pada Blogger Blog
AMP Blogspot - Mengapa Tidak
Jadi, apakah tidak mungkin membuat AMP Blogspot? Jawaban saya adalah - Mengapa tidak?
Platform blogger dan WordPress pun bisa, Inilah pendekatan langkah demi langkah. Cara ini bisa digunakan untuk membuat Blog AMP blogspot yang baru.
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 Blogger AMP
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 Menggunakan AMP Pada Blogger Blog
Sebelum anda memulai tutorial dibawah kami sarankan supaya anda backup template blogger anda dlu. Mari kita mulai satu per satu. Sekarang PergiDasbor Blogger Anda - Template - Edit Template, Kemudian ikuti petunjuk dibawah ini.
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
Tempel kode ini tepat di atas tag </ head>:
<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.
Saya harap ini akan membantu Anda. Accelerated Mobile Pages adalah proyek yang didukung Google dan Blogspot adalah platform blogging Google tapi Blogger masih belum mendukung AMP.
Jadi kita tidak bisa menunggu mereka dan kita bahkan tidak tahu kapan mereka akan mulai mendukungnya. Jadi gunakan trik dan tweak untuk menambahkan dukungan AMP di situs blogger. Jika Anda menghadapi masalah maka komentar di bawah ini. Share keteman anda sepaya mereka tahu bagaimana cara menggunakan AMP dengan benar.
0 Response to "Cara Mengatur Google AMP Pada Blog atau Web"
Post a Comment