Accelerated Mobile Pages (AMP) Nedir? – Tanım

 

AMP’nin açılımı “Accelerated Mobile Pages (Hızlandırılmış Mobil Sayfalar)”dir. Google ve diğer birkaç teknoloji ve yayıncılık şirketi tarafından ortak bir girişim olarak başlatılan açık kaynaklı bir çerçeve (framework)  olarak ortaya çıkmıştır. AMP ile neredeyse anında yüklenen basit mobil web siteleri oluşturmak mümkündür. AMP’nin en dikkat çeken özellikleri JavaScript ve CSS öğelerinin azaltılması ve İçerik Dağıtım Ağı‘nın kullanılmasıdır.

amp-nedir

 

Neden AMP?

Mobil cihazlardan yapılan arama sayısı masaüstününden yapılan aramaları geçti. “Hızlandırılmış Mobil Sayfalar” (HMS) olarak adlandırılan Açık Kaynak Çerçevesi tek bir ana amaç ile oluşturuldu: mobil kullanıcılar için hızlı yükleme süreleri oluşturmak. Bu, yayıncılar ve işletmeler tarafından defalarca dile getirilen bir sorun olan kısa yükleme sürelerine yönelik artan talebe bir tepkiydi. Girişim, tüm paydaşların yararına olacak bir sistem kurulması amacıyla başlatıldı.

 

Web Siteniz Çok mu Yavaş?

AMP, bir internet bağlantısının kullanılabilir kapasitesini etkileyemez, bu nedenle teknoloji, etkileyebileceği yükleme sürelerinin yönüne odaklanır. AMP, veri aktarımı yavaş olsa bile mobil web sitesinin hızlı yüklenmesi için en iyi koşulları oluşturur. Bunu yapmak için, bir sayfanın görüntülenmesi için yalnızca birkaç kaynağın yüklenmesini sağlayarak gereken JavaScript ve CSS öğelerinin sayısını sınırlar. AMP’nin kısa yükleme sürelerinin sırrı öncelikle yüklenmesi gereken dosyaların azaltılmasıdır. Bir diğer önemli faktör, hedef sayfanın önbelleğini hazır tutan bir proxy sunucusudur. Bu içerik, kullanıcının erişdiği her yerde sayfanın her zaman aynı hızda oluşturulabilmesi avantajına sahip bir İçerik Teslim Ağı üzerinden iletilir.

 

AMP’yi Uygulamak İçin HTML Kodunda Hangi Değişikliklerin Yapılması Gerekir?

Bir web sitesinin HTML‘nin HMS üzerinden çalışması için sahip olması gereken bir dizi özel özellik vardır. Herhangi bir görsel-işitsel medya içeriği, amp-img, amp-video, amp-ses veya amp-iframe gibi özel HMS etiketleriyle işaret edilmelidir. İşte size Amp kullanılarak bir görüntünün sayfanın kaynak koduna nasıl eklenebileceğine bir örnek:

  • <amp-img src=”myimage.jpg” alt=”görüntüde görebileceğiniz” height=”200″ width=”300″></amp-img>

Ayrıca, AMP kullanılarak doğru görüntülenebilmesi için her sayfaya aşağıdaki etiketlerin eklenmesi gerekir:

  • Belge türü: <!doctype html>
  • Üst düzey etiket: <html>tag oder <html amp>
  • <head> ve <body> etiketleri
  • Üstbilgideki Kurallı Etiket: <link rel=”canonical” href=”http://www.websitesi.com” />
  • Kodlama: Üstbilgide <pre><meta charset=”utf-8″></pre>
  • Görünüm penceresi: <meta name=”viewport” content=”width=device-width, minimum scale=1″>
  • AMP CDN’ye başvuru: <script async src=”https://cdn.ampproject.org/v0.js”></script>
  • Opaklık notu: <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>

AMP’nin Avantajları

Reklamverenler için: Reklamverenler HMS’yi çeşitli reklam biçimleriyle kullanabilir. Reklam içeriği zaman uyumsuz olarak yüklenir, yani kullanıcı deneyimi sayfanın yüklenmesini engelleyen reklamlardan rahatsız olmaz.

Yayıncılar için: Yayıncılar, Hızlandırılmış Mobil Sayfalar kullanan web sitelerinin haber ortamına önemli bir yerleşiminden yararlanır. Mobil olarak optimize edilmiş web sitelerinin yüksek kullanılabilirliği, olumlu kullanıcı sinyallerine de katkıda bulunur.

Kullanıcılar için: HMS kullanan web siteleri kullanıcılar için mükemmeldir. Sayfaların yüklenmesi için uzun süre beklemek zorunda değiller ve yavaş bir internet bağlantısı üzerinden gezinirken yüksek performansa bile güvenebilirler.