Sites


initiation à HTML5

Utiliser des attributs

Les attributs sont d'autres composants importants du HTML. Ils viennent compléter l'élément et certains attributs sont obligatoires.

Définition et utilisation d'attributs

Si vous essayez ce dernier cas sur votre page HTML, vous verrez qu'aucune image ne s'affiche ans le navigateur. Alors, pour mettre une image, comment allons-nous nous y prendre ? Faudrait-il rajouter une balise supplémentaire ? Eh bien non. Le html n'aime pas trop fractionner les informations de mise en forme : chaque mise en forme a sa balise et il n'y a pas généralement de sous balise (on verra qu'il y a une exception). En fait, lorsqu'il s'agit de donner une précision sur une mise en forme, on utilise des attributs. C'est notre cas ici avec l'image. La balise sert à dire qu'il va falloir mettre une image et c'est l'attribut qui donnera le chemin de celle qui faut mettre.

Utilisation des attributs

Un attribut se met toujours à l'intérieur de la balise ouvrante (uniquement), après l'élément, en laissant bien sûr un espace entre eux de manière à ce qu'ils puissent être différenciés. Une balise peut contenir plusieurs attributs différents, mais chaque attribut doit être suivi du signe = puis d'une valeur encadrée dans des guillemets.

<element attribut1="valeur"> contenu </element>

Dans le cas de l'insertion de l'image nous obtiendrons le code suivant :

 <img src="image.jpg" />

où image.jpg est le nom de fichier de votre image, éventuellement précédé de son chemin d'accès, qui est normalisé en epub et src, son attribut. Un autre exemple très utile en édition électronique et spécifique est la création de lien permettant de passer directement à d'autres ressources internet ou externes. Dans ce cas, la balise est a, une balise double, et l'attribut href, ce qui nous donne :

<a href="http://www.flossmanualsfr.net"> Texte ou image cliquable</a>

Bien sûr, il y a une liste des attributs officiels en HTML. Retenez aussi que certains attributs seront utilisables avec certaines balises, mais pas avec d'autres. Il est cependant inutile de tous les connaître à moins que vous n'ayez de réelles velléités de personnalisation et de contrôle pour plus de détail, reportez-vous à notre référence W3C http://dev.w3.org/html5/spec/single-page.html#elements-1).

Il est possible de cumuler les attributs selon la forme :

<element attribut1="valeur" attribut2="valeur"> contenu </element>
Comme par exemple dans :
<img src="image.jpg" alt="illustration de page accueil montrant notre association présente dans un salon" />

Les attributs sont séparés les uns des autres par des espaces. Certains attributs peuvent parfois posséder plusieurs valeurs. C'est le cas de style, class...

La permissivité du HTML5

Le HTML5, comparé au XHTML, autorise quelques pratiques dites de simplification. Elles n'ont en fait que l'apparence de la simplification et permettant l'écriture de quelques signes en moins et seront perçues bien différemment selon le point de vue adopté.

Suppression des guillemets d'attributs

Le HTML5 étant ce qu'il est, et tentant de faire plaisir à tout le monde, il sera possible dans certains cas de se passer d'encadrer la valeur des attributs par les guillemets. Dans ce cas, que se passe-t-il vos attributs contiennent plusieurs valeurs ? Comment les différencier et les associer ? Les choses se compliquent donc et nous conseillons d'utiliser toujours la même règle pour faciliter les corrections d'erreurs éventuelles et évacuer les doutes sur les choses les plus simples. Le temps occupé à écrire les deux guillemets sera bien inférieur à celui passé à résoudre les problèmes éventuels qui apparaîtront dans le cas de mauvaises interprétations du code par les navigateurs.

Omission de la valeur

En revanche certains attributs peuvent être spécifiés sans leur associer de valeur. Si cela a peu de sens dans certains cas par exemple dans celui d'une image (que serait en effet la balise image sans définir l'image captée par l'attribut src), elle peut cependant avoir un sens particulier dans certains contextes.

Le premier cas est lorsque les attributs sont de type booléen, c'est-à-dire qu'ils n'acceptent que 2 valeurs possibles. C'est le cas par exemple de l'attribut autoplay de l'élément video et qui permet de lancer une vidéo au chargement de la page. On considérera que si l'attribut est présent, c'est que le lancement est automatique et que s'il est absent, il n'aura pas lieu. Dans ce cas, pas besoin de valeur, il est vrai, ce qui est bien plus simple.

 <video src="fichier_video.ogv" type="video/ogg" autoplay />

L'autre cas consiste à utiliser des fonctions javascript pour ajouter automatiquement des valeurs à un attribut. Il est alors possible d'imaginer qu'il n'y a pas de valeur initiale. On peut observer ce comportement dans certains systèmes de galerie web dans lesquelles une image est remplacée par une autre, agissant ainsi sur la valeur de l'attribut src.  Cette pratique ne devrait cependant pas être utilisée par défaut et être particulièrement mûrie.

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.