HTML5 NEDIR ? HTML5 ILE GELEN YENI ÖZELLIKLER NELERDIR ? HTML5 ILE FLASH ARASINDAKI FARKLAR NELERDIR?

Merhabalar..ALLAH'ın selamı üzerinize olsun..

HTML5, HTML dilinin en son sürümüdür.Fakat şu an geliştirilme aşamasında olduğu için Internet Explorer, Opera, Mozilla Firefox tarafından kısmen desteklenmekte olup, Safari ve Google Chrome tarayıcılarının güncel sürümlerinde geliştirilme aşamasında olsa da daha iyi çalıştığını söyleyebiliriz.HTML5 ile neler yapabileceğimize bakarsak Flash ile yapabildiğimiz animasyonları,web galerilerini, hareketli web sayfalarını vb.yapabilmemiz mümkün..Peki bunları zaten biz Flashla yapıyoruz neden HTML5 kullanalım ? Gibi bir soruyla karşı karşıya kaldığımı düşünerek cevap veriyim.Flasha yaptığınız uygulamaları çalıştırmak için Adobe Flash Player,Silverlight gibi eklentileri kurmanız gerekiyor.HTML5'de böyle eklentiler kurmanıza gerek kalmıyor.Ayrıca Flash ile yaptığımız uygulamalar sunucumuzda fazla yer kaplayabilir.HTML5 ile yaptığımız uygulamaları uzun kodlar yazmadan sunucuyu yormadan çalıştırabiliriz.

HTML5 tabi burada sadece kendi başına yeter değildir.HTML5'i CSS3 ve Javascriptten teknolojileriyle birleştirerek dinamik sayfalar yapabiliriz.Dediğim gibi şu an HTML5 geliştirilme aşamasında olduğu için tarayıcıların bazı sürümleri tarafından desteklenmektedir.Özellikle hepimizin bildiği gibi Internet Explorer 6 sürümü bizlere az CSS'de çektrmedi :) Bunun için cross browsser tekniğini kullanarak bazı uygulamaları IE 6 da,Mozilla da sorunsuz çalıştırabilmek için kullanıyorduk.Tabi hala IE6 kullanan var mı diye sormayın.Bir web developer olarak her türlü ihtimalleri göz önüne alarak uygulamalarınızı bunlara göre geliştirmelisiniz.

HTML5'i ne zaman kullanacağımıza bakarsak 2022 yılında tamamlanması öngörülüyor..Ama her ne kadar 10 yıl var gibi görünse de tarayıcıların HTML5'e verdiği önem,Apple'ın Flash'ı desteklemeyip HTML5'i desteklemesi, Adobe'nin Flash'ı son kez güncelleyeceğini duyurması,Web geliştiricilerinin HTML5'e verdiği önem gibi nedenlerden dolayı benim tahminim 4-5 yıl içerisinde HTML5'in artık tüm sayfalarda kullanılabilecek duruma geleceğidir.

HTML5 İLE FLASH ARASINDAKİ FARKLAR

1) Zaten demin de söylediğim gibi Flash uygulamarını çalıştırabilmeniz için Adobe Flash Player ya da Silverlight gibi bir eklenti kurmanız gerekiyor.Ama HTML5 uygulamalarını çalıştırabilmeniz için herhangi bir eklenti kurmanıza gerek yok.

2)Flash ile yapılan uygulamalar sayfalarda daha hızlı açılırken HTML5'de bu biraz daha yavaştır.Bunu HTML5'in geliştirilme aşamasında olduğuna sayıyorum.Eminim ileriki zamanlarda HTML5 bu sorunu çözecektir.

3)Flash ile sayfaya bir ses ya da video gibi multimedya dosyaları eklemek için uzunca bir kod yazmamız gerekiyordu.Fakat HTML5 de gelen <audio> <video> gibi etiketler sayesinde sayfamıza multimedya dosyalarını rahatlıkla ekliyebiliyoruz.

4)Safari yüklü Mac sistemlerde H.264 oynatımlarında HTML5 Flash'a fark atıyor.Bu da dediğimiz gibi Apple'in HTML5'e önem vermesinden kaynaklanıyor.Ama Windows'ta ise H.264 oynatımında Flash önde gözüküyor.

HTML5 İLE GELEN YENİ ETİKETLER

Tag	Açıklama
<article>	Makale deneme tarzı yazılar bu element içine yazılır.
<aside>	Bu elemet ana içerikten ayrı yazılan kısımdır.
<command>	Bir buton, radio buttonu ve bir onay kutusu için kullanılır
<details>	Detay bilgiler bu element içine yazılır
<summary>	<details> elementine yazılan yazıların başlığı bu element içine yazılır
<figure>	Çeşitli medya içeriği gruplarını belirtir.
<figcaption>	<figure> elementinin başlığını belirtir.
<footer>	Sayfanın alt kısımları (footer) dediğimiz bölgeyi içine alır.
<header>	Sitenin başlık ve açıklama içeriği bu elementin içine yazılır
<hgroup>	<h1> ile <h6> arasındaki tüm başlık gruplarını belirtir.
<mark>	Özellikle öne çıkarılan üstünde durulan kelimeleri belirler.
<meter>	Ölçü biriminin en düşük ve en yüksek biliniyorsa kullanılır
<nav>	Bu element menü navigasyonunu içerir
<progress>	Sayfaya bir adet işlem süreci göstergesi ekler
<ruby>	Çince karakter ve noktalamaları kullanmak için
<rt>	<ruby> elementine açıklama eklemek için kullanılır
<rp>	<ruby> elementini desteklemeyen tarayıcılara verilecek mesaj belirtilir
<section>	Buraya sistenin ana içerik kısmı eklenir.
<time>	Tarih, saat verilerini kapsar.
<wbr>	Kelime sonu. Satır sonunun alternatifi şeklindedir.

HTML5 İLE GELEN YENİ MEDİA ETİKETLERİ

Tag	Description
<audio>	Sayfaya bir adet ses oynatıcı modül ekler
<video>	Sayfaya bir adet video oynatıcı modül ekler
<source>	Medya elementleri için <audio> ve <video> elementleri içinde tanımlanır.
<embed>	Dışardan siteye eklenen componentler bu elementin içine yazılır (Örnek: .swf dosyaları)
<track>	<video> ve <audio> elementleri için text tanımlaması yapar

HTML5 İLE GELEN CANVAS ETİKETİ

Tag	Açıklama
<canvas>	Sayfada bir çizim alanı oluşturur buraya Javascript ile çizim yapılır

HTML5 İLE GELEN FORM ETİKETLERİ

Tag	Açıklama
<datalist>	Giriş değerleri için ayar listeleri.
<keygen>	Kullanıcı girişlerini doğrulama için kullanılır.
<output>	Değişik türdeki çıktılar için kullanılır (Örnek: script çıktıları)

HTML 5 İLE GELEN INPUT-TYPE TÜRLERİ

Tür	Açıklama
tel	Telefon numarası girişi için kullanılır
search	Arama yapmak için kullanılır
url	URL adresi girilecekse kullanılır
email	Bir veya daha fazla e-posta adresi girişi için kullanılır
datetime	Tarih ve zaman değeri girişi için kullanılır
date	Tarih girişi için kullanılır
month	Ay girişi için kullanılır
week	Hafta girişi için kullanılır
time	Zaman girişi için kullanılır.
datetime-local	Yerel zaman girişi için kullanılır
number	Sayısal değer girişi için kullanılır
range	Verilen aralık için sayısal değer girişi sağlar
color	Hexadecimal kod değeri için girişi sağlar

HTML5'TE KALDIRILAN ETİKETLER

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

Eğer bir web geliştirici iseniz HTML5 üzerinde şimdiden çalışmaya başlamalısınız.Önümüzdeki zamanlarda HTML5 ile daha çok karşılaşacağınızdan şüpheniz olmasın.HTML5 ile  artık satırlarca kod yazmanıza gerek kalmadan CSS3 ve Javascript teknolojileri sayfanızda görsel efektler yaratabilecek daha farklı uygulamar geliştirebilecek,etkileşimli formlar ve ara birimler tasarlayabileceksiniz.

İşte sizlere HTML5 ile yapılmış birkaç sayfa:

http://www.keybox.it/

http://www.html5rocks.com/static/demos/20things_pageflip/example/index.html

http://tympanus.net/Tutorials/PhotoStack/