Aujourd'hui la question que tout les développeurs web se posent est peut-on faire du HTML 5 et du css 3 à l'heure actuel et surtout qu'est ce qu'on fait des navigateurs jeter au rebut.
Actuellement quasi tout les navigateurs modernes prennent en compte le HTML 5 et le CSS 3.
Quand on dit navigateur moderne tout le monde pense directement a firefox et non IE
normal rien de plus logique ! Les problèmes qui se pointe a l'horizon de ce navigateur est que les versions IE 6 et 7 ils ne reconnaissent déjà pas tout le CSS2 donc imaginé les dégâts avec le CSS3.
HTML 5 apportant pas mal de nouveauté reste basé sur son prédécesseur HTML 4.01
Le Doctype HTML5 s'écrit de la sorte :
- Code: Tout sélectionner
<!DOCTYPE html>
Votre document est alors identifié comme étant en HTML 5
Les nouveaux éléments
Parmi les nouveaux éléments apportés par HTML5
- Code: Tout sélectionner
<header> : en-tête de la page
<nav> : liens de navigation
<section> : section de contenu
<figure> : pour regrouper des images et leur description
<footer> pied de page
La majorité des navigateurs web ne reconnaissent pas ces éléments, ils vont être identifié comme étant de type en ligne c'est à dire un
- Code: Tout sélectionner
<span>
Mais rien nous empêche de lui appliquer un
- Code: Tout sélectionner
display:block;
Là ou ça coince c'est avec notre grand ami IE8 et version inférieures ont besoin d'un petit code javascript sous peine de rien n'afficher si celui-ci n'est pas présent.
Pour celà il suffit d'appeler un script dans votre page HTML5 comme ceci:
- Code: Tout sélectionner
<!--[if IE]><script src="scripts/html5-ie.js"></script><![endif]-->
Et voici le contenu du fichier js
- Code: Tout sélectionner
document.createElement("header");
document.createElement("footer");
document.createElement("section");
document.createElement("aside");
document.createElement("nav");
document.createElement("article");
document.createElement("figure");
Grâce a ce javascript vous aller pouvoir disposé des principales balises du HTML 5 dans vos pages et qui seront interpréter correctement par IE.
L'attribut "role"
L'attribut "role" vient du XHTML 2 qui permet d'ajouter du contexte aux éléments.
Le HTML 5 définit une liste d'attribut pour cette balise "role":
- Code: Tout sélectionner
main: définit le contenu principal d'un document
secondary : représente une section unique et secondaire du document, tel que l'heure, la météo ou autre module de ce genre
navigation : définit le menu de navigation du document. Typique de liens vers d'autres pages du site ou vers d'autres endroits de la page
banner: située en haut de page, elle contient habituellement le logo de la société, les éléments publicitaires,...
contentinfo : informations à propos du contenu de la page : notes, copyrights, mentions légales, ...
definition: représente la définition d'un élément
note : correspond à une note entre parenthèse ou de bas de page
seealso : indique que l'élément contient des données contextuelles au contenu principal de la page
search: la section de recherche d'une page. Typiquement un formulaire de recherche
Le Validateur HTML du W3C permet d'ores-et-déjà de valider du code HTML5 sans réglages particuliers à apporter.
ღ ♥Kornette 
News
Plan de site
SitemapIndex
Flux RSS