Code Menginstal AMP di WordPress
Apa itu AMP?
Oktober lalu, Google mengumumkan AMP sebagai inisiatif open source untuk menyediakan browsing web mobile yang lebih cepat. Seperti dijelaskan oleh TechCrunch, banyak yang melihat AMP sebagai upaya oleh Google untuk bersaing lebih baik dengan Instant Articles dari Facebook dan aplikasi mobile yang semakin memberikan browsing lebih cepat, lebih efisien. Saya cenderung setuju.
Halaman yang dioptimalkan dengan AMP akan muncul di carousel browsing mobile di bagian atas hasil pencarian Google, menggeser artikel HTML tradisional untuk lebih kebawah halaman. Dan mereka akan me-load hampir seketika.
Ketika saya bekerja di Microsoft, saya membantu meluncurkan MSN News pada tahun 1995 sebagai bagian dari MSN Online Network yang diluncurkan dengan Windows 95, jawaban Microsoft ke AOL. MSN News memerlukan sebuah aplikasi penampil kustom yang berjalan pada versi platform Media Viewer dari Microsoft, kerangka yang berupaya untuk telah diaktifkan konten CD mereka sebelumnya. Namun, dalam satu tahun, kami harus mempersiapkan untuk web kami dan penggabungan dengan NBC—yang kemudian menjadi MSNBC.com. Kami harus menyesuaikan kerangka penerbitan kami untuk menghasilkan Media View dan HTML secara bersamaan. Hal ini menciptakan beberapa kompleksitas yang baru.
AMP mengingatkan saya pada semua usaha-usaha tersebut. Ini sangat berbeda, sangat dibatasi versi HTML yang memerlukan perubahan besar ke situs Anda dan iklan apapun yang mungkin Anda gunakan.
Plugin AMP WordPress Gratis
Kabar baiknya adalah WordPress telah meluncurkan sebuah plugin AMP gratis yang akan membantu Anda menerapkan AMP tanpa banyak pengembangan tambahan. Namun, ia memiliki banyak keterbatasan. Desain situs Anda sangat dibatasi, dan ada konflik dengan plugin WordPress lainnya, teknik optimasi umum, dan banyak lagi. AMP juga akan menjadi beban tambahan bagi pengembang tema WordPress.AMP masih di masa perkembangannya, dan saya kecewa bahwa Google memilih untuk menciptakan sebuah kerangka yang sama sekali baru daripada bekerjasama dengan penerbit untuk mengoptimalkan HTML5 agar lebih cepat mengkonfigurasi bagaimana halaman harus di-load, apa yang harus di-load pertama, dan bagaimana untuk meletakkan teks dengan cepat. Ini akan menjadi pendekatan yang lebih mencerahkan. Tapi kemudian, tim Google adalah jenius.
Meskipun mengkhawatirkan saya, dalam tutorial ini saya akan memandu Anda menginstal plugin AMP untuk WordPress dan Yoast SEO Glue untuk plugin AMP, yang memberi Anda kontrol sedikit lebih banyak atas tampilan akhir situs Anda.
Bagaimana AMP Terlihat di WordPress?
Berikut adalah contoh dari halaman AMP dibandingkan dengan halaman HTML asli. Anda dapat menelusuri mereka secara dinamis, untuk yang asli dan di sini untuk versi AMP. Tentu saja, loading halaman jauh lebih cepat dengan AMP.Gambar dari Halaman HTML5 Asli di JeffReifman.com:
<head>, memberitahu mesin pencari bahwa versi halaman AMP tersedia.1 | <link rel="amphtml" href="http://jeffreifman.com/2016/01/28/a-new-business-model-for-twitter/amp/" /></head> |
1 |
Saya akan memandu Anda mengaktifkan AMP dengan WordPress.
Plugin WordPress AMP
Langsung pergi ke Plugins > Add New dan mencari AMP. Kemudian, klik Install Now:
/amp/. Sebagai contoh, posting Amazon Marketplace Fraud Made Easy adalah salah satu hasil pencarian Google saya paling populer. Berikut adalah apa yang tampak ketika Anda mengunjungi versi AMP di http://jeffreifman.com/2014/03/25/amazon-makes-fraud-easy-in-marketplace/amp/:
Perekat untuk Plugin Yoast SEO & AMP
Plugin generik AMP dari WordPress menawarkan beberapa penyesuaian. Orang-orang di Yoast SEO telah menciptakan add-on untuk plugin populer mereka yang lebih meningkatkan dukungan AMP Anda.
Anda dapat memodifikasi setelan AMP melalui menu sidebar Yoast SEO—klik AMP di bagian bawah menu:
Pertama, Yoast memungkinkan Anda untuk memperluas fungsi AMP ke halaman dan jenis halaman lain WordPress. Secara default AMP hanya mengubah posting yang sensitif terhadap waktu—hal ini dirancang terutama untuk artikel berita:
Kedua, Yoast menawarkan beberapa cara yang berguna untuk menyesuaikan branding, desain dan skema warna:
01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 | <amp-analytics type="googleanalytics" id="analytics1"><script type="application/json">{ "vars": { "account": "UA-xxxxxxxx-x" }, "triggers": { "trackPageview": { "on": "visible", "request": "pageview" } }}</script></amp-analytics> |
Secara keseluruhan, cukup sederhana untuk memulai ini. Tetapi tidak.
Debugging Kesalahan AMP
Beberapa hari setelah saya memasang AMP, saya menerima email yang ramah dari Google Search Console yang melaporkan 10 halaman dengan kesalahan. Yang sebenarnya, setiap posting AMP di situs saya rusak.
/amp#development=1 ke URL, seperti: http://jeffreifman.com/2014/02/24/how-to-secure-your-mac-from-potential-theft/amp/#development=1. Dan kemudian, buka konsol JavaScript di browser Anda:
</body>. AMP tidak mengijinkan ini, dan plugin AMP WordPress tidak mampu menyaringnya.1 | <script type="text/javascript" src="http://c4.jeffreifman.com/wp-content/cache/minify/000000/68b0b/default.include-footer.952e41.js?d4992f"></script></body> |
/amp/ (mungkin) atau jika saya harus mencari solusi lain. Menempatkan skrip ini kembali di <head> akan merusak Google Page Speed saya. Menariknya, saya juga baru saja menemukan bahwa menggunakan Google iklan DFP di situs saya juga merusak Google Page Speed. Google adalah master pencarian yang menantang, dan hal itu tidak membuatnya mudah untuk menggunakan semua teknologinya bersama-sama.Saya bertanya-tanya mana yang lebih penting: peringkat Google Page Speed, dukungan AMP, atau perkembangan saya dan waktu debugging.
Penutup
Terus terang, saya tidak yakin halaman AMP blog Anda akan pernah melihat cahaya di dekat bagian atas pencarian, atau saya yakin Anda akan berhasil mendapatkan banyak pendapatan dari mereka tanpa kustomisasi tambahan. Google tampaknya akan menyesuaikan AMP untuk penerbit media besar dengan sumber daya terbaik mengoptimalkan pandangan untuk merek, estetika dan pendapatan.Pada dasarnya, AMP adalah jalur dari web dioptimalkan berharga yang dipertanyakan bagi komunitas open-source, sementara Instant Articles dari Facebook adalah untuk kaum elit yang dipilih dari taman bertembok "besar". Saya lebih suka melihat Google membangun model loading yang diprioritaskan dalam HTML5 dengan skrip yang menyertainya.
Bagi saya, AMP hanya membuatnya lebih sulit bagi penerbit kecil untuk tetap relevan. Saya senang WordPress berupaya untuk membantu, dan saya yakin desainer tema juga, tapi masih banyak kekurangan. Saya pikir Google telah melewatkan tanda yang benar-benar membantu siapa pun kecuali penerbit web terbesar di sini.
Leave a Comment