Oude browsers en HTML5

Eerder heb ik het al gehad over HTML5. Toen ben ik ingegaan op de nieuwe DOCTYPE en de HTML tag. Vandaag gaan we het hebben over de belangrijkste nieuwe HTML5 elementen en hoe je deze kunt laten herkennen in de oudere Internet Explorer versies. Aangezien die deze normaal gesproken niet zien en hier dus ook niets met de CSS zullen doen die je schrijft.

HTML5 laten herkennen

Om de oudere versies van Internet Explorer de nieuwe elementen van HTML5 te laten herkennen zul je een stukje JavaScript moeten aanroepen. Het volgende moet je in de HEAD sectie van je bestand plaatsen:

<!--[if lt IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

Nu zullen de oudere versies van Internet Explorer de nieuwe HTML5 elementen herkennen, maar dat is nog niet alles.

HTML5 CSS styling

Om ook de elementen de stijl te laten overnemen van de CSS in Internet Explorer zal je aan alle HTML5 elementen een stukje CSS moeten toevoegen. Dit komt omdat Internet Explorer elementen die hij niet kent standaard display:inline; meegeeft terwijl het een block element moet worden. Het volgende dien je in je CSS toe te voegen:

article, aside, figure, footer, header, hgroup,
menu, nav, section { display:block; }

Andere oude browsers en andere HTML5 elementen

Oudere versies van andere browsers zullen deze elementen wel zien en dus ook gewoon netjes renderen. Het is gewoon weer Internet Explorer die het weer niet voor elkaar heeft. Verder zijn er uiteraard nog de nieuwe Form elementen en de MultiMedia elementen in HTML5. De nieuwe Form elementen in HTML5 zullen door alle browsers gerenderd worden als text elementen. Dus dat gaat gewoon goed.

De Video en Audio elementen van HTML5 zijn zo ontwikkeld dat ze een fallback toelaten naar Flash, dus dit zal in alle gevallen netjes gaan, ook in IE.

Vorige Portfolio item

Meer nieuws items

Vorige Portfolio item

Nieuws