Home CSS3 / HTML5 Html5 Dersleri-2 | Header, Footer Elementleri Kullanımı
Html5 Dersleri-2 | Header, Footer Elementleri Kullanımı

Html5 Dersleri-2 | Header, Footer Elementleri Kullanımı

538
2

Merhaba Arkadaşlar, Html5 dersleri ile ilgili 1. Dersimizde birkaç şey anlatmıştık. Daha doğrusu html5 ile html arasındaki farklarını anlatarak kısaca html5 derslerine giriş yaptık. Artık yeni dersimizde sizlere, html5 le gelen yeni elementlerden  bahsedeceğim. Bu dersi videolu değilde  yazılı olarak yazmakta faydalı görüyorum. Çünkü yazacağım örnekleri sizde not defterine kopyala yapıştır yaparak hızlıca deneyebileceksiniz.

1. Konu <header> elementi:  Html5 ile gelen yeni elementlerden birisidir. Bu element başlık etiketi olarak sizlere sunulmaktadır. Tabi burda dikkat edilmesi gereken şeylerden bir tanesi bu etiketin <head> etiketiyle uzaktan yakından hiçbir alakası olmadığıdır. <head> etiketi <body> etiketinden önce kullanılırken,<header> etiketi <body> etiketinden sonra kullanılan bir elementtir.

Örnek 1:

<!DOCTYPE html>
<html>
<head>
<title>HTML5 header etiketi örneği</title>
</head>
<body>
<header>
<h1>Sayfanın en üstünde yer alan başlığıdır.</h1>
</header>
</body>
</html>

( Not: <header>elementi  tüm web tarayıcılarının son sürümleri tarafından desteklenir. Internet Explorer 8 veya önceki sürümlerinde  desteklemez. Bu element genelde ,daha sonra göreceğimiz <article> elementinin içinde yer alır. )

 

1. Konu <footer> elementi: Alt bilgi elementi sayfanın en altında yer alan kısımdır. Yukarıda bahsedilen <header> elementi nasıl sitenin üst bilgi elementi ise <footer> elementi ise sitenin alt bilgi elementidir. Bu kısım sitenin en altını oluşturduğu için burada genellikle web sayfanın yazarı, sitenin kullanım şartları , iletişim bilgileri gibi bilgiler yer alabilir.

Örnek 2:

<!DOCTYPE html>
<html>
<head>
<title>HTML5 footer elementi örneği </title>
</head>
<body>
<article>
<footer>
Footer içeriği yer alır.( iletişim bilgileri, web site sahibi vs.
</footer>
</article>
</body>
</html>

 

Diğer derslerde birlikte olmak dileğiyle. Bizi okumaya devam edin. 🙂

DERS ANLATIMLARI

( Başlıklara Tıklayarak Diğer Derslere Geçebilirsiniz)

DERS1: HTML 5 Nedir? ve Html5 Anlatım

DERS2:Html5 Dersleri-2 | Header, Footer Elementleri Kullanımı

DERS3: Html5 Dersleri-3 | Nav Elementi Kullanımı

DERS4: Html5 Dersleri-4 | Article ve Section Elementi Kullanımı

DERS5: Html5 Dersleri-5 | Aside Elementi Kullanımı

DERS6: Html5 Dersleri-6 | video, audio Elementleri Kullanımı

(538)

omerbozalan 1981 doğumluyum. Üniversite eğitimimi, Sakarya Ünv. Elektronik ve Bilgisayar Öğretmenliğini bitirerek tamamladım. Ayrıca C Sınıfı İş Sağlığı ve Güvenliği Uzmanıyım. 2014 Nisan ayında Adobe Dreamweaver CS6 Kitabımı yayınlayarak tüm bildiklerimi sizlerle paylaşmak istedim. Kendimi Web Tasarım, Grafik Tasarım, Donanım konusunda hâlâ geliştirmekteyim.

Yorum(2)

  1. merhaba ömer bey youtube videolarınızı izliyorum gerçekten yararlı bilgiler vermişsiniz.. ben web sitesi yapmak istiyorum ama en baştan başlayarak ve kes-kopyalayla değilde tasarım olarak -yazılım olarak -hangi kitapları veya siteleri önerirsiniz ? yazılım olarak php çalışmak istiyorum ama başlangıç olarak kitap önerirseniz sevinirim … başarılar diliyorum ..

Yorum bırakın

E-posta adresiniz yayınlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir

Bu site, istenmeyenleri azaltmak için Akismet kullanıyor. Yorum verilerinizin nasıl işlendiği hakkında daha fazla bilgi edinin.