DESIGN.md araçları karşılaştırması

Design Extractor, herkese açık her URL'den bir DESIGN.md oluşturur. Dosya Google'ın DESIGN.md spesifikasyonuna uyar ve sayfadan seçtiği her bileşeni, kodlama ajanının yeniden oluşturabileceği bir HTML ve CSS tarifi olarak sunar. Her tarif canlı siteye göre kontrol edilir ya da nedeniyle birlikte işaretlenir. Yalnızca belirli ülkelerden gelen ziyaretçilere yanıt veren sitelerde de çalışır.

Diğer araçlar farklı yollar izliyor. getdesign.md ve Refero Styles gibi koleksiyonlar, daha önce analiz ettikleri siteler için hazır dosyalar sunuyor; designmd.me bir URL'den dosya üretiyor; TypeUI'ın Chrome uzantısı ise sekmendeki stillerden kendi şablonunu dolduruyor. Her karşılaştırma, neyi ve ne zaman kontrol ettiğimizi listeler. Bu formatı ilk kez mi duyuyorsun? DESIGN.md nedir yazısını oku.

Neden Design Extractor

  • Google'ın DESIGN.md spesifikasyonuna uyar

    YAML frontmatter yalnızca spesifikasyonun tanımladığı özellikleri kullanır, özel üst düzey anahtar içermez. Overview ile başlayıp Do's and Don'ts ile biten standart bölümler, spesifikasyondaki sırayla gelir. Frontmatter'daki bileşen girdileri yalnızca spesifikasyonun sekiz özelliğini, sabit değerlerle kullanır. Herhangi bir dosyayı ücretsiz DESIGN.md doğrulayıcı ile kontrol et.

  • Sayfadan seçtiği her bileşen için bir tarif

    Sayfadan seçilen header, footer, butonlar, giriş alanları, kartlar ve diğer bileşenlerin her biri bir tarif olarak gelir: DESIGN.md'nin Components bölümünde, sabit değerlerle damıtılmış HTML ve CSS. Her tarif, parçalarını ve sitede görülen hover ve focus durumlarını listeler; böylece kodlama ajanın bileşeni tahmin etmek yerine yeniden oluşturabilir.

  • Canlı siteye göre doğrulanır

    Her tarif tek başına render edilir ve canlı siteye göre kontrol edilir: render edilen parçaların sayfada ölçülenlerle yapısal olarak eşleştirilmesi ve gerçek öğenin yeni alınmış bir görüntüsüyle piksel karşılaştırması. Başarısız olan bir tarif yeniden oluşturulur ve tekrar kontrol edilir. Yine de geçemeyen tarif nedeniyle birlikte işaretlenir, asla doğrulanmış olarak sunulmaz. Sonuç sayfası, bileşenlerin ne kadar yakın eşleştiğini ve sitenin renk ve metin stillerinin ne kadarının kapsandığını gösterir: galerideki Stripe örneğine bak.

  • Bölge kısıtlamalı sitelerde çalışır

    Bazı siteler yalnızca belirli ülkelerden gelen ziyaretçilere yanıt verir. Bir çıkarma bu yüzden başarısız olduğunda sonuç sayfası bir ülke seçici sunar (sayfanın yüklendiği tespit edilen ülkeler en üstte) ve aynı çıkarmayı seçtiğin ülkedeki bir tarayıcı üzerinden çalıştırır. Ülke seçimli çıkarma, Pro fiyatının üzerine 6 kredilik ek ücretle toplam 16 kredi tutar. Çıkarma başarısız olursa kredilerini iade ederiz.

Karşılaştırmalar

  • getdesign.md vs Design Extractor

    Hazır DESIGN.md dosyalarından oluşan seçkin bir koleksiyon, her URL'den üretilen, spesifikasyona uygun ve bileşen tarifleri canlı siteye göre kontrol edilen bir DESIGN.md ile karşılaştırılıyor.

  • designmd.me vs Design Extractor

    URL'den DESIGN.md üreten iki araç; spesifikasyon uyumu, bileşen tarifleri, canlı siteye göre kontroller ve fiyat açısından karşılaştırılıyor.

  • Refero Styles vs Design Extractor

    Web sitesi stillerinden oluşan büyük ve ücretsiz bir kütüphane, her URL'den üretilen, spesifikasyona uygun ve bileşen tarifleri canlı siteye göre kontrol edilen bir DESIGN.md ile karşılaştırılıyor.

  • TypeUI vs Design Extractor

    Sekmendeki stillerden kendi şablonunu dolduran ücretsiz TypeUI Chrome uzantısı, spesifikasyona uygun ve bileşen tarifleri canlı siteye göre kontrol edilen bir DESIGN.md ile karşılaştırılıyor.