🚀 HTML'in Temel İskeleti: İlk Blueprint
Bir web sayfasının çalışması için gereken en temel etiketleri ve hiyerarşiyi öğreniyoruz.
Bir Sayfanın Anatomisi
Selamlar. Artık editörlerimizi seçtiğimize göre, ilk kodumuzu yazma vakti geldi. Bir web sayfası, rastgele dizilmiş metinlerden oluşmaz; her şeyin belli bir hiyerarşisi vardır. Bunu bir oyun motorundaki 'Root Node' (Kök Düğüm) ve onun altındaki 'Child Nodes' (Alt Düğümler) gibi düşünebilirsiniz.
İşte her HTML dosyasında bulunması gereken o zorunlu yapı taşları:
<!DOCTYPE html>: Bu bir etiket değildir, tarayıcıya dökümanın HTML5 standartlarında olduğunu belirten bir talimattır. Oyun motorlarındaki 'Engine Version' seçimi gibi düşünebilirsiniz.<html>: Tüm sayfanın ana kapsayıcısıdır. Her şey bu etiketin içine yazılır.<head>: Sayfanın 'beyni' gibidir. Burada yazanlar ekranda görünmez; sayfa başlığı, karakter seti (UTF-8) gibi teknik veriler burada yer alır.<body>: Sayfanın 'vücudu'dur. Kullanıcının gördüğü her şey (yazılar, resimler, butonlar) buraya yazılır.
Bizim OvidRacer gibi projelerde bile, o devasa 3D sahnelerin yüklendiği ana ekran aslında bu kadar basit bir <body> etiketinin içinde başlar. Temel sağlam değilse, üzerine kurduğunuz yapı her zaman risk altındadır.
Neden Bu Kadar Çok Etiket Var?
İlk bakışta 'Sadece bir yazı yazmak için neden bu kadar çok şeye ihtiyacım var?' diyebilirsiniz. Ancak tarayıcılar (Chrome, Edge vs.) çok titizdir. Onlara dökümanın nerede başladığını (<html>) ve asıl içeriğin nerede olduğunu (<body>) net bir şekilde söylemeniz gerekir.
Godot'ta bir sahne oluştururken nasıl ki her şey bir Node ile başlıyorsa, HTML'de de her şey bu standart hiyerarşi ile başlar. Bu yapıyı bir kez ezberlediğinizde (ki zaten editörler bunu sizin yerinize otomatik oluşturur), web dünyasının kapıları size açılmış demektir.
Şimdi yukarıdaki kod panelinde <h1> etiketinin içindeki metni değiştirip sayfanın nasıl güncellendiğine bir bakın. İlk 'deploy' işleminizi yapmış oldunuz!
Ovid Notu: ovidgame.com