Cara Menggunakan Google AMP



Google Accelerated Mobile Pages (AMP) merupakan sebuah project opensource dari Google yang memungkinkan untuk memuat tampilan web lebih cepat untuk diakses pada perangkat mobile.

Cara kerja AMP yakni meminimalisir penggunaan JavaScript, CSS dan HTML agar website bisa diakses dengan cepat dan ringan. Meskipun anda menggunakan Desktop, website yang menggunakan AMP masih bisa diakses lewat browser Desktop. Hal ini bisa mengemat data hingga 10 kali lipat.

Di tutorial kali ini saya akan menjelaskan bagaimana cara memasang Google AMP pada WordPress. Berikut ini langkah – langkahnya:

  1. Anda harus menginstall terlebih dahulu plugin AMP pada wordpress.
  2. Selanjutnya install plugin tambahan bernama Glue for Yoast SEO & AMP

Setelah anda menginstall kedua plugin tersebut maka kita masuk pada tahap pengaturan. Buka Yoast -> AMP – > Design.

Ditahap ini anda akan melihat pengaturan desain untuk AMP icon dan Default image. Untuk ukuran AMP icon, gunakan gambar berukuran 32px x 32px. Sedangkan untuk Default image, gunakan lebar minimal 696px.

Amp 1

Untuk logo yang digunakan sebisa mungkin berukuran 60px x 600px. Seperti yang ditulis AMP Logo Guidelines ada beberapa syarat seperti:

  • Files should be raster, such as .jpg, .png, or .gif, not vector, such as .svg.
  • No animation.
  • Use full wordmark or full logo; not an icon.
  • Be legible on a white or light background.

Berikut ini gambar logo mana yang harus digunakan dan mana yang harus dihindari.

AMP 2

Apabila anda penggunakan Plugin SEO Yoast maka untuk mengupload logo tersebut cukup mudah. Anda tinggal masuk ke SEO -> Dasbor -> Info Perusahaan untuk mengunggah logo tersebut.

Sekarang selesai, anda telah mengaktifkan AMP. Untuk mengunjungi laman AMP maka anda tinggal menambahkan /amp pada akhir url, misalnya “http://www.namawebsiteanda.com/cara-google-amp/amp”.

Untuk melihat apakah laman AMP anda valid, bisa menggunakan Validator AMP atau secara manual menggunakan Browser Google Chrome. Caranya tambahkan #development=1 pada laman amp anda lalu enter. Selanjutnya tekan ctrl+shift+i lalu console. Bila valid maka gambar akan seperti dibawah:

AMP valid

Contoh website saya yang sudah menggunakan AMP yakni TechVarious dengan contoh laman fitur PES 2017.

Banyak manfaat apabila anda menggunakan Google AMP. Salah satunya menghemat bandwidth pada server.

Sudahkah anda mencoba?

 



Indra Bayu

Indra Bayu

Penulis dan Editorial Xfoost.com Email : indrabayu@xfoost.com