YÜKLENİYOR...

HTML Dersleri

  • Anasayfa
  • header, nav, section, footer, article HTML5 ile Gelen Bölümlendirme Etiketleri
header, nav, section, footer, article HTML5 ile Gelen Bölümlendirme Etiketleri - html, html dersleri, header, header etiketi, nav, nav etiketi, section, section etiketi, footer, footer etiketi, article, article etiketi, html bölümlendirme, bölümlendirme etiketleri, #04
Ahmet Aydın - 08/01/2021 - 31 Görüntülenme

header, nav, section, footer, article HTML5 ile Gelen Bölümlendirme Etiketleri

Merhaba, bu makalede Sıfırdan HTML Derslerine devam ediyoruz ve HTML5 ile gelen, body etiketinin açma ve kapatma etiketleri arasında kullandığımız bölümlendirme etiketlerinden olan header etiketi, nav etiketi, section etiketi, footer etiketi ve article etiketi yapılarını inceleyeceğiz. Bu bilgileri ders videosunu izleyerek ve ders dosyalarını indirip inceleyerek pekiştirebileceğinizi unutmayınız.

Öncelikle buradaki etiketlerin, tek başlarına kullanıldıklarında bir anlam ifade etmediklerini sadece bölümlendirilen alanların anlamlı bir hale getirilmelerini sağladıklarını bilmemiz gerekiyor. Buradaki tüm etiketlerde açma ve kapatma işlemlerini gerçekleştiriyoruz.

header Etiketi

HTML sayfamızda veya HTML sayfamızda bulunan herhangi bir bölümde, baş kısmı veya başlığın geleceği bölümü ifade eden etikettir. Web sayfamızın baş bölümünü temsil etmesi için header etiketini body etiketinin açma ve kapatma etiketleri arasında, en üst bölümde oluşturabiliriz. Web sayfamızı stillendirmek için bir kapsayıcı bölüm kullanılmış olabilir. O zaman da kapsayıcı etiketin açma ve kapatma etiketlerinin en üst bölümünde header etiketini oluşturabiliriz. Mümkün olan en dış bölümün, en üst bölümünde header etiketini oluşturarak web sayfamızın baş kısmını temsil etmesini sağlamış oluyoruz.

header etiketi, web sayfamızın baş kısmını temsil ettiğinde genellikle logo, marka, slogan gibi içerikleri barındırır. Bu tasarımdan tasarıma değişebilmektedir.

nav Etiketi

Web sitemizin sayfaları arasında gezinmek için oluşturacağımız bağlantıların bulunacağı bölümü temsil eden etikettir. Navigation kelimesinin kısaltılmış olarak kullanılan halidir. Türkçeye “Gezinme” olarak çevrilebilir. Web sayfamızda bulunan bağlantıları yani menü alanımızı nav etiketinin açma ve kapatma etiketleri arasında oluşturabiliriz.

section Etiketi

Web sayfamızda özel bir anlamı olmayan genel bölümlendirmeler için kullandığımız etikettir. Örneğin web sayfasının içerik bölümünü temsil etmesi için section etiketini oluşturabiliriz. Yine farklı bölümlendirme etiketlerinin açma ve kapatma etiketleri arasında da section etiketi kullanılabilmektedir.

footer Etiketi

HTML sayfamızda veya HTML sayfamızda bulunan herhangi bir bölümün en alt kısmını temsil eden etikettir. Örneğin web sayfalarının en altında bulunan copyright bölümleri için footer etiketi kullanılabilir. Tabi burada sadece copyright metni değil farklı bölümler de oluşturulabilir. footer etiketi tüm bu alanları kapsayarak web sayfasının en alt kısmını temsil edebilir.

article Etiketi

Web sayfamızda bulunan makale/yazı gibi içerikleri temsil eden etikettir. Kelime anlamı olarak da makale demektir. Makalelerimizi article etiketinin açma ve kapatma etiketleri arasında yazmamız onları HTML sayfamızda daha anlamalı hale getirecektir. article etiketi sadece bir makalenin bütününü değil makaleye ait kısa/ön yazıları da içerisinde barındırabilir.

HTML5 ile gelen bölümlendirme etiketleri ile düzenli bir kodlama oluşturulduğunu söylemek istiyorum. Bu etiketlerin kullanımı zorunlu değil ancak kod düzeni ve bölümlerin anlamlı hale getirilmesi için kullanılmasını önermekteyim.

Bu makalede Sıfırdan HTML Derslerine devam ettik ve HTML5 ile gelen, body etiketinin açma ve kapatma etiketleri arasında kullandığımız bölümlendirme etiketlerinden olan header etiketi, nav etiketi, section etiketi, footer etiketi ve article etiketi yapılarını inceledik.

Bu bilgileri ders videosunu izleyerek ve ders dosyalarını indirip inceleyerek pekiştirebileceğinizi hatırlatmak istiyorum. Ahmet Aydın Youtube Kanalı’na abone olabilir ve burada olmayan paylaşımlardan da faydalanabilirsiniz. Umarım yararlı bir yazı olmuştur. Bir sonraki makalede görüşebilmek dileğiyle kodla kalın, hoşça kalın...