HTML5 DOCTYPE kısa öz, diğerleri gibi değil.
<!DOCTYPE html>Charset dil tanımlaması ise ;
<meta charset="ISO-8859-9">Yine meta etiketini incelersek alabileceği değerleri görebiliriz. HTML eski sürümlerinde <meta> etiketine verilebilen scheme değeri HTML5 ile desteklenmemektedir.
Oluşturduğum sayfa ;
- Header
- Nav
- Aside
- Article
- Footer
Benim hazırladığım tasarım ise ;
http://www.telays.com/replication/html5.html
Kötü olduğuna bakmayın sadece örneklendirme olsun diye =)
Tanıyacağımız yeni HTML5 ile gelen etiketler ;
<header> <footer> <article> <aside> <nav> <video> <mark> <figure> <figcaption> <details> <summary>HEADER ;
header etiketi adından da anlaşılacağı üzere başlık için kullanılır. İlla sayfanın tepesinde olacak diye bir şey yok article içinde de kullanılabilirdi. Amaç başlık olması.
<header></header>
FOOTER ;
Yine footer etiketide header etiketi gibi belgede birden fazla kere bulunabilir. Alt bilgi içerir. Bu bilgilerde genel telif hakları, iletişim vb.
<footer></footer>ARTICLE ;
article etiketi bir yazı dizisinde kullanılabilir. Site içinde etiket sayesinde herşeyden bağımsız belirtilir ve dağıtımı kolay olur.
<article></article>
ASIDE ;
Kenar bilgisi sidebar gibi düşünebiliriz.
<aside></aside>NAV ;
nav genelde menü yapısı için kullanılır. Örnektede gördüğünüz gibi menü için kullanılmış.
<nav><a href="/html/">Programlama</a> |<a href="/html5/">Internet Admin</a> |<a href="/css/">E-Ticaret</a> |</nav>VIDEO ;
video etiketinin daha önce anlatımı yapıldı.
http://www.telays.com/showthread.php?t=89
MARK;
mark etiketinin daha önce anlatımı yapıldı.
http://www.telays.com/showthread.php?t=93
FIGURE;
Figure etiketi içine aldığımız değerin kod bloğu,çizim,foto vb. olduğunu belirtir. figcaption ile bağlantılı kullanılabilir.
FIGCAPTION;
Figure etiketinde gösterilen olayın başlığını belirler.
<figure><img src="http://www.telays.com/telays.png" alt="Telays" /> <figcaption>Telays.Com Destek Banneri</figcaption> </figure>DETAILS ve SUMMARY ;
Details ve summary beraber kullanılırlar. Açılır kapanır panel şeklindedir.
<details><summary>Copyright 2012.</summary><p> Telays.Com</p><p> Webmaster Bilgi Merkezi</p></details>METER ;
meter genelde bir olayın bir durumun tamamlanmasını bitiş durumunu, o anki durumu grafik ile gösterir.
kullanımı ;
Forum Skoru : <meter value="8" min="0" max="10"></meter><br /> Ticaret Puanı : <meter min="0" low="40" high="90" max="100" value="95"></meter><br/>TIME ;
Henüz hiç bir tarayıcı tarafından desteklenmiyor.
<time>10.06.2012</time>Tüm browserler desteklemeyebilir dikkatli olmanızı öneririm
Kaynak : http://www.telays.com/showthread.php?t=95
