Başlıklar ve Paragraflar

Ders 8/45 · 5 dakika · 2 soru · 1 egzersiz

Bu dersin sonunda bir metni doğru başlık seviyeleriyle düzenleyebileceksiniz.

Altı başlık seviyesi

HTML’de h1 ile h6 arasında altı başlık seviyesi vardır. h1 en önemli, h6 en az önemli başlıktır.

<!DOCTYPE html>
<html lang="tr">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Başlıklar</title>
</head>
<body>
  <h1>Birinci seviye</h1>
  <h2>İkinci seviye</h2>
  <h3>Üçüncü seviye</h3>
  <h4>Dördüncü seviye</h4>
  <h5>Beşinci seviye</h5>
  <h6>Altıncı seviye</h6>
  <p>Bu ise bir paragraf.</p>
</body>
</html>

Başlıklar sayfanın içindekiler tablosudur

Başlıkları bir kitabın içindekiler bölümü gibi düşünün:

<!DOCTYPE html>
<html lang="tr">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Köpekler</title>
</head>
<body>
  <h1>Köpekler</h1>
  <p>Köpekler insanların en eski dostlarındandır.</p>

  <h2>Bakım</h2>
  <p>Köpeklerin düzenli bakıma ihtiyacı vardır.</p>

  <h3>Beslenme</h3>
  <p>Günde iki öğün yeterlidir.</p>

  <h3>Egzersiz</h3>
  <p>Her gün yürüyüşe çıkmalıdırlar.</p>

  <h2>Eğitim</h2>
  <p>Eğitime küçük yaşta başlanmalıdır.</p>
</body>
</html>

Beslenme ve Egzersiz, Bakım konusunun alt başlıklarıdır. Bu yüzden h3 olarak yazıldılar.

İyi bir başlık yapısı için:

Sayfanın ana konusunu h1 ile yazın. Genel kabul, sayfada tek bir h1 olmasıdır. Bir ödev veya sınav yönergesi birden fazla h1 istiyorsa yönergeye uyun.
Seviyeleri atlamayın. h2 başlığının altındaki alt başlık h4 değil, h3 olmalıdır.

Başlıklar neden önemli?

Ekran okuyucu kullanan kişiler sayfayı başlıklar arasında atlayarak gezer. Arama motorları da sayfanın neyle ilgili olduğunu anlamak için başlıklara bakar. Bu yüzden önemli olan başlığın boyutu değil, seviyesidir.

Sık yapılan hatalar

Boyutuna göre başlık seçmek. “h1 çok büyük, h3 kullanayım” demeyin. Boyutu CSS ile değiştirmeyi ileride öğreneceğiz.

Yazıyı kalın göstermek için başlık kullanmak. Başlık olmayan bir metni h4 yapmayın.

Soru 1

h2 başlığının altına bir alt başlık ekleyeceksiniz. Hangisini kullanmalısınız?

h3 :: Doğru. Seviyeler birer birer iner.
h5 :: Seviye atlamış olursunuz.
h1 :: h1 sayfanın ana başlığı içindir.

Soru 2

Başlık seviyesini seçerken neye bakmalısınız?

Yazının ne kadar büyük göründüğüne :: Boyut CSS ile değiştirilebilir.
Başlığın sayfa yapısındaki yerine :: Doğru.
Başlıktaki kelime sayısına :: Kelime sayısının bir önemi yoktur.

Bir yazıyı düzenleyin

Hedefteki sayfayı oluşturun. Yalnızca body içine yazılacak kodu yazın. Metinler şöyle olsun: Ana başlık Kediler, altında Kediler evcil hayvanlardır. paragrafı. Sonra Beslenme alt başlığı ve Kediler et yer. paragrafı. Sonra Uyku alt başlığı ve Kediler çok uyur. paragrafı.

<h1>Kediler</h1>
<p>Kediler evcil hayvanlardır.</p>
<h2>Beslenme</h2>
<p>Kediler et yer.</p>
<h2>Uyku</h2>
<p>Kediler çok uyur.</p>

Bu derste öğrendikleriniz

h1 en önemli, h6 en az önemli başlıktır.
Başlıklar sayfanın yapısını anlatır ve seviyeler atlanmaz.
Başlık seviyesi boyuta göre değil, anlama göre seçilir.

Dersi bitirdin mi?Bu dersi tamamladın.

İlerlemen bu tarayıcıda saklanır.