Article ve section

<article> ve <section> etiketlerinin farkını öğrenirsin.

Article etiketi

<article> etiketi başlı başına duran, bağımsız bir içerik parçasını işaretler. Bir blog yazısı, bir haber ya da bir yorum gibi içeriğin başkasına taşındığında da anlamını koruması beklenir.

Örnek: <article><h2>Yazı Başlığı</h2><p>Yazı metni...</p></article>. İçine genellikle bir başlık ve gövde metni konur. Bir sayfada birden çok <article> olabilir; örneğin ana sayfada her özet yazı ayrı bir <article> olabilir.

Section etiketi

<section> etiketi bir tema etrafında toplanan bir bölümü işaretler. İçinde genellikle bir başlık bulunur ve sayfayı anlamlı parçalara bölmeye yarar. Article'dan farkı: section bağımsız bir içerik değil, bir sayfanın parçasıdır.

Örnek: <section><h2>Yorumlar</h2><p>Yorum metni...</p></section>. Burada sayfanın yorumlar bölümü işaretlenir. Birbiriyle ilişkili birkaç bölümü gruplarken <section> kullanılır.

Uygulama Article ve section yaz

Body içine bir <section> ekle; içinde bir <h2> olsun, metni Son Yazılar olsun. Section içine bir <article> ekle; içinde bir <h3> ve bir <p> olsun. <h3>'ün metni İlk Yazı, <p>'nin metni Kısa açıklama. olsun.

Örnek çözümü göster

<body>
  <section>
    <h2>Son Yazılar</h2>
    <article>
      <h3>İlk Yazı</h3>
      <p>Kısa açıklama.</p>
    </article>
  </section>
</body>

Kendini test et

Aşağıdakilerden hangisi <article> için en uygun içeriktir?
- Sayfanın alt kısmı
- Bir menü
- Bir resim galerisi
- Tek bir blog yazısı
Cevabı göster

Tek bir blog yazısı — Doğru. Bir blog yazısı bağımsız bir içerik olduğu için article içine uyar.

Section'ı tamamla

<____>
  <h2>Hizmetler</h2>
  <p>Sunduğumuz hizmetler...</p>
</section>

Cevabı göster

<section>
  <h2>Hizmetler</h2>
  <p>Sunduğumuz hizmetler...</p>
</section>

Etiketi rolüyle eşleştir

<article>

Bağımsız içerik
<section>

Tema bölümü
<header>

Üst kısım
<h2>

Alt başlık

Sıradaki ders: Aside ve address

Deneyiminizi Geliştiriyoruz

Çerez Tercihleri

Kesinlikle Gerekli Çerezler

Analitik Çerezler