Tarayıcı Sayfayı Nasıl Çizer: Üçlü Takım

Sunucu HTML dosyasını yolladı. Peki o düz yazı dosyası nasıl renkli, tıklanabilir, capcanlı bir sayfaya dönüşüyor? Cevap, web'in üç dilinin iş bölümünde:

• HTML → iskelet: "Burada bir başlık var, şurada bir paragraf, altta bir buton." Yapıyı ve anlamı kurar.
• CSS → giydirme: "Başlık lacivert olsun, buton yuvarlak, her şey ortada." Görünüşü belirler.
• JavaScript → canlandırma: "Butona tıklanınca skoru artır." Davranışı ekler.

İnsan gibi düşün: HTML iskelet, CSS deri ve kıyafet, JavaScript kaslar. Üçü ayrı diller ama tek vücut gibi çalışırlar. Bu parkurun haritası da tam olarak bu sıra: önce HTML, sonra CSS, sonra JS.

Kritik bir detay: tarayıcı, HTML tek başına gelse bile sayfayı çirkin bırakmaz — kendi varsayılan stilleri vardır. Mesela <h1> etiketini "en üst düzey başlık" olarak bilir ve onu büyük + kalın çizer. Şimdi tahmin zamanı — bu iki satır ekranda nasıl görünür?

<h1>Selam</h1>
<p>Bu benim ilk sayfam.</p>

Büyük ve kalın "Selam" başlığı, altında normal boyutta "Bu benim ilk sayfam." yazısı

Sayfa çizilirken sıra da bellidir: tarayıcı önce HTML'i okuyup iskeleti kurar, sonra CSS'le giydirir, en son JavaScript'i çalıştırıp sayfayı canlandırır. İskelet olmadan ne giysi giydirebilirsin ne kas takabilirsin. 🦴