Web Components ve JSON-LD ile daha kolay web sitesi geliştirme

09 Mart 2015, Pazartesi

JSON-LD, sitenizdeki içeriği Google ve diğer arama motorlarına tanımlayan
yapılandırılmış verileri
uygulamak için kullanılan JSON tabanlı bir veri formatıdır. Örneğin; etkinlikler, kafeler, kişiler veya daha fazlasından oluşan bir listeniz varsa, bu verileri web sayfalarına JSON-LD snippet’i olarak gömülü schema.org sözlüğünü kullanarak yapılandırılmış bir şekilde ekleyebilirsiniz. Yapılandırılmış veriler, Google’ın sayfalarınızı daha iyi anlamasına ve içeriğinizi
Bilgi Grafiğindeki etkinlikler
ve
zengin snippet’ler
gibi arama özelliklerinde öne çıkarmasına yardımcı olur.

Web Components, özel ve yeniden kullanılabilir kullanıcı arayüzü bileşenleri ile bunların davranışlarını tanımlamaya yarayan yeni nesil bir teknoloji setidir. Herhangi bir web geliştiricisi bir Web Component oluşturabilir. Süreç, kullanıcı arayüzünün belirli bir parçası için bir
şablon
tanımlayarak başlar ve ardından bunu Web Component’i kullanmak istediğiniz
sayfalara içe aktarırsınız.
Web Component’in davranışını tanımlamak için ise bir
Custom Element
kullanılır. Kullanıcı arayüzünün bir parçası için hem görünümü hem de mantığı tek bir Web Component içinde paketlediğinizden, bu paketi diğer sayfalarda ve diğer geliştiricilerle paylaşabilir, böylece web geliştirme sürecini basitleştirebilirsiniz.

JSON-LD ve Web Components birbiriyle mükemmel uyum içinde çalışır. Custom Element sunum katmanı olarak işlev görürken, JSON-LD ise hem Custom Element’in hem de arama motorlarının tükettiği veri katmanı olarak görev yapar. Bu,
Event ve
LocalBusiness
gibi herhangi bir schema.org türü için özel öğeler oluşturabileceğiniz anlamına gelir.

Mimariniz bu durumda şu şekilde görünecektir: Yapılandırılmış verileriniz veritabanınızda saklanır (örneğin, zincir mağazalarınızın konumları). Bu veriler, web sayfanıza bir JSON-LD snippet’i olarak gömülür; bu da verinin hem insan ziyaretçilere göstermek üzere Custom Element tarafından tüketilebileceği hem de Googlebot tarafından dizine eklenmek üzere alınabileceği anlamına gelir.

Daha fazla bilgi edinmek ve kendi özel öğelerinizi oluşturmaya başlamak için lütfen şunlara göz atın:

• HTML5 Rocks
  üzerindeki en son makalemiz ve
  eşlik eden kod örnekleri.
• JSON-LD web sitesi ve
  W3C spesifikasyonu
• Web Components vikisi ve
  webcomponents.org
  üzerindeki Web Components topluluğu
• schema.org
• Google’ın
  yapılandırılmış veri dokümantasyonu

Yazanlar:
Ewa Gasperowicz, Geliştirici Programları Mühendisi; Mano Marks,
Geliştirici Destekçisi; Pierre Far,
Web Yöneticisi Trendleri Analisti