İnternet Explorer Eski Sürümlerinde HTML5 Desteği Sağlamak
HTML5 ve özellikleri hayatımız gireli bayağı bir zaman oluyor. Ancak uygulamalara yansıması o kadarda çok değil. Bende bir kaç projede HTML5 uyguladım. HTML5 yenilikleri ve anlamlı etiketleri ile bizlere avantaj sağlıyor.
Kodlamaya başlamadan hemen bir sorun ile karşılaşıyoruz.
Sorun = Internet Explorer
Eşitliği gerçeğe dönüşüyor. Internet Explorer 9’dan önceki sürümlerde HTML5’in yeni etiketlerini ve özelliklerini desteklemiyor. ie6/ie7/ie8 gibi %28 kullanım oranı sahip tarayıcılar için bir çözüm üretmeliyiz. Biraz araştırınca çeşitli çözüm önerileri ile karşılaşıyoruz.
Javascript ile üretilen güzel bir çözüm mevcut. html5shiv olarak adlandırılan bu teknik temel mantık olarak
{% highlight javascript %} document.createElement("section"); {% endhighlight %}
ile HTML5 eleman desteği olmayan tarayıcılar için js yardımı ile eleman oluşturarak çözüyor. Birde
ve diğer blok-level etiketler için display: block eklemesini yapıyor.
Javascript’i pasif yapan kullanıcılar için bazı çekinceleri olan insanlar olsa da, genel olarak gözardı edilebilecek oranda bir yüzde olması nedeni ile HTML5shiv gayet mantıklı bir çözüm bence.
Kullanımı çok basit. Internet Explorer 9 öncesi için şartlı yorumlarile kontrolü koyup diğer tarayıcılarda yüklenmesini engelleyerek daha mantıklı bir işlem yapıyoruz.
{% highlight html %}
{% endhighlight %}
Ayrıca google hostunda da barındırılıyor bu kod
{% highlight html %}
{% endhighlight %}
Bu şekilde daha hızlı bir erişim sağlanmış olur. Tabi büyük projelerin kendilerinde barındırmaları daha mantıklı.
HTML5shiv HTML5’in yeni etiketlerinin desteğini sağlıyor. Diğer api desteği için Modernizr incelemekte yarar var.
Kaynaklar
- http://net.tutsplus.com/tutorials/html-css-techniques/how-to-make-all-browsers-render-html5-mark-up-correctly-even-ie6/
- http://code.google.com/p/html5shiv/
- http://ejohn.org/blog/html5-doctype/
- http://ejohn.org/blog/html5-shiv/
- http://www.pcpro.co.uk/blogs/2011/03/07/making-html5-work-in-old-versions-of-internet-explorer/
- http://drupal.org/project/remysharp_html5shim
- http://debeterevormgever.nl/en/articles/html5-elements-ie-without-javascript
- http://paulirish.com/2011/the-history-of-the-html5-shiv/ (html5 shiv in geçmişi)
- http://viget.com/inspire/html5-elements-irresponsible-choice-right-now
