Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there any way of moving to HTML 5 and still promise multi browser compatibility?

Tags:

I am a designer whose main marketing strategy is multi browser compatibility. I assure my clients that the site will work even in IE6 (!).

Of late i have been pondering over the question of moving to HTML 5. The reason behind my apprehension is that IE6 is still a major player in terms of market share and i don't want to lose it.

Is there any way of moving to HTML 5 and still promise multi browser compatibility?

Thank you.

like image 273
ZX12R Avatar asked May 19 '10 10:05

ZX12R


People also ask

Is HTML5 supported by all older browsers?

HTML5 is now compatible with all popular browsers (Chrome, Firefox, Safari, IE9, and Opera) and with the introduction of DOCTYPE, it is even possible to have a few HTML features in older versions of Internet Explorer too.

Can I use HTML 5?

HTML5 is supported by all the major browsers, including Chrome, Firefox, Safari, Opera, as well as iOS for Chrome and Safari and Android browsers. It can even work with the older and less popular browsers like Internet Explorer.


1 Answers

Yes, by taking baby steps.

To start with, you can switch to the HTML5 doctype: <!DOCTYPE html>. This switches just about every browser out there into "standards" mode, the same as an HTML 4 strict doctype.

Then there's the new elements. Internet Explorer can't natively style them, but a handy little bit of javascript fixes that up: http://code.google.com/p/html5shiv/

If you or your tools aren't ready for that (e.g. some CMSs strip out HTML tags they don't understand), then in the interim you could use classes, e.g. instead of <article>, use <div class="article">.

As for the new form controls, they're backwards compatible too. So <input type="email"> will work exactly the same way as <input type="text"> in browsers that don't support it. If necessary you can use javascript to fill in the gaps. See http://diveintohtml5.ep.io/forms.html for more on that.

As for <video> and <audio>, you can fall back to <object> for older browsers - e.g. http://camendesign.com/code/video_for_everybody. Meanwhile <canvas> can be emulated in javascript, e.g. http://code.google.com/p/explorercanvas/.

like image 124
Olly Hodgson Avatar answered Sep 22 '22 05:09

Olly Hodgson