Yükleniyor...

HTML Temelleri

Önceki derslerde HTML ile tanıştınız ve bir editör seçtiniz. Şimdi eksiksiz bir temel sayfa kuracaksınız: her modern HTML dosyasının başlaması gereken standart iskelet, artı biraz görünür içerik.

Temel bir HTML belgesi nedir?

Temel bir HTML belgesi, sabit bir dış yapıya sahip bir metin dosyasıdır. Bu yapının içine ziyaretçilerin gördüğü içeriği koyarsınız. Bu kurstaki neredeyse her sayfa aynı dış iskeleti yeniden kullanır ve yalnızca body içindeki içeriği değiştirir.

Doğrudan yanıt: gerekli iskelet

Modern bir temel sayfa şu parçaları bu sırayla içerir:

<!DOCTYPE html> — bir HTML5 belgesi bildirir
<html> — tüm sayfayı saran kök öğe
<head> — sayfa hakkında bilgi (görünür ana makale değil)
head içindeki <title> — tarayıcı sekmesi ve yer imleri için metin
<body> — insanların sayfada gördüğü içerik

Temel HTML belgesi

html

HTML Code

<!DOCTYPE html>
<html>
<head>
<title>Sayfa Başlığı</title>
</head>
<body>
<h1>Bu bir başlıktır</h1>
<p>Bu bir paragraftır.</p>
</body>
</html>

Örneği satır satır okumak

Doctype önce gelmelidir ki tarayıcı modern HTML kurallarını kullansın
Diğer her şey <html> ... </html> içindedir
<head> başlığı tutar; ziyaretçiler bunu çoğunlukla sekme adında fark eder
<body> sayfa alanında gördüğünüz başlık ve paragrafı tutar
Çoğu öğenin eğik çizgili eşleşen kapanış etiketine ihtiyacı vardır, örneğin </p>

Head ve body

<head>’i sahne arkası notları, <body>’yi sahne gibi düşünün. Arama motorları ve tarayıcılar title ve diğer head verilerini kullanır. Sayfayı okuyanlar body’ye bakar. Ana makale metnini yalnızca head’e koymak yeni başlayanların sık hatasıdır.

İç içe geçme ve sıra

HTML öğeleri iç içe geçer: bir öğe başka bir öğenin içinde olabilir. Etiketleri net bir ağaçta tutun. İç etiketleri dış etiketlerden önce kapatın. Temel iskelet için şu sırayı koruyun: doctype, sonra html, sonra head (title ile), sonra body.

Kendiniz deneyin

Editörünüzde basic.html adlı bir dosya oluşturun
Yukarıdaki örneği yapıştırın
Title metnini ve başlık metnini değiştirin
Dosyayı kaydedin ve tarayıcıda açın
Kaydetme ve yenilemeden sonra sekme başlığı ile sayfa başlığının ikisinin de güncellendiğini doğrulayın

Sonra zaman kazandıran küçük ipuçları

Modern HTML stili için küçük harfli etiket adlarını tercih edin (<p>, <P> değil)
Hangi etiketlerin birlikte olduğunu görmek için iç içe satırları girintileyin
Erken örneklerde ana sayfa başlığı olarak net bir <h1> tutun
Charset, bağlantılar, görseller ve daha fazlasını sonra ekleyeceksiniz; önce bu iskeleti öğrenin

Sık yapılan hatalar

Üstte <!DOCTYPE html>’i unutmak
Etiketleri yanlış sırada kapatmak (örneğin body’den önce html’i kapatmak)
Görünür başlığı yalnızca <head> içine koymak
.html uzantısı olmadan kaydedip tarayıcının tuhaf davranışına şaşırmak
Öğe ikisine de ihtiyaç duyuyorken açılış etiketini kapanış ortağı olmadan yazmak

Özet

Temel bir HTML sayfası doctype, html, head, title ve body kullanır
Title çoğunlukla tarayıcı sekmesinde görünür
Görünür içerik body’ye aittir
Öğeler iç içe geçer; önce iç etiketleri kapatın
Küçük bir dosyayı düzenleyip tarayıcıyı yenileyerek pratik yapın
Sonraki dersler aynı iskeletin üzerine daha fazla öğe ekler

🧠 Bilginizi Test Edin

Başlamaya Hazır

Bilginizi Test Edin

Bu interaktif sınavla kendini test et ve konuyu ne kadar iyi anladığını gör

❓

Sorular

🎯

70%

Geçmek İçin

♾️

∞

Süre

🔄

∞

Deneme

📝 Talimatlar

Her soruyu dikkatle okuyun
Her soru için en iyi cevabı seçin
Quiz'i istediğiniz kadar tekrar alabilirsiniz
İlerlemeniz üstte gösterilecek

Dil