Ağ Porter

Net-a-porter ayrıntısı

Özet

Net-A-Porter, Google'ın Polymer Kitaplığıyla geliştirme süresinden tasarruf ediyor

NET-A-PORTER, Google'ın Polymer kitaplığını kullanarak çevrimiçi mülklerinde bileşen tabanlı bir tasarım uyguladı. Sonuç olarak, geliştirme süresinden büyük tasarruf sağlandı, siteleri genelinde standartlaştırılmış kod sağlandı ve yapılandırılmış veriler kullanılarak SEO performansı arttı.

Sonuçlar

  • Geliştirme süresinden tasarruf edildi.
  • NET-A-PORTER'ın online mülklerinde standartlaştırılmış kod.
  • Yapılandırılmış verilerin kullanımı yoluyla SEO performansı iyileştirildi.

Örnek olayı PDF olarak indirin

NET-A-PORTER Hakkında

Haziran 2000'de kullanıma sunulan NET-A-PORTER, dünyanın en çok aranan tasarımcılarının 350'den fazla üyesinin koleksiyonlarıyla dijital lüks moda alanında dünya lideri.

Şirketin çevrimiçi vitrininin arkasında, şirketin mühendislik ekibi net-a-porter.com'u ve iki moda dergisi ile bir sosyal ağı içeren web siteleri ve uygulamalardan oluşan ağını sunmak ve sürdürmek için büyük çaba harcar.

NET-A-PORTER mühendisleri web mülklerini düşünürken sitedeki her sayfayı bir sayfa olarak değil, bileşenlerden oluşan bir koleksiyon olarak görür.

Örneğin bir ürün sayfası, indirim sırasında tasarrufları gösteren bir fiyatlandırma bileşeni, ilgili ürünlerin bağlantılarını içeren bir bant bileşeni, ürünleri içeren eksiksiz kıyafetleri gösteren etkileşimli bir bileşen, bir ürünü istek listesine eklemek için bir açılır liste bileşeni ve daha fazlasını içerebilir.

Bileşen tabanlı yaklaşım

2016'nın başlarında NET-A-PORTER mühendislik ekibi, şirketin bileşenleri nasıl alıp web mülkleri için kod yazma şekillerine nasıl uygulayabileceğini değerlendirmeye karar verdi. NET-A-PORTER kapsamındaki çok sayıda sayfa ve alt mülk ve bu sayfaları yöneten farklı ekipler nedeniyle mühendisler, mevcut yığınlarından kurtulmayı gerektirecek yeni bir teknolojiyle sıfırdan başlamanın mantıklı olmadığını biliyordu. İdeal bir çözüm, bu reklamların yeni bileşenler üzerine katman vermesini ve ek bileşenler oluşturuldukça sayfalara eklenmesini sağlar. Bileşenlerin farklı arka uç hizmetleriyle bağımsız olarak iletişim kurabilmesi ve ayrıca web tarayıcılarına ürünle ilgili yapılandırılmış verileri göstermesi gerekir.

Polymer ile testler ve başarı

NET-A-PORTER, bir dizi çözümü değerlendirdikten sonra Google'ın Polymer kitaplığını test etmeyi seçti. Polymer ile yapılan ilk deneme o kadar hızlı ve başarılı bir şekilde tamamlandı ki NET-A-PORTER mühendisleri ilerlemeye ve Polymer'i neredeyse anında kuruluşun genel web sitesi geliştirme planlamasına eklemeye karar verdi.

Ekipteki mühendisler Robin Glen ve Matthew Green şunları paylaştı:

Polymer'in sistemimize entegre edilmesi ve kısa sürede çalışmaya başlaması kolay oldu. Çok farklı yönleri olan bu kadar büyük bir web sitemiz olması, tutarsızlıklarla karşılaşmamız anlamına geliyor. Polymer, ölçeklenebilir ve bakımı yapılabilir eksiksiz ve karmaşık web uygulamaları oluşturmamızı sağlıyor.

Polymer, web bileşenleri tarayıcı standartlarını temel aldığından kod standartlaştırması da kolay oldu. Glen devam ediyor:

Web standartları kullanarak geliştirme yapmak, kodumuzun platforma yakın kalmasını sağlar. Bu, yeni bileşenlerin nasıl kullanılacağını ve derleneceğini öğrenmeyi kolaylaştırır. Ayrıca, tarayıcılar geliştikçe performansın sürekli olarak artmasını sağlar ve uzun vadeli planlar yapmamıza olanak tanır. W3C standardına dayalı olduğu için bu platformda geliştirme yapma konusunda kendimize güveniyoruz. Çok yakında, çoklu dolgu ihtiyacı büyük ölçüde ortadan kalkacak.

Bunun SEO avantajları da vardı. Glen şöyle diyor:

Bileşenler, ürünlerle ilgili ayrıntılı yapılandırılmış verileri arama motorlarına etkili bir şekilde gösterir. Bu yapılandırılmış verileri test etmek artık ekibimizin sürekli entegrasyon şemasının doğrudan bir parçasıdır.

Bileşen tasarlama ve üretmeye önceden yatırım yapan NET-A-PORTER ekibi, uzun vadede verimlilik açısından önemli kazanımlar elde ediyor: Yeni sayfa ve özelliklerin oluşturulup kullanıma sunulması daha kolay ve hızlı ve paydaş geri bildirimlerinin ve tasarım iyileştirmelerinin mühendislik sürecine entegre edilmesi daha kolay.

Polymer'in geleceği

Ekip, Polymer'ın web geliştirmeyi nasıl sağladığı için çok heyecanlı. Glen şöyle diyor:

Bileşenleri farklı şekillerde bir araya getirerek nasıl yeniden kullanabileceğimizi gördüğümüz anda heyecan duyduk. İşletmedeki bileşenlerden yararlanmanın başka yolları olup olmadığını merak etmeye başladık.

Glen, Polymer ile keşfedilecek daha çok şey olduğunu düşünüyor. Diyor ki,

Bu, Polymer yolculuğumuzun yalnızca başlangıcı. Şu anda mevcut bileşenlerin gönderimini ve bakım olanaklarını iyileştirirken Polymer kullanımını daha fazla NET-A-PORTER sayfasını da kapsayacak şekilde genişletmek için çalışıyoruz. Yaklaşımımızı herkese açık bir NET-A-PORTER bileşen stil kılavuzuyla belgelemek için çalışıyoruz. Polimer, şirket içi araçlarda da çok kullanışlı oldu. Kısa süre önce bir dizi grafik bileşeni oluşturduk ve izleme hizmetimizin tamamını Polymer'i kullanacak şekilde yeniden geliştirdik.