Apa Itu AMP dan Cara Setting AMP di WordPress

0

AMP (Accelerated Mobile Pages) adalah teknologi yang bertujuan untuk memberikan pengalaman internet cepat untuk perangkat bergerak yaitu smartphone dan tablet yang dikembangkan secara terbuka dan berasosiasi dalam Organisasi Ampproject. Mega Power Industri seperti Google, WordPress dan Twitter telah menjadi kontributor utama dalam pengembangan AMP projects dan telah mengaplikasikan AMP pada produk mereka seperti Mesin Pencari Google, WordPress AMP dan Twitter Backlink. Untuk saat ini AMP masih dalam tahap pengembangan untuk teknologi masa depan yang memberikan kemudahan baik dari sudut pandang web developer maupun pengunjung website.

Mengapa AMP Dikembangkan Sebagai Teknologi Masa Depan?

Tujuan AMP memberikan pengalaman internet cepat bukan berdasarkan tanpa sebab, bahwa teknologi jaringan internet sudah sangat cepat jika hanya untuk membuka sebuah halaman website. Berdasarkan statistik dunia tahun 2017, 75% halaman website pada perangkat bergerak dimuat lebih dari 10 detik dan 53% pengunjung meninggalkan halaman tersebut 3 detik pertama saat halaman dimuat. Dari segi finansial website yang dimuat 5 detik dibandingkan 19 detik akan menghasilkan keuntungan finansial 2x lipat lebih banyak. Hal yang mempengaruhi adalah respon server, responsive design serta konten yang tertutup iklan. Dan berdasarkan statistik Usaha Kecil Menengah pada umumnya tidak memiliki tim developer khusus untuk dapat mengembangkan website mereka, karena untuk membuat design responsive dan cepat memerlukan kemampuan dan biaya yang tinggi. Oleh karenanya AMP merupakan teknologi masa depan yang akan menjawab permasalahan ini. Sehingga lalulintas informasi di internet semakin berkualitas.

Bagaimana Fundamental Kerja AMP?

Projects Accelerated Mobile Pages mempunyai fundamental dalam pengembangan teknologi masa depan yaitu Pengalaman Pengguna > Pengalaman Developer > Implementasi. AMP memprioritaskan pengalaman pengguna untuk kenyamanan internet serta kualitas informasi yang didapatkan. Sehingga walaupun menggunakan AMP informasi di internet tetap diolah berdasarkan kualitasnya, dalam artian penggunaan AMP tidak akan memberikan pelayanan khusus untuk suatu website. AMP hanya bertindak sebagai teknologi yang memberikan pengalaman internet cepat pada perangkat bergerak. Namun dalam praktiknya kecepatan website yang lambat dapat menurunkan ranking pencarian di mesin pencari walau informasi yang diberikan sangat berkualitas.

Bagaimana Cara Kerja AMP?

AMP memberikan tujuh kali optimasi suatu halaman website.

  1. Memuat Semua Konten Halaman Website Secara Paralel/Bersamaan

    Secara umum halaman suatu website akan dimuat secara simultan, hal ini dapat dilihat ketika melakukan uji waterfall suatu halaman website. Berbeda dengan AMP yang memuat konten secara bersamaan tanpa henti hingga seluruh halaman berhasil dimuat. Javascript yang diperbolehkan hanya Javascript asynchronous. Namun hal ini menyebabkan kesulitan dari sisi developer untuk menyampaikan konten yang akan dimuat ke pengguna. Hal ini masih dalam pengembangan AMP.

  2. Menggunakan Layout Independent

    AMP menggunakan layout independent dalam artian layout hanya terdiri dari i-frame yang dapat diisi oleh konten website tanpa mengetahui sebelumnya konten apa yang akan diisi. Website pada umumnya menggunakan layout yang besar seperti footer, sidebar dan lain lain. AMP mengganti layout halaman dengan layout AMP.

  3. Menggunakan Inline, size-bound CSS

    CSS style yang digunakan AMP hanya satu baris dengan ukuran maksimal 50 kb. Berbeda dengan halaman website umumnya bisa berisi banyak file CSS sehingga peluang memblokir load konten sebelum CSS dimuat semakin besar.

  4. Memicu Pemuatan Font

    Sebelum memuat konten, browser menunggu permintaan HTTP untuk memuat font. Dengan menggunakan AMP, load konten dapat dilakukan sebelum load font dilakukan. Karena ukuran font sangat besar mulai puluhan kb hingga mb.

  5. Mengurangi style dan kalkulasi layout halaman website

    Kalkulasi style dan layout halaman menggunakan AMP membuat kinerja prosesor lebih sedikit.

  6. Hanya Menggunakan GPU untuk rendering Animasi

    Browser pada umumnya menggunakan CPU dan GPU untuk render animasi pada halaman website. AMP mengubah perintah sehingga hanya GPU yang melakukan render animasi dan gambar. GPU lebih berkali-kali lebih cepat untuk render animasi dari pada menggunakan CPU, kinerja CPU pun tidak terlalu terbebani.

  7. Memprioritaskan isi konten suatu halaman website

    AMP menggunakan algoritma yang dapat menentukan prioritas konten yang akan dimuat. Baik dari server HTTP website maupun HTTP pihak ketiga (contoh: iklan) sehingga pengguna lebih cepat mendapati isi dari suatu halaman website.

AMP User


Cara Memasang dan Setting AMP di WordPress

Anda dapat menggunakan AMP dengan mudah di platform WordPress. Anda hanya perlu melakukan instalasi plugin AMP pada situs WordPress anda. Selain itu AMP sangat familiar dengan plugin SEO seperti Yoast SEO yang menyediakan plugin Glue for Yoast SEO & AMP untuk SEO AMP. Dari hasil review kami plugin AMP by Automattic merupakan plugin AMP terbaik dan juga merupakan plugin AMP yang telah direkomendasikan oleh Google AdSense untuk meningkatkan intensitas tampilan iklan di perangkat bergerak. berikut cara memasang dan setting AMP di WordPress.

  1. Install dan Aktifkan Plugin AMP by Automattic

    Anda dapat memasang plugin AMP by Automattic melalui dasbor WordPress anda atau download manual di WordPress Plugin Repository anda juga dapat membaca Tutorial Cara Memasang Plugin WordPress

  2. Mengakses Setting AMP 

    Setelah anda mengaktifkan plugin AMP anda dapat mengakses setting AMP pada panel utama. Disini anda dapat menambahkan kode analytic dengan konfigurasi JSON yang anda gunakan untuk melihat statistik website anda.Untuk informasi pengembangan AMP Analytic dapat anda kunjungi Github AMPAMP Analytic

  3. Memuat ulang Permalink

    Sebelum AMP membuat halaman khusus untuk setiap post pada website anda. Anda perlu memuat ulang permalink. Anda juga dapat membaca Tutorial Cara Mengatur Permalink WordPress sebelumnya. Anda hanya perlu klik Save Changes/Simpan Perbuahan pada pengaturan permalink website anda maka permalink anda telah dimuat ulang.

    Memuat ulang permalink

  4. Melakukan Perubahan Layout AMP

    Anda dapat melakukan perubahan AMP dengan klik panel Appearance (Tampilan) » AMP. Sebelumnya anda dapat membaca tutorial Cara Mengatur dan Install Tema WordPress. Anda kemudian diarahkan pada halaman untuk mengubah layout AMP sebagai berikut, setelah itu simpan perubahan anda.Layout AMP

  5. Uji Post Anda dengan AMP

    AMP secara default hanya bekerja pada halaman post anda, sehingga AMP tidak bekerja pada arsip dan halaman lain. Anda hanya perlu menambahkan /amp (permalink yang disesuaikan) atau &amp=1 (plain permalink) sesuai pengaturan permalink anda. Dapat diilustrasikan sebagai berikut 

  6. Selamat Anda Telah Berhasil Menggunakan AMP

    Untuk proses selanjutnya AMP pada situs anda akan dimuat secara otomatis oleh search engines. Search engine dapat mendeteksi post anda mendukung AMP dan akan menampilkan halaman AMP ketika user berselancar melalui search engine bersangkutan. anda juga dapat menguji post anda melalui Google AMP Test.


Berdasarkan review Advernesia, situs web memuat dengan sangat cepat 1-3 detik secara penuh menggunakan AMP. Halaman akan dimuat secara otomatis menggunakan AMP jika pengguna mendapatkan halaman website dari mesin pencari. Namun jika pengguna mengunjungi dari address bar browser, website akan dimuat secara normal.

Daftar Isi Tutorial WordPress


Sekian artikel Apa Itu AMP dan Cara Setting AMP di WordPress. Nantikan artikel menarik lainnya dan jangan lupa share artikel ini ke kerabat anda. Terimakasih…

AYO BERKOMENTAR

Tulis komentar
Masukkan nama Anda