Soucieux d'accompagner le développement d'application web de plus en plus riche, le HTML5 définit un certain nombre de nouvelles possibilités en terme d'interface. Dans ce cas, il ne s'agit plus réellement de mettre en forme le texte, mais d'ouvrir de nouveaux champs de possibles.
La barre de progression est pratique pour les contenus lourds. Elle permet d'informer l'utilisateur du temps d'attente approximatif et de l'évolution de cette attente.
La balise Progress donne accès simplement à cette fonctionnalité :
<section>
<p>Téléchargement <progress></progress> </p>
</section>
Ce qui donnera dans le navigateur :
Téléchargement
Pour contrôler de façon précise l'évolution du temps et la progression de la barre, il sera nécessaire d'avoir recours à des scripts javascripts.
La balise meter permet de représenter une certaine quantité à partir d'une quantité connue, comme par exemple un pourcentage. Elle permettra ainsi d'en avoir un rendu très simplement avec le minimum de recours aux images et avec le minimum de code.
Pour cela, meter va devoir être accompagné de plusieurs attributs. Le plus important des attributs est value. Il permet de spécifier la quantité. Si celle-ci est en proportion (à 100%), il suffira de spécifier sa valeur sur une base chiffrée allant de 0 à 1 :
<meter value="0.75" />
S'il s'agit d'une valeur absolue comprise entre deux quantités spécifiées, il faudra alors les mentionner avec les attributs min et max. Joints à value, le navigateur se chargera de faire la bonne représentation :
<meter min="0" max="20" value="10" />
Cependant, il conviendra d'assurer un contenu de remplacement pour les navigateurs qui ne seraient pas compatibles. cela peut se faire avec du texte :
J'ai eu la note de <meter min="0" max="20" value="10">10</meter>
soit avec une image
<meter min="0" max="20" value="10"><img src="image-10.png" alt="note de 10" /></meter>
Il y a une erreur de communication avec le serveur Booktype. Nous ne savons pas actuellement où est le problème.
Vous devriez rafraîchir la page.