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