Google AMP Project Nedir?

tarihinde yayınlandıSEO Paylaşımları içinde yayınlandı

google-amp-project-nedir

Biliyorsunuz ki sayfa yüklenme süresi sitenizin ziyaretçi oranıyla doğrudan ilişkilidir. Bununla birlikte mobil sitelerde sayfa yüklenme süreleri kullanıcıların beklentisini asla karşılamıyor. Ziyaretçi kaybetmenin kaçınılmaz olduğu bu duruma Google’ın getirdiği bir çözüm var. Google AMP Project, mobil cihazların yükleme sürelerini temel tasarım ilkelerine uygun şekilde çözmeyi vadeden etkili bir yöntem. Sitenizin olabildiğince erişilebilir sayfalar sahip olması açısından oldukça umut verici olduğunu söyleyebiliriz. Aynı zamanda Accelerated Mobile Pages (AMP) destekçisi Google, mobil web sitelerinin performansını artırmaya odaklanan açık kaynak kodlu ve oldukça başarılı bir girişime imza atmıştır. Bu proje HTM yapısı üzerinde farklı taglerin kullanımıyla geliştirilmiştir. Twitter, Linkedin, WordPress gibi sosyal platformlar bu yapıya geçmek için hazırlanmakta olup bu büyük şirketlerin desteğine de sahip. Tabiki mobil sitelerin yüklenme sorunu global bir sorun. Bu nedenle bu sorunu çözmek için ortaya çıkan bir çok eklenti ve araç mevcut. Ancak arkasında Google olan bir projenin güvenilirliği daha cezbedici.

Sitenizi AMP dostu yapmanızın bir sürü avantajı olduğu gibi bir dezavantajı da mevcut. Çünkü Projenin çok katı kuralları var ve bu kurallar herkes için kabul görebilir nitelikte olmayabilir. Şunu da belirtmeliyiz ki, siteniz zaten mobil taramalar için iyileştirmeleri yapılmış bir siteyse AMP’nin getirilerinden çok fayda görmeyebilir.

google-amp-pages-768x495

AMP Nasıl Yapılır?

AMP için bahsedilen kurallar aşağıdaki gibidir:

  1. Sayfanız doctype ile başlamalı.
  2. Sayfanızda <html amp> tagi bulundurmalısınız.
  3. Sayfanızda <body> ve <head> tagleri bulunmalı.
  4. AMP yaptığınız sayfanın eğer normal bir HTML versiyonu bulunuyorsa,

<link rel = ”canonical” href = “$SOME_URL /> şeklinde belirtilmeli. Böyle bir versiyonu yoksa kendini işaretlemeli.

  1. <head> tagi kullanıldıktan sonra <meta charset = “utf-8” > olmalı.
  2. <head> tagi içerisinde

< meta name = “viewport” content = “width = device-width, minumum-scale = 1” > bulunmalı ve <head> tagi arasında

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

  1. Son adım olarak yapılması gereken, <head> arasına “AMP Boilerplate” kodunu eklemeniz.

Bu projenin başka kurallarından bahsedecek olursak,

  • Open Graph Protocol, Twitter Cards, schema.org/NewsArticle gibi şemalar AMP projesi tarafından desteklenmekte olup bunun yanısıra bir çok HTML tagi de destekleniyor. Ancak taglere özellik veren “on” ile başlayan örneğin, onclick gibi özelliklere izin verilmiyor.
  • <style> içerisinde @font-face, @media, … kurallarına izin verilse de @import için izin yok.
  • Ayrıca, amp-* kodları dışında kullanılan tagle için pseudo-selectors yapılabiliyor.
  • Animasyonlar için kullanımına izin verilen tagler sadece şunlar: opacity, transform.
  • “overflow”un auto ve scroll değerinde olmasına izin verilmiyor.
  • Custom style’ın en fazla 50,000 byte olması gerekiyor.

 

WordPress AMP ile Nasıl Entegre Edilir?

Sayfanızı AMP uyumlu kılmak için kullanabileceğiniz en mantıklı eklenti tabiki AMP eklentisi. Bunun için ek işlevsellik sunarak AMP tamamlayıcı şeklinde çalışan alternatifler mevcut.

Bu bilgiyle birlikte sonuca gelecek olursak, WordPress!e AMP entegre ederken yaşayacağınız bir ya da iki tane problem vardır. Bunun dışında eklentiye ait getirileri görmeniz açısından süreç oldukça kolay ve zahmetsiz ilerliyor. Bunun için öncelikle, AMP Project’in dayandıklarını araştırmalısınız. Sonrasında AMP eklentisini ve Custom AMP eklentisini yükleyerek AMP sayfanızı yapılandırmaya başlayabilirsiniz. Ayrıca, AMP sayfalarınızın Google üzerinden erişilebilirliğini sağlamak için Facebook Instant Articles’ı ve Google AMP Pages’ı kurmalısınız.

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir