Accelerated Mobile Pages – AMP Project


Accelerated Mobile Pages

‘Accelerated Mobile Pages’ (AMP) merupakan framework opensource, cross-platform dimana kecepatan pemuatan situs web mobile dapat meningkat secara signifikan. Hal ini didasarkan pada pengurangan CSS dan JavaScript, jaringan pengiriman konten, serta HTML yang dimodifikasi. Proyek ini didukung oleh Google.

Latar Belakang Proyek AMP ‘Accelerated Mobile Pages’

Penggunaan mobile Internet meningkat dengan pesat di seluruh dunia. Untuk alasan ini, masa depan Internet akan mobile di banyak daerah. Oleh karena itu konten web harus dioptimalkan untuk perangkat mobile. Bahkan perdagangan mobile pun terhindar dari meningkatnya penggunaan mobile internet. Perubahan dalam kebiasaan berselancar mempengaruhi desain website dan teknik adaptasi yang digunakan untuk mempresentasikan website. Untuk meningkatkan kegunaan sebanyak mungkin, situs mobile pasti harus cepat. Menurut sebuah survei dari tahun 2015, lebih dari 50 persen responden di Jerman menemukan bahwa halaman mobile tidak boleh membutuhkan waktu lebih dari 3 detik untuk dimuat.

     

Baca : Electronic Business atau E-business Indonesia

Studi lain mengungkapkan bahwa tingkat bouncing meningkat hingga lebih dari 50 persen jika situs web seluler membutuhkan waktu lebih dari 10 detik untuk dimuat. Efek perbedaan waktu loading halaman menjadi semakin nyata di toko online. Disini, beberapa fraksi sedetik bisa menentukan apakah pengunjung menjadi pembeli atau tidak. Optimalisasi kecepatan pasti disertakan dalam optimasi mobile. Dengan menyatakan kecepatan halaman sebagai faktor peringkat pada tahun 2010, Google sendiri menekankan fakta bahwa kecepatan pemuatan situs web adalah faktor penting untuk pengalaman pengguna yang positif.

Sejarah AMP ‘Accelerated Mobile Pages’

Proyek Percepatan Mobile Pages diluncurkan pada bulan Oktober 2015. Dasar pembentukan inisiatif open source menimbulkan perdebatan dan diskusi antara penerbit dan perusahaan teknologi, di mana kebutuhan untuk konten mobile loading lebih cepat sering menjadi topik utama. Penggagas, yang meliputi Google, WordPress, dan Adobe, semua bercita-cita untuk menciptakan sistem eco mobile yang lengkap hestanto.web.id. Sistem ini harus bermanfaat bagi penerbit dan pengembang, pengguna, dan platform konsumen. Mitra teknologi lainnya termasuk jaringan sosial Pinterest, Twitter, dan LinkedIn. Di antara penerbit pertama yang menerapkan AMP adalah “Zeit” dan “Frankfurter Allgemeine Zeitung” di Jerman, “Washington Post” dan “Buzzfeed” di Amerika Serikat, “Guardian” di Inggris, dan “El Pais” di Spanyol.

Karena pendekatan open source, diharapkan AMP akan menyebar dan berakar dengan cepat seperti sistem operasi Android untuk smartphone. Dengan pengumuman dari Google bahwa situs AMP juga akan diindeks mulai Februari 2016, webmaster sekarang memiliki tambahan insentif untuk mengimplementasikan framework tersebut. Bahkan diduga Google akan membuat halaman AMP dikenali di SERP, seperti yang sudah dilakukan untuk halaman yang dioptimalkan untuk penggunaan mobile. Dalam video ini, Paul Bakaus, pengembang HTML5, memberikan penjelasan rinci dan jelas tentang proyek AMP dan menunjukkan manfaat teknologinya.

Baca : Definisi B2B Marketing (Bisnis ke Bisnis)

Prinsip fungsional AMP ‘Accelerated Mobile Pages’

Kecepatan pemuatan situs web terutama bergantung pada ukuran file yang akan dimuat. Kerangka kerja ini mencoba mengurangi keseluruhan ukuran halaman web seminimal mungkin. Pada saat bersamaan, isi situs AMP di-cache dan tersedia di server proxy. Jika pengguna mengakses konten, mereka dimuat melalui jaringan pengiriman konten. Kode sumber situs AMP dapat diinterpretasikan oleh semua server.

AMP HTML: Kode sumber HTML disesuaikan dan dikurangi dengan AMP. Hanya satu permintaan HTTP yang terjadi per panggilan halaman.

AMP JavaScript: Situs web AMP hanya menggunakan JavaScript asinkron. Ini memastikan rendering cepat dari situs web karena pemuatan halaman tidak dapat diblokir oleh sumber daya JS. Jika file JavaScript pihak ketiga terintegrasi, embedding dilakukan melalui iframe.

AMP CDN: Cache situs AMP dibuat di server proxy di seluruh dunia. Dengan cara ini, isinya kemudian bisa dikirimkan melalui jaringan pengiriman konten yang berbasis http 2.0. CDN juga memeriksa apakah situs AMP berfungsi.

Keuntungan besar AMP adalah kecepatan pemuatan sebuah situs web dapat dihitung dan diukur secara akurat terlebih dahulu. Perbaikan lainnya termasuk spesifikasi ukuran file yang tepat untuk gambar atau media tertanam lainnya. Saat situs AMP dimuat, teknologinya dapat memprioritaskan unduhan individual. Di sini, posisi masing-masing file dalam sumber juga diinterpretasikan selain ukuran file.

File CSS juga dipengaruhi oleh optimasi kecepatan. Misalnya, hanya gaya inline yang tidak lebih besar dari 50 kilobyte yang diizinkan untuk CSS.

Aplikasi Berbasis AMP ‘Accelerated Mobile Pages’

Pada dasarnya, Accelerated Mobile Pages tidak terbatas pada area tertentu di web. Aplikasi e-commerce untuk situs web AMP, formulir pendaftaran khusus, paywalls, dll juga bisa dibayangkan. Pemrakarsa memilih untuk menahan diri dari pembatasan sebelumnya. Sejauh integrasi situs AMP dalam hasil pencarian Google, hanya penerbit berita yang telah terpengaruh sejauh ini (per Desember 2015). Namun, dalam jangka panjang, toko online yang memiliki halaman produk AMP khusus, atau penyedia layanan perjalanan yang misalnya mempermudah pemesanan melalui situs AMP yang cepat untuk pengguna ponsel juga mungkin akan diintegrasikan. Karena tidak ada batasan dalam hal platform atau tujuan, banyak aplikasi yang berbeda pasti akan muncul dalam beberapa tahun ke depan.

Baca : Konsep Social Marketing dan Kebijakannya

Modifikasi pada kode HTML

Modifikasi kode sumber HTML diperlukan untuk mengimplementasikan situs AMP. Misalnya, tag media diberi awalan “amp”.

Gambar: amp-img
Video: amp-video
File audio: amp-audio
iframe: amp-iframe

Contoh dalam kasus video:

   <amp-video src=“topvideo.jpg” alt=“my best video” height=“500” width=“800”></amp-video>
Tag ini harus digunakan untuk situs web AMP:
Jenis dokumen:
  <!doctype html>

Top level tag

  <html>tag (<html amp> also works)

<head> dan <body> Tags
Link Canonical di bagian <head>:

  <link rel=“canonical” href=“Original-URL” />

Coding di bagian <head>:

  <meta charset=“utf-8”>

Lihat port di bagian <head>:

  <meta name=“viewport” content=“width=device-width,minimum-scale=1”>

Referensi ke AMP-CDN di bagian <head>:

  <script async src=“https://cdn.ampproject.org/v0.js”></script>

Spesifikasi opasitasnya:

  <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>

Sedangkan tag rel-attibute dan canonical bukanlah keharusan di situs web konvensional, situs web AMP harus mengandung dua elemen ini di bagian <head>.

atribut: Menampilkan perayap bahwa ada juga versi situs AMP dari halaman ini.

Contoh:

  <link rel=“amphtml” href=“https://www.domain.id/amp-page.html”>

Tag Canonical: Tag kanonik di situs AMP mengarah ke situs web asli.

   <link rel=“canonical” href=“https://www.domain.id/whole-page.html”>

Sampai hari ini, Google belum mengumumkan rekomendasi spesifik misalnya, tag rel untuk situs web AMP yang harus dikombinasikan dengan tag rel lainnya untuk pengindeksan aplikasi. Bahkan untuk kombinasi dengan hreflang, masih belum ada panduan spesifik (per Desember 2015). Jika halaman AMP adalah satu-satunya situs yang memiliki konten ini, tag kanonik menunjukkan dirinya sendiri.

   <link rel=“canonical” href=“https://www.domain.id/amp-page.html”>

Baca : E-commerce Menurut Para Ahli

Pentingnya untuk mobile marketing

Situs web AMP harus dimuat dalam milidetik. Karena iklan juga dipengaruhi oleh kecepatan pemuatan yang dioptimalkan, pengiklan dapat menggunakan AMP untuk mencoba dan memastikan bahwa iklan mereka tidak memiliki efek negatif pada pengalaman pengguna. Ini karena hari ini, spanduk iklan atau interstisial sering dianggap sebagai gangguan pengguna internet mobile.

Kerangka kerja AMP mendukung berbagai format iklan. Dengan demikian, teknologi ini menghadirkan pemasang iklan dengan berbagai pilihan iklan. Karena kerangka kerja tidak tergantung pada platform, pengiklan tidak terbatas hanya pada satu perusahaan saat ingin menempatkan iklan.

Postingan Terkait :

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

67 − 62 =