Introduction aux éléments de phrase
Ce sont des éléments qui ont été spécifiés dans la version html 4.0, ils sont tous des éléments de type en-ligne (inline : éléments incorporés), ils permettent de coller une
signification structurelle à une partie de texte dans un paragraphe par exemple. Ces éléments sont très utiles pour les personnes qui se soucient du respect de la
sémantique.
Tous les éléments de phrase suivent les règles d'imbrication soumises aux éléments inline à part les deux balises <del> et <ins> qui ont un traitement particulier.
La balise <abbr> (Abbreviation
: abréviation)
Cette balise permet d'introduire une abréviation, cet élément sous-estimé permet d'associer une appellation complète à une abréviation grâce à l'attribut "title" qui reçoit comme valeur le nom complet d'une abréviation.
Exemple
<p>La <abbr title="Tout va augmenter">TVA</abbr> est une taxe indirecte supportée par le consommateur final.</p>
Rendu visuel
La TVA est une taxe indirecte supportée par le consommateur final.
Commentaires
- lorsque vous passez le curseur au-dessus de l'abréviation, une bulle d'aide contenant la valeur de l'attribut "title" apparaît et ce pour tous les navigateurs sauf Internet Explorer 6 ;
- dans cet exemple l'abréviation TVA est connue pour la plupart des gens, mais dans d'autres exemples on peut avoir une
abréviation particulière inventée conventionnellement par exemple entre certains individus ou au sein d'une organisation (entreprise, association etc.), dans ce cas elle sera étrangère pour beaucoup de gens, c'est pourquoi il a fallut lui associer le nom complet, comme ça les gens ne seront pas perturbés par des sigles étrangers ;
- les navigateurs Firefox, Netscape, Mozilla, Opera et K-Meleon soulignent l'abréviation avec un trait sous forme de pointillé, Internet Explorer 7 se contente d'afficher la bulle d'aide au passage du curseur ;
- un robot d'indexation (spider) peut indexer l'abréviation mais pas son nom complet, pour qu'il prenne en compte le texte complet de l'abréviation vous devez obligatoirement utiliser la balise <abbr> et l'attribut "title".
La balise <acronym> (acronym
: acronyme)
La balise <acronym> a le même mécanisme de fonctionnement que la balise <abbr> mais avec une petite différence qui naît de l'essence même des deux mots :
- la balise <abbr> est destinée pour les sigles qui se prononcent lettre par lettre (php, html, tva) ;
- la balise <acronym> est destinée pour les acronymes c'est-à-dire des sigles qui se
prononcent comme étant un seul mot (OPEP, incoterm etc.).
L'intérêt de ces deux balises apparaît certainement lors de l'utilisation d'un navigateur de synthèse
vocale, ce qui est placé dans la balise <acronym> sera lu comme étant un seul mot mais pour une abréviation introduite avec la balise <abbr> elle sera lu lettre par lettre ce qui rend la navigation plus accessible surtout pour les personnes déficientes (les mal-voyants).
Les balises <del> et <ins>
- la balise <del> marque un texte qui a été supprimé (del : delete : supprimer) généralement parce qu'il est erroné. Le texte supprimé est affiché avec un
style barré ;
- la balise <ins> marque un texte qui a été ajouté (ins : insert : insérer). Le texte nouvellement inséré est affiché en style souligné ;
- ces balises peuvent être employées pour un site qui n'est pas stable et qui est en cours d'élaboration ;
- on peut combiner les deux balises pour marquer un texte erroné et mentionner le texte de correction ;
- les deux balises <del> et <ins> peuvent recevoir les attributs facultatifs suivants :
- datetime : date et heure de la suppression ou insertion, elle doit répondre au format : aaaa-MM-jjThh:mm:ss±hh:mm:ss (on mentionne tout d'abord la date, puis l'heure et enfin le décalage avec le fuseau horaire GMT qui peut être négatif ou positif.
- cite : contient une URL vers une ressource qui contient des justifications à propos de l'insertion ou de la suppression ;
- title : un petit titre indiquant la cause de la suppression ou insertion ;
- les deux balises peuvent être utilisées en tant qu'élément bloc (block) ou en-ligne (inline), selon le contexte c'est-à-dire si elles sont placées directement dans l'élément <body> elles seront considérées comme un bloc, mais si elles sont placées dans un autre bloc, elles seront assimilées à des balises de type "en-ligne" ;
- si les deux balises <del> et <ins> sont utilisées en tant qu'éléments "en-ligne" elles ne doivent plus
contenir aucun bloc ;
- les deux balises ne doivent surtout pas utilisées pour des raisons de présentation mais uniquement pour des raisons de sémantique, pour un texte barrée ou souligné utilisez la propriété css : text-decoration.
Extrait du DTD strict des balises <del> et <ins>
<!--
ins/del are allowed in block and inline content, but its
inappropriate to include block content within an ins element
occurring in inline content.
-->
<!ELEMENT ins %Flow;>
<!ATTLIST ins
%attrs;
cite %URI; #IMPLIED
datetime %Datetime; #IMPLIED
>
<!ELEMENT del %Flow;>
<!ATTLIST del
%attrs;
cite %URI; #IMPLIED
datetime %Datetime; #IMPLIED
>
- les éléments ins et del acceptent tous les autres éléments : texte (PCDATA), élément en-ligne et bloc. Ces éléments ont un caractère assez particulier, leur statut dépend de leur contenu, si elles entourent du texte ou des éléments en-ligne, elles seront considérées comme des éléments de type en-ligne et par voie de conséquence doivent respecter les règles d'imbrication liées aux éléments en-ligne, dans le cas contraire, les deux balises <ins> et <del> seront assimilées à des éléments "bloc".
- le w3c autorise ins et del dans les éléments bloc et en-ligne (lisez le commentaire), mais nous recommande de ne pas mettre les balises <ins> et <del> dans des éléments en-ligne si elles englobent des éléments de type bloc (car dans ce cas elles ont acquis le statut d'un bloc, or un bloc ne doit pas apparaître dans un inline
).
- les balises <ins> et <del> acceptent deux attributs facultatifs (IMPLIED) cite et datetime.
Exemple
<p>Le management est une science <ins datetime="2008-02-27T17:08:00+04:30" cite="http://www.management.com"
title="le management est à la fois art et science"> et un art.</ins></p>
<p>Le html permet de créer des pages web, <del datetime="2008-02-27T17:08:00" cite="xhtml.php"
title="C'est le PHP qui permet de créer des scripts exécutables dans le serveur">et des scripts exécutables dans le serveur</del></p>
<p>La deuxième guerre mondiale s'est produite en <del datetime="2008-02-27T17:08:00" cite="guerre2.html"
title="la vraie date est 1986">1949</del> <ins>1986</ins></p>
Rendu visuel
Le management est une science et un art.
Le html permet de créer des pages web, et des scripts exécutables dans le serveur
La deuxième guerre mondiale s'est produite en 1949 1986
Commentaires
- lorsque vous survolez le texte supprimé ou ajouté, le navigateur affiche une bulle d'aide qui contient La valeur de l'attribut "title".
- si vous naviguez sous Firefox, Netscape ou Mozilla, vous pouvez cliquez sur le bouton droit au-dessus du texte supprimé ou ajouté pour visualiser une fenêtre qui contient les valeurs des trois attributs "title", "datetime" et "cite".
- si vous n'êtes pas satisfait par le rendu visuel par défaut du texte supprimé qui apparait en style barré, vous pouvez lui appliquer un autre style avec les propriétés css de formatage de texte font et la propriété css color, ou les deux propriétés css : display ou visibility.
- l'un des exemples vivants de l'utilisation de ces deux balises et celui utilisé par les auteurs qui traduisent les spécifications du w3c, en fait il y a des gens qui traduisent bénévolement les
recommandations du w3c en français (ou toute autre langage) et demandent à tous les lecteurs de leur signaler les
erreurs qu'ils ont détecter lors de la lecture du document, ainsi l'auteur corrige le document en ajoutant la balise <ins> pour le texte inséré et la balise <del> pour le texte supprimé. Les gens qui ont
déjà consulté le document n'auront pas à faire une nouvelle relecture mais simplement de lire la partie ajoutée et de prendre conscience de la partie supprimée.
Les balises <em> (emphasis : emphase) et <strong> (fort)
Les deux balises <em> et <strong> permettent de mettre en exergue un mot ou une portion de texte. La différence qui existe entre les deux balises c'est que em est moins intense que strong. Les deux balises sont de type en-ligne.
Tous les navigateurs mettent l'élément <em> en italique et l'élément <strong> en gras. Ces deux éléments doivent être utilisés pour des raisons de sémantique et non pas à des fins de
formatage de texte. Si vous entendez mettre du texte en italique ou en gras uniquement sans marquer un texte comme étant important utilisez les deux
variantes suivantes :
- mise en gras :
- mise en italique :
La balise <dfn> (definition : définition)
La balise <dfn> permet de marquer une définition, cet élément est affiché par défaut en style italique par tous les navigateurs.
Exemple
<p> <dfn>Le marketing</dfn> est un ensemble d'actions coordonnées qui concourent
au développement des ventes d'un produit ou service</p>
Rendu visuel
Le marketing est un ensemble d'actions coordonnées qui concourent
au développement des ventes d'un produit ou service.
La balise <kbd>
La balise <kbd> permet d'indiquer à l'utilisateur un texte qu'il doit taper par exemple dans les éléments d'un formulaire telle qu'une zone de texte, l'élément <kbd> est affiché par défaut en une police non proportionnelle (police courrier).
Exemple
<p>Mettez votre sensation à propos de notre produit, si vous n'avez pas de commentaires à signaler mettez <kbd>indifférent.</kbd></p>
Aperçu
Mettez votre sensation à propos de notre produit, si vous n'avez pas de commentaires à signaler mettez indifférent.
Dans le prochain chapitre vous allez apprendre certaines balises rarement utilisées et qui font partie des éléments de phrase. Rien ne vous empêche d'en jeter un coup d'oeil, juste pour accroître votre culture générale 
Sinon vous pouvez sauter le prochain chapitre, et ça ne vas pas vous priver de grande chose
(les éléments de phrase : code, samp et var).
