HTML First

HTML First ilkelerine giriş

• Modern web tarayıcılarının yerleşik özelliklerinden yararlanma
• HTML öznitelik sözdiziminin aşırı sadeliğinden yararlanma
• Web’in ViewSource özelliğinden yararlanma

HTML First’in hedefleri

• Web yazılımı kod tabanında çalışabilecek kişi sayısını artırmak
• Kişisel açıdan daha fazla insanın web programcısı olup gelirini artırması
• İş açısından yazılım geliştirme maliyetlerini düşürmek ve insan kaynağı kullanımından tasarruf sağlamak

HTML First’in ikinci hedefi

• Web yazılımı geliştirmeyi daha keyifli ve akıcı hale getirmek
• Araçlar ve framework’lerde ustalaşmak için yıllar harcamak yerine HTML First ilkeleriyle hızlı yetkinlik kazanmak

HTML First nasıl hayata geçirilir

• HTML’in anlaşılmasının kolay olduğunu kabul edip, yalnızca içerik ve yapıyı tanımlamak için değil, stillendirme ve davranış tanımı için de HTML’i temel almak

İlke: Vanilla yaklaşımını tercih et

• Stillendirme ve davranış tanımı için HTML özniteliklerini kullanma
• HTML özniteliklerinden yararlanan kütüphaneleri kullanma
• Build aşamasından kaçınma
• "Naked" HTML’i tercih etme
• View-Source dostu bir yaklaşım kullanma

Tarayıcının yerleşik destek özelliklerinden yararlanma

• Dış framework’ler yerine "vanilla" yaklaşımla işlev elde etme
• Bir kütüphane ya da framework eklemeden önce bunun saf HTML/CSS ile mümkün olup olmadığını kontrol etme

Stil ve davranışı HTML öznitelikleriyle tanımlama

• Stillendirme Tailwind veya Tachyons gibi SPC kütüphaneleriyle yapılabilir
• Davranış için hyperscript, Alpine gibi kütüphaneler kullanılabilir
• HTML karmaşık görünebilir ancak diğer geliştiricilerin anlaması ve değiştirmesi daha kolaydır

HTML özniteliklerinden yararlanan kütüphaneleri kullanma

• JavaScript veya kullanıcı tanımlı sözdizimi merkezli kütüphaneler yerine HTML özniteliklerinden yararlanan kütüphanelerin kullanılması önerilir

Build aşamasından kaçınma

• Dosya dönüştürmeyi gerektiren kütüphaneler bakım yükünü artırır ve ViewSource özelliğini zayıflatır
• HTML First kütüphaneleri kullanıldığında ek CSS ve JS ihtiyacı en aza iner

"Naked" HTML’i tercih etme

• Bu ilke en çok backend uygulamalarında geçerlidir
• HTML’e aşina geliştiriciler, backend framework’ünü bilmese bile view dosyalarını anlayabilir

View-Source özelliğini koruma

• İlk dönem web’in cazibesi, kodu "gözetleyip" web sayfasının bir bölümünü anlayabilmekti
• HTML First ilkelerini izleyen sitelerde ViewSource özelliği yeniden kazanılır

Sonuç

• Bu sitede anlatılan pratikler ve ilkeler, sektör genelinde hâlâ ana akım değil
• Bu fikirlere yakınlık duyan insanları bulmak ve onlarla bağlantı kurmak amaçlanıyor

GN⁺ görüşü

Bu yazının en önemli noktası, web geliştirmede erişilebilirliği ve bakım yapılabilirliği artırmak için HTML First ilkelerinin benimsenmesidir. Bu ilkeler web geliştirmeyi daha kolay ve hızlı hale getirir; daha fazla insanın web programlamaya katılmasına imkân vererek hem bireyler hem de işletmeler için fayda sağlar. Bu yaklaşım, web geliştirmenin karmaşıklığını azaltma, kodun okunabilirliğini artırma ve geliştirici topluluğu içinde bilgi paylaşımı ile iş birliğini teşvik etme potansiyeli taşıdığı için ilgi çekicidir.

[GN⁺]

Hacker News görüşleri

• Teoride ve basit örneklerde ilginç, ancak bu ilkelerin büyük projelerde nasıl uygulandığını ve nasıl fark yarattığını gösteren örneklere ihtiyaç var.
• Web platformundan azami ölçüde yararlanmayı ve karmaşıklığı azaltmayı destekliyorum, ancak ortaya konan ilkelerin gerçekten karmaşıklığı azaltıp azaltmayacağı konusunda şüpheliyim.
• HTML’in temel özelliklerini kullanmak güzel, ancak bu 10 yıl önce de pratik değildi, şimdi de değil; ayrıca htmx vb. araçların React gibi ağır çözümlerden daha iyi olduğunu düşünmüyorum.
• Açılır menü, çoklu seçim ve tarih seçici gibi özellikleri uygularken tarayıcılar arası tutarsızlık var ve stil verme seçenekleri sınırlı; bu yüzden yalnızca yerleşik HTML öğeleri yeterli değil.
• Örnekler zayıf ve stil ile davranışı satır içi HTML öznitelikleriyle tanımlamak karmaşık hale gelebilir.
• Gerekli kütüphaneleri kullanırken JavaScript veya özel sözdizimi yerine HTML özniteliklerinden yararlanan kütüphaneleri kullanma fikrine katılıyorum.
• Yalnızca HTML işaretlemesinden oluşan bir SaaS platformu geliştirmede bu felsefe iyi uyuyor.
• Bu, karmaşık web siteleri inşa etme sürecinden geçmemiş birinin ortaya koyduğu bir anti-pattern gibi ve kötü tavsiye olarak görünüyor.
• Kullanıcının sayfa kaynağını görüntüleyerek anlayabilmesi gerektiği görüşüne katılıyorum, ancak web uygulamalarında tipli bir dil kullanmak tercih edilir.
• "Davranışın yerelliği", ilgi alanlarının ayrımına aykırı, muğlak tanımlanmış bir kural; CSS’yi "uzaktan ürkütücü etki" diye adlandırmak ise abartılı bir ifade.