HTML5, internet'in çekirdek teknolojilerinden HTML işaretleme standardının beşinci sürümüdür. Internet Explorer, Mozilla Firefox ve Opera tarayıcılarının güncel sürümleri tarafından kısmen desteklenmektedir. Kısaca H5 Google Chrome ve Safari tarayıcılarının güncel sürümleri üzerinde deneme aşamasında da olsa çok daha iyi bir şekilde çalışmaktadır. Günümüzde kullanılan HTML 4.1 sürümü, CSS desteğiyle ne kadar düzenli ve sağlam bir yapıda kodlanırsa kodlansın yine de fazladan yazılan kodların işlevselliği bozduğu bilinmektedir. Bu yüzden HTML 5 bu ihtiyaçları karşılamak adına geliştirilmeye başlanmıştır. Video paylaşım sitesi Youtube, deneme aşamasında HTML5'i kullanıcılarına sunmaktadır.

HTML5 kullanmak aynı zamanda UI (kullanıcı arabirimi) mühendislerinin ve back end (sunucu uygulama) geliştiricilerinin sadece tek codebase kullanımından yararlanabiliyor olmaları demektir. Yapının temelleri aynı kalsa da, her platforma entegre edilmiş back end layerlar ve görüntüler olabilecektir. Bu, birbirine bağlı bir ürün tecrübesinin yaratılmasına yardım eden ürün çizgisinin karşısında, gelişimin yayılma sürecini hızlandırmaktadır.

Ses veya film etiketleri gibi birçok spesifik yönleriyle birlikte kullanılması gereken HTML 5, sadece bir biçimleme dili olmasından ziyade web uygulamaları yaratmakta da kullanılabilmektedir. CSS3 ve JavaScript ile birleştirmek çok daha güçlü uyumlu ve sağlam uygulamaları mümkün kılmaktadır. Uygulamalar bu sayede binlerce cihazda birçok ihtimale uygun şekilde kullanılabilmektedir. Özellikle de iliştirilmiş platformlar ve bağlanmış cihazlarla çok daha güçlü olacaklardır.

HTML5 tüm HTML Sürümleri (HTML1.0 vb) ile uyumludur, ileride uyumlu kalması planlanmaktadır.

Yeni elementler

·         <canvas>: Sayfada bir tuval alanı oluşturur. Tuvale çizim javascript ile yapılabilir.

·         <audio>: Sayfaya ses oynatıcı bir modül ekler.

·         <video> : Video oynatıcı bir modül ekler.

·         <progress> : İşlem süreci göstergesi ekler.

·         <caption> : Başlık olarak düşünülen metinleri düzenler.

·         <header> : Sitenin başlık ve açıklama içeriğini alır.

·         <nav> : Menüleri ve bir takım zaruri işlevleri içine alır.

·         <footer> : Sitelerin en alt kısmını içine alır.

·         <section> : Sitelerin ana içerik kısmını içine alır.

·         <aside> : Ana içerikte ayrı yazılan kısımdır.

·         <article> : Makale, deneme tarzı yazıları kapsar.

·         <embed> : Dışarıdan eklenen componentler için kullanılır. (Örn : .swf uzantılı dosyalar.)

·         <details> : Detay bilgisi içerir.

·         <summary> : Yazının başlığını belirler.

·         <time> : Tarih ve saat verilerini kapsar.

·         <mark> : Yazı içerisinde özellikle üstünde durulan kelimeleri belirler.

·         <figcaption> : <figure> elementinin başlığını belirler.

·         <figure> : Çeşitli medya içeriği gruplarını belirler.

·         <hgroup> : Başlık grubunu belirtir. H1, H2 gibi başlık elementleri burada tanımlanabilir.

·         <datalist> : Düzenlenebilir elementlere otomatik tamamlama özelliği verilmesini sağlar.

Html 5’te artık desteklenmeyen Html elementleri :

<acronym>, <applet>, <basefont>, <big>, <center>, <dir>, <font>, <frame>, <frameset>, <noframes>, <s>, <strike>, <tt>, <u>, <xmp>

<section> elementi

Sayfaları bölümlere ayırmak ve bu bölümleri isimlendirmek ziyaretçiye sayfada ulaşmak istediği veriye daha kolay ulaşması açısından yardımcı olacaktır. Örneğin ziyaretçi kolayca bir makaleden diğerine “devam et” benzeri linklere ihtiyaç duymadan geçebilir. Sayfa tasarımcısı ise bir çok sayfa oluşturma derdinden kurtulacak ve <div>’ler arasında boğulmayacak.

<header> ve <footer> elementleri

Bu elementler sayesinde sayfaların başlık kısmı ve son kısımlaırnı kolayca işaretleyebiliriz.

<nav> elementi

<nav> elementi ile blogroll veya link kısmı şeklinde ki bölümlerinizi kolayca belirleyebilirsiniz.

<aside> elementi

<aside> elementi ile sidebar’larınızı kolayca belirtebilir, CSS ile tüm önce ki elementler gibi şekillendirebilirsiniz.

Tüm bu belirtme elementleri bizi karışık <div> elementlerinden kurtarıyor ve stil işlemlerimizde bize kolaylık sağlıyor.

<article> elementi

Bu element ile sayfamızda gireceğimiz content yani içerik kısmını kolayca belirtebilir, CSS ile şekillendirebiliriz.

<video> ve <audio> elementleri

Ses ve video içerikleri 56K modemleri çöpe attığımız günlerden beri hayatımızda oldukça fazla rol alıyor, facebook, youtube, dailymotion, last.fm gibi bir çok web uygulaması sayesinde internette geçen her saniyemizde yeni bir medya dosyası okuyoruz.

Html 4 ne yazık ki bu medya içeriklerini kendi içerisinde barındırmaktan acizdi. Bu yüzden web uygulamaları Flash, QuickTime, MediaPlayer gibi plug-in’ler sayesinde bu eksikliği gideriyordu.

Flash gibi plug-in’ler sayesinde yayıncılar kendi medya yürütme arayüzlerini şekillendirebiliyor, kullanıcıya farklı medya yürütme seçenekleri sunabiliyordu (farklı play-stop özellikleri, HD kalitesi, HQ-SQ kalite seçenekleri vb.

Yeni gelen <video> elementi ile tüm bunlar artık Html’in kendi özelliği haline geldi.

“poster” özelliği ile video başlamadan önce video ekranında görünecek resmi seçebilirsiniz. MPEG-4 gibi video formatları ise kendi “poster” gösterme özelliklerini içerilerinde barındırıyor.

Audio elementinin çalışma mantığı video elementiyle benzer.

Html 5’in video ve audio elementlerinin özellikler bunlarla da sınırlı değil, dilediğiniz video oynatma codec’lerini belirtme özgürlüğüne sahipsiniz.

Bu iki elementi detaylı bir biçimde öğrenmek için bu adresi ziyaret ediniz.

<input> elementine eklenen yeni özellikler

Html 5 bir çok input özelliğini de kendisiyle beraber getirdi.

• tel

• search

• url

• email

• datetime

• date

• month

• week

• time

• datetime-local

• number

• range

• color