1 Star2 Stars3 Stars4 Stars5 Stars (Bu yazıya oy vermek ister misiniz?)
Loading...

HTML5’teki Yeni Semantik Elementler

  • 19 Mart 2016
  • 174 kez görüntülendi.
HTML5’teki Yeni Semantik Elementler

HTML5 Yeni elementler, html5 yeni elementler, elementhtml5, html5 yeni elementleri

 

Bundan önceki konumda, html5 hakkında bilgilendirme yapmıştım. Günümüzdeki web sitelerin çoğunlukla HTML5 üzerinden tasarlandığını hepimiz biliyoruz. HTML5’in kod yapısı HTML4 e göre daha kolay ve vazgeçilmezdir. Günümüzdeki html5 sitelerin bir çoğu <div id=”nav”>, <div class=”header”>, or <div id=”footer”> şeklinde tasarlanıyor.
HTML5 için bu tür kodlarda
<header>
<nav>
<section>
<article>
<aside>
<figure>
<figcaption>
<footer>
<details>
<summary>
<mark>
<time>

gibi,  elementler kullanmaktadır.

HTML5 <section> Elementi ;
Bu element, bir dökümanın içindeki kısmı belirtmek için kullanılır.
ÖRNEK

<section>
<h1>Webpaylas</h1>
<p>webpaylas.com içeriği (webpaylas) doğanın…</p>
</section>

HTML5 <article> (Makale) Elementi
Bu element,  bir makale elementidir, forumlarda, bloglarda, haber hikayelerinde,  ve yorumlarda dağıtılabilir.
ÖRNEK

<article>
<h1>Internet Explorer 10</h1>
<p>Internet Explorer 10 (kısaca ….</p>
</article>

HTML5 <nav> Elementi
Bu element, Sitenin navigasyon bölümüne uygulanır. Belgedeki bütün linkler bu element içinde olmalıdır.
ÖRNEK

<nav>
<a href=”http://www.webpaylas.com/web/html5-nedir-kodlar-ve-kullanimi.html”>HTML5 Nedir? Kodlar ve Kullanımı </a><br>
<a href=”www.webpaylas.com”>webpaylas</a><br>
</nav>

HTML5 <aside> Elementi
Bu element, içindeki içerikden farklı olarak başka içerikleri tanımlamak için kullanılır.
ÖRNEK

<aside>
<h4>Web paylas</h4>
<p>2016 yılında web tasarım, programlama, hazır sistemler ve bir çok alanda paylaşım yapmaktadır.</p>
</aside>

HTML5 <header> Elementi
<header> elementi bir döküman ya da bir kısım (section) için bir başlık belirtir. header elementi, içerdiği  içeriyi kapsayıcı olmalıdır. Bir kodlama kullanırken, birden fazla <header> kullanabilirsiniz.
ÖRNEĞİN

<article>
<header>
<h1>Internet Explorer 9</h1>
<p><time pubdate datetime=”2011-03-15″></time></p>
</header>
<p>Windows Internet Explorer 9 (kısaca IE9) 14 Mart 2011, saat 21’de
yayınlanmıştır.</p>
</article>

HTML5 <footer> Elementi
Bu element yazdığınız dökümanda alt bilgi olarak kullanıcıya bilgilendirme yapar. Genellikle, Tasarımı yapılmış bir site, yada telif hakkı olan bir bilgilendirmeyi <footer> üzerinden yazabilirler.
ÖRNEĞİN

<footer>
<p>Kodlama: Okan Cerit</p>
<p>Kodlama : Osman AYDIN</p>
<p>Grafik : Peri</p]
</footer>

HTML5 <figure> ve <figcaption> Elementleri
<figure> elementi, içerisinde bir resim  yada  diyagram veya kod listelerinin olduğunu belirtir.<figure> elementi ana akış ile ilgili olsa da, konumu ana akıştan bağımsızdır ve çıkarılırsa dökümanın akışını engellemez.
<figcaption> etiketi, <figure> elementinin belirttiği resime başlık koymaya yarar..

ÖRNEĞİN:

<figure>
<img src="webpaylas.jpg" alt="Webpaylaş" width="304" height="228">
<figcaption>web. - PHP koding, Turkey.</figcaption>
</figure>

Bir önceki yazımız olan HTML5 Yeni elementler başlıklı makalemizde elementhtml5, HTML5 Yeni elementler ve html5 yeni elementleri hakkında bilgiler verilmektedir.


ZİYARETÇİ YORUMLARI

Henüz yorum yapılmamış. İlk yorumu aşağıdaki form aracılığıyla siz yapabilirsiniz.

BİR YORUM YAZ
sayaç