HTML5 ile Ne Değişti?

HTML5HTML5‘in ayak sesleri duyulduğunda çok sert bir geçiş sürecinin bizi beklediğiniz düşünmüştük. Fakat korkulan olmadı. Eski elemanlara sağlanan destek yavaşça kesildi ve HTML5’in yenilikleri yerlerini teker teker aldı.

Bu makalemizde HTML5’in beraberinde getirdiği elemanları ve tarihin tozlu sayfalarına gömülecek olan eski kod birimlerini konuşacağız.

İşte karşınızda ilk ve tek tam liste!

HTML5

HTML, HTML 4.01 isimleri 1999 yılında hizmete sunulmuştu. Fakat artık yerlerini gelişmekte olan HTML5 ‘e bırakmaktalar.

HTML5 web geliştiricilerinin kodlamalarında kullanabileceği en güncel iskelet sistemdir. Web 1.0‘ın asosyal tasarımları Web 2.0 ile kullanıcılarına kucak açmıştı. Adını sık sık andığımız Web 3.0 ile de etkileşim tavan yapmakta.

HTML5’i tüm detaylarıyla tanımak için buradaki makalemize bakabilirsiniz.

Makaleye devam etmeden önce block ve inline terimlerini tanımamız gerekiyor.

  • Block elemanlar : Bu elemanlar display:block özelliğine sahiptir ve ayrı bir satır olarak gözükürler. Örneğin h1 veya div gibi…
  • Inline elemanlar : Bu elemanlar display:inline özelliğine sahiptir ve eklendikleri satırda yapıyı bozmadan gözükürler. Örneğin b veya a gibi…

Desteklenen veya desteği süren block elemanlar

Bu listedeki öğelerin bir kısmı daha öncede kullanılırken bir kısmı da HTML5 ile yeni aramıza katıldı. Display:block özelliğine sahip bu elemanlar hala tam desteğe sahipler.

article, aside, blockquote, body, br, button, canvas, caption, col, colgroup, dd, div, dl, dt, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, li, map, object, ol, output, p, pre, progress, section, table, tbody, textarea, tfoot, th, thead, tr, ul, video

Desteklenen veya desteği süren inline elemanlar

Bu listedeki öğelerin bir kısmı daha öncede kullanılırken bir kısmı da HTML5 ile yeni aramıza katıldı. Display:inline özelliğine sahip bu elemanlar hala tam desteğe sahipler.

a, abbr, address, area, audio, b, cite, code, del, details, dfn, command, datalist, em, font, i, iframe, img, input, ins, kbd, label, legend, link, mark, meter, nav, optgroup, option, q, small, select, source, span, strong, sub, summary, sup, tbody, td, time, var

Desteklenen tüm elemanlar

Üstteki iki listenin tamamı, HTML5’in resmi olarak desteklediği birimler :

a, abbr, address, area, article, aside, audio, b, blockquote, body, br, button, canvas, caption, cite, code, col, colgroup, command, datalist, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, font, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, hr, html, i, iframe, img, input, ins, kbd, label, legend, li, link, map, mark, meter, nav, object, ol, optgroup, option, output, p, pre, progress, q, section, select, small, source, span, strong, sub, summary, sup, table, tbody, tbody, td, textarea, tfoot, th, thead, time, tr, ul, var, video

Desteği kesilen elemanlar

Bu elemanlar artık HTML5 ile desteklenmiyor. Yani ömürlerinin son demlerini yaşıyorlar. Hala aktif olarak kullanılabilir olmaları sizi yanıltmasın, yerlerini daha güncel versiyonları aldı bile.

acronym, applet, basefont, big, center, dir, font, frame, frameset, isindex, noframes, s, strike, tt, u

Çıkarılan elemanlar HTML5 ile yerlerine gelenler
<acronym>FBI</acronym> <abbr>FBI</abbr>
<applet>x</applet> <object>
<basefont color=”red” /> <body style=”color:red”>
<big>x</big> <span style=”font-size:2em”>x</span>
<center>x</center> <div style=”text-align:center”>x</div>
<dir><li>x</li></dir> <dl><dt>x</dt></dl>
<font color=”red”>x</font> <span style=”color:red”>x</span>
<frameset cols=”100%”> <frame src=”x.htm”>

<noframes>x</noframes> </frameset>

<div> <iframe src=”x.htm”></iframe> </div>
<isindex> <script>s=prompt(‘Msg’);</script>
<s>x</s> <strike>x</strike> <span style=”text-decoration:line-through”> x</span>
<tt>x</tt> <span style=”font-family:Courier”>x</span>
<u>u</u> <span style=”text-decoration:underline”> x</span>

Kapanış

Listeler bu şekilde. HTML5 süreci gayet esnek ilerliyor. Dolayısıyla eski tip kod birimleri hala çalışmakta. Fakat sizlere tavsiyemiz, şimdiden HTML5 elemanlarını tanımanız ve tasarımlarınızda onlara yer vermeniz. Bu konuyla alakalı onlarca makalemiz mevcut. HTML5 kategorimize göz atmayı sakın unutmayın.

İyi çalışmalar.