Panduan untuk AMP dan PWA

Diterbitkan: 2021-03-01

AMP dan PWA pasti akan menjadi dua topik pemasaran konten yang paling banyak dibicarakan di tahun mendatang. Dalam panduan ini, kami akan memberi Anda info penting tentang keduanya, termasuk definisi singkat AMP dan PWA, dan bagaimana Anda dapat menggunakannya untuk mengirimkan konten. Kami juga akan membahas cara berbeda AMP dan PWA dapat digunakan untuk membantu mencapai tujuan pemasaran, terutama yang berkaitan dengan SEO.

Apa itu Proyek AMP (Accelerated Mobile Pages Project)?

AMP adalah singkatan dari halaman seluler yang dipercepat – dan pada dasarnya, itulah yang diberikannya kepada Anda.

Halaman AMP pada dasarnya menyajikan konten yang sama dengan halaman web yang ada, seperti artikel online. Konten dikirimkan ke pengguna seluler dalam format yang disederhanakan, berdasarkan bahasa unik yang disebut AMP HTML, yang menggabungkan elemen sederhana HTML dan CSS, dan membatasi penggunaan JavaScript. Ini berarti halaman AMP memuat jauh lebih cepat daripada halaman web asli yang biasanya menjadi dasarnya.

Pengguna penelusuran seluler pertama kali dapat mengakses konten AMP pada Februari 2016, saat Google mulai mengirimkan laman web versi AMP di hasil penelusuran. Pada saat penulisan, konten AMP dalam halaman hasil penelusuran seluler dikirimkan dalam format korsel dan cerita unggulan, dalam setiap kasus memungkinkan pengguna untuk menggesek konten yang relevan dari berbagai sumber. Konten ditandai di hasil penelusuran Google dengan ikon AMP yang digambarkan sebagai petir putih dalam lingkaran biru.

Cara termudah untuk menghasilkan konten AMP, yang sesuai untuk ditayangkan di fitur pencarian AMP Google, adalah mengedit HTML konten yang ada ke dalam HTML AMP, lalu memvalidasi halaman dan mempersiapkannya untuk dapat ditemukan. Amp.dev menawarkan tutorial sederhana kepada pengembang tentang cara mengonversi halaman HTML menjadi halaman HTML AMP.

Halaman AMP hampir selalu berhubungan secara kanonik dengan halaman lain. Ini berarti URL mereka memiliki tag rel 'kanonik' yang memberi tahu mesin telusur bahwa halaman tersebut sama dengan halaman di situs web Anda. Versi halaman non-AMP memiliki keunggulan dari perspektif SEO.

Ada pengecualian utama untuk aturan ini, dalam bentuk situs web khusus AMP yang sekarang dibuat oleh beberapa penerbit online.

John Mueller, Analis Tren Google Webmaster, telah menyarankan webmaster, bahwa situs web khusus AMP dapat menjadi hal yang baik:

“Saya tidak melihat masalah dengan menggunakan situs khusus AMP – ini adalah kerangka kerja yang bagus untuk membuat situs cepat dengan relatif mudah. Karena pada dasarnya HTML, ini akan berfungsi sama seperti halaman HTML lainnya. Sungguh luar biasa melihat lebih banyak situs khusus AMP yang muncul, ini dapat membuat segalanya menjadi lebih mudah (untuk perayapan, pengindeksan, & SEO secara umum) ketika Anda hanya memiliki satu URL untuk setiap bagian konten!”

Jika Anda ingin menguji situs Anda sendiri yang hanya memiliki AMP, kami sarankan untuk menyiapkannya di WordPress dan menggunakan plugin AMP for WP – Accelerated Mobile Pages.

AMP adalah proyek sumber terbuka yang berkelanjutan dengan aplikasi dalam email dan iklan, serta konten web. Untuk informasi lengkap dan terkini tentang proyek ini, kunjungi Amp.dev.

Apa itu PWA, dan mengapa saya harus mulai menggunakannya?

Progressive web app (PWA) adalah aplikasi web yang menambah halaman web dengan fitur dan elemen pengalaman pengguna (UX) yang secara tradisional ditemukan terutama di aplikasi asli. Dengan kata lain, mereka membuat konten web bertindak seperti konten aplikasi.

Pengalaman pengguna PWA memiliki langkah-langkah berikut:

  1. Pengguna membuka halaman PWA melalui perangkat seluler mereka. Ini bertindak seperti halaman web biasa;
  2. Pengguna menerima permintaan untuk menambahkan halaman ke layar beranda perangkat mereka;
  3. Pengguna menerima prompt. Halaman tersebut kemudian akan muncul dan bertindak sebagai aplikasi di layar beranda mereka.
  4. UX yang sedang berlangsung dari situs web/PWA memiliki elemen yang khas untuk UX aplikasi asli.

Mengubah konten web menjadi PWA adalah pekerjaan bagi pengembang web Anda, yang membutuhkan kompetensi dalam HTML dan JavaScript.

Google memiliki kriteria yang luas untuk apa yang merupakan PWA 'Dasar' atau PWA 'Teladan'.

PWA dasar:

  • Dilayani melalui HTTPS
  • Responsif di tablet dan perangkat seluler
  • Berisi URL yang semuanya akan dimuat secara offline
  • Berikan metadata untuk 'Tambahkan ke layar Utama'
  • Muat cepat, bahkan di 3G
  • Bekerja lintas-browser (termasuk di Chrome, Edge, Firefox dan Safari)
  • Berikan transisi cepat antar halaman
  • Miliki URL khusus untuk setiap halaman

Memenuhi kriteria ini sangat penting untuk kelangsungan hidup dan potensi jangkauan PWA (atau calon PWA) di Google Chrome.

Kriteria PWA Teladan lebih mendalam. Lihat Daftar Periksa Aplikasi Web Progresif Google untuk informasi lengkap.

PWA menawarkan sejumlah manfaat. Setelah pemuatan pertama, mereka biasanya memuat konten lebih cepat daripada kebanyakan halaman web tradisional. Ini membantu mempertahankan perhatian pengguna saat mereka menavigasi melalui beberapa item konten, karena mempersempit jendela waktu di mana mereka mungkin menavigasi karena pemuatan konten lambat. Jika Anda ingin mendorong pengguna untuk mengonsumsi serangkaian item konten secara berurutan, sebaiknya Anda mengirimkan konten tersebut melalui PWA.

Keuntungan utama lainnya adalah PWA dapat memberikan merek kehadiran yang berkelanjutan di layar beranda perangkat seluler pengguna. Peluang ini tepat waktu, karena banyak penerbit berjuang untuk bersaing di pasar aplikasi asli yang ramai di mana retensi aplikasi setelah 90 hari serendah 4%, dan pengguna menghabiskan 77% dari keseluruhan waktu penggunaan aplikasi di 3 aplikasi teratas mereka (sumber: Unduhan Aplikasi dan Statistik Penggunaan (2019) – Bisnis Aplikasi).

PWA adalah game-changer potensial untuk penerbit yang menargetkan jet-setter atau pembaca pedesaan, karena mereka dapat memuat konten saat pengguna offline.

Satu kelemahan potensial untuk PWA adalah bahwa mereka terkadang tampil tidak terduga dalam hasil pencarian Google.

Menurut situs Ignite Visibility yang bertujuan untuk mendapatkan konten yang diindeks oleh PWA untuk tujuan SEO harus “memiliki basis HTML dan memuat aplikasi web progresif di atasnya, [atau] menggunakan alat seperti prerender.io dan/atau pushstate.”

Situs web berbasis komunitas PWA Stats menyimpan daftar statistik langsung tentang hasil yang dihasilkan merek melalui peralihan ke PWA, mulai dari pengurangan waktu muat Tinder hingga peningkatan pendapatan untuk Best Western.

Apa perbedaan antara AMP dan PWA?

Ada kesalahpahaman umum bahwa AMP dan PWA adalah teknologi saingan yang melayani tujuan yang sama.

Meskipun benar bahwa peran kunci dari kedua teknologi tersebut adalah memuat konten lebih cepat bagi pengguna, AMP dan PWA memiliki kekuatan, kelemahan, dan penggunaan taktis yang berbeda dari sudut pandang pemasar.

Halaman AMP menawarkan waktu muat yang sangat cepat pada klik pertama. Ini membuatnya cocok untuk menarik pembaca baru, karena kemungkinan pengguna terpental karena pemuatan lambat berkurang. Mereka juga memiliki kemampuan menemukan yang sangat baik dalam hasil pencarian Google. Namun, AMP tidak mendukung fitur platform lanjutan seperti konten dinamis dan notifikasi push.

Halaman PWA memuat relatif lambat pada pemuatan pertama, tetapi kemudian memuat dengan sangat cepat dari pemuatan kedua dan seterusnya, yang dapat menghasilkan waktu pemuatan yang lebih baik dan mengurangi rasio pentalan dalam hubungan berkelanjutan antara pembaca dan konten Anda. Selain itu, PWA dapat mendukung fitur platform lanjutan seperti konten dinamis, penelusuran offline, dan pemberitahuan push, sehingga memberikan lebih banyak cara bagi pemasar untuk memengaruhi perjalanan pengguna dan meningkatkan konversi.

Penayang online dapat menggabungkan manfaat AMP dan PWA dengan menggunakan kedua teknologi tersebut secara bersamaan. Instapage menjelaskan salah satu pendekatan tersebut dalam artikelnya tentang PWA vs AMP:

“[Pikirkan] halaman AMP Anda sebagai pengait ke situs web Anda. Ini menangkap pengguna dengan beban seketika, lalu menggulungnya ke dalam aplikasi web progresif Anda. Ini memungkinkan Anda untuk menggabungkan halaman AMP yang memuat cepat dengan PWA dinamis [..].”

Opsi lainnya adalah mengaktifkan fitur PWA dalam halaman AMP.

Atau, Anda dapat memilih untuk mengembangkan PWA menggunakan AMP. Metode ini didasarkan pada penulisan PWA dalam HTML AMP, dan menggunakan komponen yang disebut amp-install-serviceworker untuk mengaktifkan fungsionalitas PWA lanjutan.

Opsi mana yang lebih baik untuk SEO dan peringkat pencarian: AMP atau PWA?

Menurut pandangan kami, jawabannya adalah sedikit dari keduanya, karena AMP dan PWA sama-sama membantu SEO dengan cara yang berbeda.

PWA membuat konten situs lebih menarik, dan karenanya dapat meningkatkan tingkat konsumsi konten pengguna. Sementara itu, AMP menurunkan rasio pentalan dengan meningkatkan kecepatan pemuatan halaman seluler secara signifikan.

Dalam kedua kasus, ada peningkatan umpan balik ke Google pada faktor peringkat halaman web utama, yang berperan dalam menentukan peringkat pencarian dan visibilitas pencarian keseluruhan untuk halaman dan domainnya.

Jadi, pendekatan terbaik dari perspektif SEO mungkin menggunakan AMP dan PWA dalam kombinasi, seperti yang dibahas di bagian sebelumnya dari artikel ini.

Apa yang saya dengar tentang kontroversi seputar AMP?

Meskipun tidak diragukan lagi AMP adalah alat yang ampuh untuk mendistribusikan konten web dan membuatnya dimuat lebih cepat, Anda harus memperhatikan bahwa ada kontroversi signifikan seputar proyek tersebut.

Beberapa komentator melihat AMP sebagai cara bagi Google untuk meniadakan situs web penerbit online dan merebut konten mereka, mengunci pengguna ke dalam pengalaman yang dioptimalkan untuk, dan berbasis di dalam, Google.

Seperti yang dikatakan oleh penulis The Register, Scott Gilbertson:

“Ini bukan tentang kecepatan. Seperti apa pun yang menghindari standar untuk versi modifikasinya sendiri, ini tentang penguncian. Banyaknya halaman di markup AMP Google berarti banyak halaman yang dioptimalkan secara khusus untuk Google dan diindeks terutama oleh Google dan ditampilkan terutama kepada pengguna Google. Ini upaya Google untuk mencocokkan platform Facebook. Dan ya, Facebook jauh lebih buruk daripada AMP, tetapi itu tidak membuat Google AMP menjadi ide yang bagus. Setidaknya Facebook tidak mencoba berpura-pura terbuka.”

Selanjutnya, halaman AMP ditampilkan tanpa URL milik penerbit dan elemen branding mereka sendiri, yang secara efektif memisahkan konten dari penerbitnya.

Mungkin argumen terkuat yang mendukung penggunaan AMP adalah untuk penerbit. Banyak produsen konten media terkemuka dunia menggunakannya, dari penyedia berita utama seperti The Guardian dan Daily Mail, hingga penerbit minat khusus seperti Wired dan Social Media Today. Ini menimbulkan pertanyaan: jika penerbit terkemuka di bidang Anda menggunakan AMP, dapatkah publikasi Anda tidak melakukannya?

Untuk wawasan lebih lanjut tentang kontroversi seputar AMP, lihat episode Podcast Pemasaran Digital kami tentang cara membuat situs web cepat, yang menampilkan wawancara dengan salah satu pendiri Raven Tools, Jon Henshaw.

Apakah aplikasi web progresif (PWA) adalah masa depan aplikasi?

Pada bulan Desember 2019, TechCrunch melaporkan temuan menakjubkan bahwa 1% penerbit toko aplikasi teratas mendorong 80% unduhan baru.

Ini memberikan gambaran suram bagi penerbit digital yang ingin mengakses manfaat yang dapat diberikan aplikasi, yang mencakup kehadiran merek yang berkelanjutan di perangkat seluler pengguna, peningkatan keterlibatan pengguna, kepemilikan platform, akses analitis penuh, dan mungkin yang paling penting, perangkat seluler yang optimal. UX.

Terhadap konteks berkurangnya unduhan aplikasi asli, PWA tampaknya sejauh ini menawarkan cara terbaik bagi semua kecuali penerbit online terbesar untuk mengakses manfaat ini. Mereka mengatasi keengganan pengguna web untuk menginstal aplikasi dari pasar aplikasi, alih-alih mentransisikannya ke aplikasi dalam pengalaman halaman web biasa.

Aplikasi asli masih berkembang dalam hal unduhan global dan waktu penggunaan, dan dalam hal itu, mereka bisa dibilang tetap menjadi aplikasi masa depan. Ini datang dengan peringatan bahwa pertumbuhan didorong oleh minoritas kuat dari penerbit terkemuka.

Meskipun demikian, tampaknya PWA dapat memainkan peran besar di masa depan konsumsi konten seluler – bidang di mana keunggulan UX dari PWA dapat mendorong peningkatan penyerapan teknologi di antara pembaca dan penerbit.

Kesimpulan: bagaimana seharusnya pemasar bertindak atas AMP dan PWA?

Potensi AMP dan PWA yang telah terbukti untuk meningkatkan aspek kinerja konten dan UX menunjukkan bahwa teknologi ini merupakan jalan penting untuk diselidiki oleh penerbit online.

AMP adalah yang lebih mudah untuk diuji pada skala terbatas: Anda cukup mengonversi beberapa halaman konten ke HTML AMP dan mengamati hasilnya (dalam batas-batas analitik yang relatif terbatas yang disediakan Google untuk penerbit AMP). PWA secara implisit mengikat penerbit untuk memberikan pengalaman gaya aplikasi kepada pembacanya secara berkelanjutan, dan oleh karena itu tidak boleh dianggap enteng.

Di sisi lain, PWA tampaknya menawarkan manfaat yang relatif murni, jika dibandingkan dengan AMP. Pembaca yang kembali mendapatkan waktu pemuatan yang lebih cepat, ditambah fitur gaya aplikasi canggih yang tidak dimiliki AMP. Yang terpenting, penerbit mempertahankan kontrol dan kepemilikan konten yang lebih besar.

Saran kami untuk penayang online yang mempertimbangkan AMP dan PWA adalah mulai dengan menguji AMP dengan beberapa halaman konten, dan menyelidiki opsi peluncuran PWA dalam skala besar secara menyeluruh. Baik digunakan sendiri atau dalam kombinasi, kedua teknologi tersebut tampaknya akan menentukan bagaimana pengguna seluler mengonsumsi konten web selama bertahun-tahun yang akan datang.

dapatkan keanggotaan gratis Anda sekarang - sama sekali tidak memerlukan kartu kredit

  • Perangkat Pemasaran Digital
  • Sesi pembelajaran video langsung eksklusif
  • Pustaka lengkap Podcast Pemasaran Digital
  • Alat pembanding keterampilan digital
  • Kursus pelatihan online gratis

KEANGGOTAAN GRATIS
infografis