AMP Google: Panduan Menyenangkan dan Ramah Pengguna untuk Accelerated Mobile Pages

Tonton videonya. Abaikan salinannya.

Itulah saran saya kepada Anda setelah Anda membuka situs Google yang didedikasikan untuk Proyek Accelerated Mobile Pages (AMP) baru:

“Proyek Accelerated Mobile Pages (AMP) adalah inisiatif sumber terbuka yang mewujudkan visi bahwa penerbit dapat membuat konten yang dioptimalkan untuk seluler sekali dan memuatnya langsung di mana saja.”

Jika Anda bukan seorang pengembang dan Anda membaca salinannya, Anda akan ditelan hidup-hidup oleh jargon.

Tonton videonya, bagaimanapun, dan Anda akan segera memahami apa itu AMP (belum lagi referensi Spinal Tap yang lucu, lihat di bawah).

Atau Anda bisa membaca panduan ini karena ini akan menjadi yang paling menyenangkan yang pernah Anda baca tentang AMP dan bagaimana pengaruhnya terhadap pemasaran konten Anda.

Saya berjanji.

Apa itu Proyek AMP Google?

Sejak lahirnya filosofi Zero Moment of Truth dari Google pada tahun 2011, bukan rahasia lagi bahwa mereka ingin "secara dramatis meningkatkan kinerja web seluler".

Dan saya mungkin tidak perlu memberi tahu Anda bahwa ada masalah kecil dengan kinerja konten di web seluler.

Kemungkinannya adalah, Anda memiliki perangkat seluler. Dan kemungkinan besar Anda telah mengklik link pada perangkat tersebut dari halaman hasil pencarian, situs media sosial, atau di dalam kotak masuk email Anda… ingin sekali mengonsumsi konten tersebut.

Tapi itu tidak pernah datang.

Ya, itu datang, tetapi dalam tambal sulam yang mengejutkan dari gambar, video, dan iklan yang tersendat-sendat saat halaman dimuat. Anda melihat dengan ngeri, mata melebar, berputar-putar di kursi kereta bawah tanah Anda seperti seseorang yang harus pergi ke kamar mandi.

“Berapa lama ini akan berlangsung?” Anda tidak berteriak kepada siapa pun secara khusus.

Siapa tahu, tetapi Anda tidak akan pernah mengetahuinya karena, seperti 40 persen dari populasi, Anda akan menebus halaman pemuatan dalam waktu 3 detik. Kemudian Anda akan berkata, seperti kucing hitam saya Apollo Monkeystrap, "Le sigh."

Momen seluler yang tidak tertahankan seperti inilah yang ingin dihilangkan Google dengan AMP.

Seberapa cepat AMP membuat halaman Anda?

Pada skala dari 1 sampai 10, dengan satu "tidak memuat sama sekali" dan sepuluh "memuat dalam satu detik," konten AMP akan memuat dengan kecepatan halaman 11. (Itu referensi Spinal Tap yang saya peringatkan kepada Anda).

Tapi serius, seberapa cepat?

Jon Parise, insinyur perangkat lunak di Pinterest, berkata, "Halaman Seluler yang Dipercepat memuat empat kali lebih cepat dan menggunakan data delapan kali lebih sedikit daripada halaman tradisional yang dioptimalkan untuk seluler."

Empat kali lebih cepat itu bagus! Tapi apa artinya itu bagi Anda, komuter kereta bawah tanah kami yang ramah mencoba mengunduh halaman web di ponselnya?

Menurut NiemanLab, artikel AMP yang dioptimalkan New York Times diunduh sepenuhnya di ponsel dalam 2,99 detik. Sebagai perbandingan, dalam pengujian di Chrome pada iMac cepat, versi desktop halaman tersebut membutuhkan waktu 3,82 detik (versi seluler lebih cepat).

Jika Anda tidak menyadarinya, NYTimes.com terkenal sebagai salah satu situs web berita seluler yang memuat paling lambat di sisi Saturnus ini.

Mereka telah memperbaikinya.

Apakah Anda yakin itu cukup cepat?

Tapi tunggu, katamu, 2,99 detik masih di atas rentang waktu yang bersedia ditunggu oleh komuter kereta bawah tanah kami. Dia, seperti 40 persen dari populasi, memberikan jaminan dalam waktu 3 detik. 2,99 detik hampir selesai! Itu tidak banyak perbaikan.

Benar, tetapi perbedaannya adalah pada skenario non-AMP pertama di desktop, halaman masih dimuat setelah 3 detik. Dalam skenario versi AMP, itu sepenuhnya diunduh di 2.99.

Lebih penting lagi, versi AMP mencapai "domContentLoaded - titik kunci dalam pemuatan halaman web tempat HTML diunduh sepenuhnya dan penguraian penting tertentu telah diselesaikan" dalam 0,857 detik.

Kedipan mata membutuhkan waktu sekitar 0,33 detik.

Dengan kata lain, kedipkan mata dua kali dan Anda, komuter kereta bawah tanah kami, dapat mulai membaca bagian konten yang bermanfaat hampir secara instan, berkat AMP.

Apa yang membuat laman seluler tradisional dimuat dengan sangat lambat?

Saya rasa saya tahu, tetapi karena saya bukan pengembang, perancang, atau pemrogram (dan bahkan tidak yakin apakah itu disiplin ilmu yang berbeda), saya menghubungi salah satu pengembang kami di Rainmaker Digital, Mike Hale, untuk membantu saya menerjemahkan.

Mike mengatakan bahwa saat situs desktop ditarik ke browser seluler, Anda mendapatkan beberapa lusinan paket informasi yang "dipanggil", sering kali dari host yang berbeda, ke browser seluler.

Dalam contoh New York Times yang lama dan lambat di atas, satu artikel dapat berisi "192 permintaan, beberapa ke host Times, sebagian besar ke server lain yang menghosting sejumlah skrip".

Bagian yang paling berguna akan diunduh dalam 5 detik setelah Anda mengeklik, tetapi sisanya masih masuk, itulah sebabnya layar memantul saat peramban disetel dan kemudian disetel ulang.

Masih tersesat, saya mendesak Mike, “Tapi hal apa yang diminta ?! Apa namanya ?! ”

Mike memberi tahu saya bahwa ponsel Anda dapat memanggil skrip untuk plugin sosial, carousel gambar, SlideShares, dan video. Dan kemudian mungkin ada perangkat lunak analitik, iklan, dan skrip pelacakan yang berjalan di latar belakang.

Hal-hal sehari-hari yang masuk akal, tetapi mereka bertambah. Dan cepat.

Masalahnya adalah perangkat seluler Anda tidak memiliki kekuatan pemrosesan untuk melakukan ini dengan cepat.

Ilustrasi ini menjelaskan masalah dengan konten seluler

Bayangkan jika Anda pergi ke bank, berjalan ke kasir dan meminta $ 100, tetapi dengan urutan yang aneh: lima belas lembar satu dolar, tiga lembar lima dolar, lima lembar sepuluh dolar, dan satu lembar dua puluh dolar.

Jika bank beroperasi seperti web seluler sekarang, kasir akan melakukan beberapa perjalanan untuk memberi Anda setiap tagihan secara terpisah.

Setiap perjalanan itu disebut "panggilan".

Namun, jika bank dioptimalkan dengan AMP, teller akan memberi Anda semua tagihan Anda sekaligus. Selain itu, dia mungkin akan mengabaikan permintaan khusus Anda untuk tagihan tertentu dan hanya mengirimkan tagihan seratus dolar.

AMP bertujuan untuk menyederhanakan permintaan yang harus dibuat browser.

“Satu-satunya skrip yang dapat Anda panggil adalah JavaScript AMP,” kata Mike. “Semuanya dibungkus dalam satu bundel. Aku menyerahkan semuanya kepadamu sekaligus. ”

Dan inilah cara Yoast mendeskripsikan konten seluler AMP:

“Mari kita bandingkan ini dengan mobil balap. Jika Anda ingin membuat sebuah mobil balap lebih cepat, Anda memberinya mesin yang lebih cepat dan Anda melepaskan semua beratnya. Dalam weight stripping ini, Anda juga menghilangkan hal-hal seperti kursi belakang, AC, dll. AMP tidak berbeda dengan itu. Ini adalah versi web normal yang dipangkas, karena Google lebih memperhatikan kecepatan daripada fitur-fitur bagus. ”

Rasakan kepahitan itu di baris terakhir? Itu bukan imajinasimu. Kita akan membahasnya sebentar lagi. Pertama, mari kita lihat pengalaman AMP untuk membantu Anda memahami maksud saya.

Seperti apa tampilan konten seluler yang dioptimalkan AMP?

Untungnya, Anda dapat menguji demo konten berita AMP.

1. Keluarkan smartphone Anda.
2. Buka browser (browser apa saja).
3. Ketik g.co/ampdemo.
4. Ketik frasa kata kunci populer seperti "Ulang Tahun Justin Bieber", "Jennifer Lawrence", atau "Yoko Ono" ke dalam kotak pencarian Google.
5. Tekan "Kirim".

Ini adalah contoh bagaimana hasilnya akan terlihat:

Seperti yang Anda lihat, konten AMP mendapatkan tagihan teratas. Letaknya di korsel yang berada di paro atas. Entri standar ada di bawahnya.

Anda dapat menggulir melalui korsel itu dan ketika Anda menemukan artikel bertenaga AMP yang Anda suka, klik di atasnya. Beginilah tampilannya:

Bacaan yang menyenangkan, eh!

Mengapa Google melakukan ini, dan apakah Anda harus peduli? (Semacam)

Di sinilah menjadi aneh.

Seperti yang saya sebutkan di atas, Google telah terobsesi dengan pengoptimalan kinerja web seluler selama lima tahun terakhir, itulah sebabnya kami telah menulis tentang pentingnya kecepatan situs web yang sangat cepat (ada enam alat untuk menguji kecepatan situs Anda dalam artikel itu, omong-omong) selama itu.

Itu sebabnya kami memperingatkan Anda tahun lalu tentang Pembaruan Seluler Google, “Mobilegeddon.”

Jadi, pada titik ini, AMP adalah semacam puncak dari fokus Google pada pengoptimalan web seluler, tetapi bagaimana hal itu membantu penerbit?

Kedengarannya sederhana, tetapi Google berpikir: Pengguna menyukai konten. Mereka menyukai konten yang cepat. Semakin cepat Anda menyajikan konten dengan cepat, semakin banyak konten yang dapat dikonsumsi.

Namun, ada hal lain dari langkah ini: Google mencoba memenangkan perang konsumsi berita.

Apa perbedaan AMP dari Artikel Instan dan Apple News?

Tahun lalu, Apple dan Facebook meluncurkan aplikasi yang memungkinkan pengguna membaca artikel berita: Apple News dan Instant Articles.

Kedua aplikasi ini adalah produk yang berdiri sendiri.

Christian Cantrell, Senior Experience Development Engineer di tim XD Adobe, menulis di Smashing Magazine, "Mereka pada dasarnya adalah agregator berita mewah dengan perender khusus yang dibangun di atas format sindikasi berpemilik."

Dengan kata lain, Artikel Instan dan Apple News adalah RSS yang lahir kembali.

Google, di sisi lain, berusaha untuk langsung menghubungi penerbit dan membuat mereka mengoptimalkan konten seluler untuk konsumsi di web terbuka, yang memungkinkan entri yang mudah dan distribusi yang mudah, sesuatu yang tidak dapat Anda dapatkan di aplikasi.

Sejauh ini, beberapa penerbit berita ternama telah ambil bagian:

• Time Inc.
• Atlantik
• Suara
• BBC
• The Huffington Post

Sejumlah perusahaan teknologi seperti WordPress, Twitter, Adobe Analytics, Chartbeat, LinkedIn, dan Pinterest juga bergabung.

Dua keluhan umum tentang AMP

Keluhan datang setidaknya dalam dua jenis:

1. Para pencela membenci pembatasan tentang apa yang dapat dilakukan konten seluler.
2. Para pencela menyesali bahwa penerbit kecil akan dihukum.

Yoast termasuk dalam kategori pertama. Joost de Valk menulis, “AMP membatasi apa yang dapat Anda lakukan di halaman HTML. Desain mewah dihilangkan demi kecepatan. AMP lebih merupakan fungsi dari proyek formulir. "

Ketahuilah bahwa bukan hanya tampilan yang terpengaruh - di luar kotak, AMP tidak mendukung formulir, yang berarti halaman AMP tidak akan membantu Anda mengembangkan daftar email. Ada solusi teknis yang tersedia, tetapi situasinya masih terlalu baru untuk melihat bagaimana solusi tersebut akan berkembang.

Anda akan melihat sebagian besar penerbit besar menggunakan AMP, tetapi apakah itu berarti AMP akan merugikan penerbit kecil?

Paul Shapiro dari Search Engine Land mengatakan ini:

“Meskipun pengembang berpengalaman sering kali dapat mencapai hasil yang sama melalui pengoptimalan kinerja yang intensif, penerbit sering mengabaikan ini karena keterbatasan sumber daya. AMP memungkinkan pengoptimalan ini dicapai dengan mudah tanpa mengubah pengalaman web seluler utama. "

AMP mungkin terbukti menjadi alat yang solid untuk mengoptimalkan pengalaman seluler. Jadi, haruskah Anda melakukan AMP?

Siapa yang harus khawatir tentang AMP?

Tergantung.

• Apakah Anda penerbit besar berita? Kemudian panik, kecuali Anda sudah memiliki strategi yang solid untuk pengalaman pengguna seluler. Yang seharusnya sudah Anda miliki beberapa bulan yang lalu, tapi hei.
• Apakah Anda mendapatkan sumber lalu lintas yang signifikan dari seluler? Sekali lagi, Anda perlu memastikan strategi pengalaman seluler Anda kokoh. Anda mungkin ingin menonton dan melihat bagaimana AMP berkembang, tetapi mungkin perlu dilakukan beberapa eksperimen.
• Apakah Anda berada di pasar baru tanpa banyak persaingan? Pastikan untuk mengoptimalkan konten seluler Anda dalam 30 hari ke depan, tetapi jangan panik.
• Tidak cocok dengan salah satu kategori di atas? Kemudian duduklah di tangan Anda dan pantau apa yang terjadi.

“Pasti sesuatu yang harus diperhatikan penerbit,” kata Chief Product Officer dan pendiri StudioPress Brian Gardner kepada saya. "Tapi tebakanku, ini akan menjadi kesepakatan yang berubah-ubah untuk beberapa waktu."

Siapa tahu? Mungkin ada cara yang lebih mudah untuk melakukan semua ini di masa mendatang - sesuatu yang Jake Goldman, presiden dan pendiri 10up, agen konsultasi manajemen konten WordPress, juga menyarankan:

“Seiring waktu, kami menduga bahwa AMP pada akhirnya akan menjadi serumit HTML yang 'tidak terbatas' atau dapat diperdebatkan oleh kemajuan perangkat keras seluler, kecepatan broadband, dan fitur privasi standar - solusi untuk masalah yang tidak lagi kami miliki.

Tapi katakanlah Anda ingin bermain-main dengan AMP.

Cara membuat halaman AMP pertama Anda

Di sinilah Anda bisa menarik celana pengembang anak laki-laki / perempuan Anda, karena dibutuhkan beberapa markup dasar untuk memulai dengan AMP.

Saya sarankan Anda mempelajari tutorial dasar ini. Ini akan mengajari Anda cara:

• Buat halaman AMP pertama Anda menggunakan kode boilerplate.
• Panggung itu.
• Validasi bahwa itu sesuai dengan AMP ( ini adalah langkah yang sangat penting ) menggunakan validator Google.
• Mempersiapkan publikasi dan distribusi.

Di markup Anda, Anda akan melihat beberapa elemen memiliki tag AMP. Dengan demikian, tag <img> menjadi <amp-img>. Tag <anim> menjadi <amp-anim>. Tag <video> menjadi <amp-video>.

Dan seterusnya.

Apa yang harus dilakukan pengguna WordPress?

Jika Anda ingin mencoba AMP, Anda beruntung.

Pada 24 Februari 2016, Automattic merilis plugin AMP resmi. Oleh karena itu, pengguna WordPress hanyalah plugin yang dapat diunduh dari konten yang dioptimalkan AMP.

Namun perlu diingat: menurut halaman resmi plugin AMP, plugin tidak mendukung halaman atau arsip. Hanya posting.

Tapi begitu Anda mengaktifkan plugin - bam - semua posting Anda otomatis di-AMPlifikasi!

Dengan plugin aktif, semua postingan di situs Anda akan memiliki versi kompatibel AMP yang dibuat secara dinamis.

Anda dapat melihat versi AMP dari postingan web Anda dengan meletakkan "/ amp" di akhir url. Misalnya, versi AMP yourwebsite.com/amp-wicked-fast menjadi yourwebsite.com/amp-wicked-fast/amp.

Dan jika Anda adalah pelanggan Rainmaker Platform: kami memiliki AMP di layar radar kami. Kami tidak akan terburu-buru, mengingat sejarah Google tentang perubahan haluan 180 derajat yang dramatis. Namun jika AMP terbukti penting di masa mendatang, kami akan menawarkan solusi AMP yang mudah bagi pengguna kami.

Apakah AMP merupakan faktor peringkat penelusuran?

Tidak.

Google John Mueller menyatakan bahwa AMP bukanlah faktor peringkat. Dia memang mengatakan bahwa "Mengonversi halaman ke format AMP akan memenuhi sinyal peringkat yang sesuai untuk seluler, tetapi tidak ada sinyal peringkat yang hanya terkait dengan AMP."

Penulis staf Search Engine Journal Matt Southern menunjukkan:

“Pertanyaan saya adalah, apa bedanya jika AMP adalah sinyal peringkat atau tidak jika konten AMP sudah memiliki tiket satu arah ke bagian atas halaman pertama? Sebagian besar konten AMP sudah mendapat peringkat di atas hasil organik, yang merupakan salah satu peningkatan peringkat terbesar yang dapat diminta. ”

Jadi, ada keuntungan untuk keluar dan berada di depan pesaing Anda dalam game konten seluler - wortel di atas tongkat yang melambai pada wajah Anda di video Whiteboard Friday ini.

Alasan lain saya menyarankan Anda menonton video Whiteboard Friday adalah orang-orang di Distilled membahas perbedaan penting lainnya yang ditawarkan AMP: pengiriman super cepat melalui server caching.

Tom Anthony, kepala R&D di Distilled, mengatakan:

“Dan kemudian semua ini dirancang untuk sangat banyak disimpan dalam cache sehingga Google dapat menghosting laman ini, menghosting konten Anda yang sebenarnya di sana, sehingga mereka bahkan tidak perlu mengambilnya lagi dari Anda.”

Hanya untuk menyeringai, inilah yang dikatakan Google Blog tentang pendekatan baru mereka dalam penyimpanan ke cache:

“Jadi, sebagai bagian dari upaya ini, kami telah merancang pendekatan baru ke cache yang memungkinkan penerbit untuk terus menghosting konten mereka sambil memungkinkan distribusi yang efisien melalui cache global Google yang berkinerja tinggi. Kami bermaksud membuka server cache kami untuk digunakan oleh siapa pun secara gratis. ”

Saya suka gratis.

Akankah AMP memengaruhi iklan Anda?

Seharusnya tidak.

Menurut Google, “Kami ingin mendukung beragam format iklan, jaringan iklan, dan teknologi. Setiap situs yang menggunakan HTML AMP akan mempertahankan pilihan jaringan iklannya, serta format apa pun yang tidak mengurangi pengalaman pengguna. ”

Dan jika Anda bertanya-tanya, berikut daftar jaringan iklan yang didukung dari situs resmi Google AMP Project:

• A9
• Adform
• AdReactor
• AdSense
• AdTech
• Dot dan Media
• Klik dua kali
• Flite
• plista
• Smart AdServer
• Yieldmo
• Isi ulang

Ngomong-ngomong, menurut saya AMP juga dimaksudkan untuk menenangkan ketakutan penerbit akan meningkatnya adopsi pemblokir iklan. Tapi itu cerita lain untuk lain waktu. Mungkin sudah waktunya kita menyelesaikan ini.

Ke Anda …

Wow. Kami membahas banyak hal di sini.

Terima kasih telah bertahan dengan saya. Semoga ini bermanfaat bagi Anda dan saya menjawab semua pertanyaan Anda tentang Proyek Google AMP.

Jika tidak, silakan tinggalkan saya di kolom komentar di bawah. Selain itu, tinggalkan komentar jika Anda memiliki sesuatu untuk ditambahkan pada apa yang saya tulis atau jika saya melewatkan sesuatu.

Bagaimanapun, saya menantikan kabar dari Anda.