background preloader

Apprendre le HTML5

Facebook Twitter

HTML Basics. Maîtrisez HTML & CSS - Une sélection des meilleurs cours et exercices [Niveau débutant] W3Schools Online Web Tutorials. HTML5 : Éléments <figure> et <figcaption>. L'élément <figure> ne devrait pas vous être inconnu puisque son rôle est pareil à celui qu'il joue dans les supports papiers tels que les livres ou magazines afin d'illustrer et de légender des photos, des diagrammes, ou encore des schémas.

HTML5 : Éléments <figure> et <figcaption>

Illustration légendée Inaugurés avec HTML5, les éléments <figure> et <figcaption> fonctionnent de concert pour associer une légende à une illustration ou un autre élément média. <figure> <img src="image.jpg" alt="" /> <figcaption>Légende associée</figcaption></figure> Élément <figure> <figure> est une unité de contenu, c'est-à-dire que cet élément sert de conteneur dans lequel s'insèrent divers éléments comme des images, des schémas, des vidéos, des tableaux ou encore des blocs de code.

Élément <figcaption> Enfant direct de <figure>, son rôle est de légender son parent, sous forme de texte et/ou de liens. Quelques applications dans le monde du livre. Afficher une icône favicon dans le navigateur. Une favicon est une icône mise à disposition par un site Web pour enjoliver, en particulier dans les navigateurs Web, les endroits où ce site est mentionné.

Afficher une icône favicon dans le navigateur

Cette icône pourra être utilisée dans la barre d'adresses ou de titre, les favoris (le terme est d'ailleurs un mot-valise né de la contraction de « favorites » et « icon »), les onglets, ou autres raccourcis. (source : Wikipedia) Pour avoir une favicon lisible par la plupart des navigateurs, il est préférable que cette image soit au format .ico. Il s'agit d'un format d'icône propriétaire de Windows, basé sur le BMP. Attention : il est possible que votre logiciel de graphisme habituel ne gère pas ce format, auquel cas ils vous faudra installer un logiciel spécifique pour le convertir, ou encore utiliser un service web proposant la conversion des formats d'image génériques au format .ico (pour ces derniers, voir dans les liens complémentaires ci-dessous).

Les classes conditionnelles en HTML. Les cancres du Web, Internet Explorer 6, 7 et parfois 8, nous mènent souvent la vie dure. Même quand on s’abaisse à leur niveau, il leur arrive de ne pas comprendre, ou d’y mettre de la mauvaise volonté. La solution classique (comprendre: à l’ancienne) est d’utiliser des hacks CSS. Ces derniers sont déconseillés car peu fiables; en effet, on ne sait jamais à l’avance quels seront les navigateurs sur le marché dans deux ou cinq ans, et comment ils comprendront ou pas nos hacks CSS.

Une deuxième solution, conseillée par Microsoft et Alsacréations (que du beau monde :)), est d’utiliser les commentaires conditionnels. Nous allons voir dans cet article que l’utilisation habituelle des commentaires conditionnels a quelques inconvénients, et proposer une technique qui combine plusieurs avantages : les classes conditionnelles. Le problème des commentaires conditionnels Cependant, dans la pratique, une feuille de style corrective pour Internet Explorer ne suffira pas. Les commentaires conditionnels pour Internet Explorer. Les commentaires conditionnels sont un mécanisme propre à Internet Explorer Windows, qui permettent d'inclure dans une page (X)HTML, de manière valide, du code qui ne sera lu et interprété que par Internet Explorer, ou par l'une ou l'autre de ses versions.

Techniquement, il s'agit de simples commentaires HTML, qui seront compris comme tels par la plupart des navigateurs. Cependant, le contenu de ces commentaires a une syntaxe spéciale, qui permet à Internet Explorer de savoir s'il doit interpréter le contenu du commentaire ou bien l'ignorer. Les commentaires conditionnels sont compris par Internet Explorer depuis la version 5.0 mais sont officiellement abandonnés à partir d'Internet Explorer 10. Syntaxe de base L'exemple le plus simple de commentaire conditionnel est le suivant: Rappel: un commentaire conditionnel ne peut être inséré que dans un document (X)HTML, et ne peut contenir que des instructions (X)HTML et non CSS.

Exemple d'utilisation: Viser une version ou un éventail de versions. Support des rôles landmark ARIA et éléments sectionnants HTML5 par les lecteurs d'écran - Blog - AnySurfer.