Question de sémantique

Alors que les eleveurs et agriculteurs polluent toujours la Bretagne,
Bernd ecrit ce qui suit en ce 12/07/2009 14:00 :

Bonjour,

Bonjour,

Si vous considérez que cela n'est que vaine argutie, ne vous déchainez
pas sur un pauvre mortel...

(X)HTML n'est pas mort et il n'y a donc aucune raison de styler les
italiques dans une classe particulière, sauf à en modifier les couleurs,
tailles et autres réglages particuliers si on doit créer 2 modèles
différents. Le bon usage voudrait , AMHA, l'économie des moyens et donc
l'utilisation d' <em>, quitte à le styler si besoin.
Il n'y a aucune raison de vouloir compliquer les choses ...

Cordialement,
--
docanski

Portail et annuaire du nord-Bretagne : http://armorance.free.fr/
Guide des champignons d'Europe : http://mycorance.free.fr/
La vallée de la Rance maritime : http://valderance.free.fr/
Les côtes du nord de la Bretagne : http://docarmor.free.fr/

Le 12/07/2009 14:00, Bernd a écrit :

Bonjour,

Un peu à cheval sur ces questions de sémantique ainsi que sur la
typographie, je me demande s'il est préférable d'employer dans une page
xhtml 1.0 (sricte) la balise suivante pour mettre des éléments en
italique :

Si tu es /vraiment/ à cheval sur la sémantique, tu gagnes un aller
simple vers les microformats :
http://fr.wikipedia.org/wiki/Microformat
http://microformats.org/wiki/Main_Page-fr

Et dernièrement un article de openweb :
http://openweb.eu.org/articles/fructifions_donnees

Doit y avoir d'autres choses, mais c'est ce système que je connais.
C'est très très verbeux.

--
Olivier

<http://www.usenet-fr.net/fur/usenet/repondre-sur-usenet.html>

docanski <docanski_morauspam@euphonynet.be.invalid> wrote:

> Si vous considérez que cela n'est que vaine argutie, ne vous déchainez
> pas sur un pauvre mortel...

(X)HTML n'est pas mort et il n'y a donc aucune raison de styler les
italiques dans une classe particulière...

Tanx - de fait "le simple mortel" c'était moi et non le (x)html que
j'utilise encore couramment et qui est bien vivant !
--
A+

Romer

Olivier <ep15SANS@free.fr.invalid> wrote:

Si tu es /vraiment/ à cheval sur la sémantique, tu gagnes un aller
simple vers les microformats :
http://fr.wikipedia.org/wiki/Microformat
http://microformats.org/wiki/Main_Page-fr

Et dernièrement un article de openweb :
http://openweb.eu.org/articles/fructifions_donnees

Doit y avoir d'autres choses, mais c'est ce système que je connais.
C'est très très verbeux.

Cela ressemblerait à du xml avec des trucs en plus que je ne dicerne pas
bien et ça n'a pas l'air, il est vrai, de simplifier les choses.
--
A+

Romer

Bonjour.

"Bernd" <romer@bernd.invalid> a écrit dans le message
de news 1j2qub4.hyrmni1pxm8rcN%romer@bernd.invalid

Un peu à cheval sur ces questions de sémantique ainsi que sur la
typographie, je me demande s'il est préférable d'employer dans une
page xhtml 1.0 (sricte) la balise suivante pour mettre des éléments
en italique :

<p> Jacques <span class="pcap">Hébert</span><br />
<em>directeur de la publication</em></p>

où cette forme :

<p> Jacques <span class="pcap">Hébert</span><br />
<span class="italique">directeur de la publication</span></p>

* "italique" est bien sûr dûment documenté dans le CSS.

Considérant évidemment que le rendu dans les navigateurs est le même
pour "em" comme pour "italic".

Ca, ça dépend de tout et son contraire...

Ce qui m'ennuie avec la première forme, c'est la dissymétrie: si la CSS
fournie est désactivée (choix du visiteur), le nom ne sera pas stylé dans le
texte, alors que le titre le sera (par le style par défaut pour em).
Au fait, pourquoi le prénom est-il exclu ? C'est un projet pour une
administration ?

Ce qui m'ennuie avec la seconde, c'est qu'elle fige définitivement le choix
des italiques pour le titre, ou alors dans une autre CSS, la class .italic
sera en couleur rouge etc. mais ne sera plus en italiques...

Donc, pour la cohérence, je préconise:

- soit d'utiliser pour les deux éléments des balises normalisées et
hiérarchisées (strong et em par exemple),
- soit d'utiliser deux classes aux noms sémantiques plutôt que décidant de
la représentation (nom et titre par exemple),
- soit de combiner les deux si le contexte ne permet pas de garantir des
sélecteurs CSS ciblés.

J'aurais bien prévu aussi la garantie de pouvoir faire un display:none sur
le br, selon la CSS choisie par la suite.
Je me demande aussi si le P est justifié... C'est une signature et il n'y a
qu'un nom, ou c'est une liste ?

--
Cordialement.

* Patrick BRUNET www.ipzb.fr www.ipzb-pro.com
* E-mail: lien sur http://zener131.eu/ContactMe

Patrick 'Zener' Brunet <use.link.in.signature@ddress.invalid> wrote:

Ce qui m'ennuie avec la première forme, c'est la dissymétrie: si la CSS
fournie est désactivée (choix du visiteur), le nom ne sera pas stylé dans le
texte, alors que le titre le sera (par le style par défaut pour em).
Au fait, pourquoi le prénom est-il exclu ? C'est un projet pour une
administration ?

En effet quoique une désactivation des CSS est plutôt rare même si les
anciens navigateurs et les navigateurs texte existent encore.
Le nom est en petite capitale (class pcap) comme il se doit en principe
et le prénom dans la police courante. C'est pour une administration ou
son équivalent.

Je me demande aussi si le P est justifié... C'est une signature et il n'y a
qu'un nom, ou c'est une liste ?

Il ne l'est pas en effet mais je le mets en prévision de pouvoir ensuite
le styler lui aussi. Ce n'est pas une liste.
--
A+

Romer

Bonjour,

Le 12/07/2009 14:00, Bernd a écrit :

Un peu à cheval sur ces questions de sémantique ainsi que sur la
typographie, je me demande s'il est préférable d'employer dans une page
xhtml 1.0 (sricte) la balise suivante pour mettre des éléments en
italique :

<p> Jacques <span class="pcap">Hébert</span><br />
<em>directeur de la publication</em></p>

où cette forme :

<p> Jacques <span class="pcap">Hébert</span><br />
<span class="italique">directeur de la publication</span></p>

Si « pcap » signifie « à mettre en petites capitales » et « italique »
signifie « à mettre en italique », ni l'un ni l'autre ne sont de la
sémantique. La sémantique, c'est que « Hébert » est le nom de famille
de Jacques Hébert et que « directeur de la publication » est sa fonction
ou sa profession, non ?

Dans ce cas, j'écrirais plutôt :
<p>Jacques <span class="nom-famille">Hébert</span><br />
<span class="profession">directeur de la publication</span></p>

Après, si tu veux mettre les noms de famille en petites capitales et les
professions en italique, c'est un choix sur lequel tu pourras très bien
revenir plus tard, sans état d'âme à propos de (par exemple) :
.pcap { font-style: italic; }
.italique { font-style: normal; }

--
Olivier Miakinen

Bonsoir.

"Bernd" <romer@bernd.invalid> a écrit dans le message
de news 1j2rapi.1wuip5tw2vnw3N%romer@bernd.invalid

Patrick 'Zener' Brunet <use.link.in.signature@ddress.invalid> wrote:

Ce qui m'ennuie avec la première forme, c'est la dissymétrie: si
la CSS fournie est désactivée (choix du visiteur), le nom ne sera
pas stylé dans le texte, alors que le titre le sera (par le style
par défaut pour em).

En effet quoique une désactivation des CSS est plutôt rare même si
les anciens navigateurs et les navigateurs texte existent encore.

Il y a l'accessibilité bien sûr (lecture braille ou vocale que l'on espère
bien voir un jour exploiter le balisage standard pour gérer la prosodie).

Sinon, quand je fais de la recherche intensive pour résoudre un bug système
(à transposer pour un autre visiteur), bref la chasse à l'info introuvable,
je me tape des centaines de pages, la plupart hors-sujet mais on ne le sait
qu'après, dont beaucoup sont truffées d'animations, infobulles,
adservers-alakon et autres popups/layers...
Sans parler des CSS géniales genre blanc sur fond jaune avec police de 5px,
ou reformatage dynamique 2 fois au cours du chargement à cause des
positionnements, etc.

Donc dans un but de pure survie, le réflexe est de passer en mode texte pour
me concentrer sur l'info recherchée (c'est triste, mais parfois elle va se
perdre dans les archives ou citations au milieu de telles daubes).

Et donc c'est quand même plus pratique, même dans de telles conditions, de
récupérer une mise en forme sommaire mais exploitable, fondée sur le
balisage standard.

Je suis désolé pour les "artistes" qui seraient effondrés de lire ça. Mais
c'est toujours mieux que les zapper complètement. :o)

--
Cordialement.

* Patrick BRUNET www.ipzb.fr www.ipzb-pro.com
* E-mail: lien sur http://zener131.eu/ContactMe

Olivier Miakinen <om+news@miakinen.net> wrote:

Si « pcap » signifie « à mettre en petites capitales » et « italique »
signifie « à mettre en italique », ni l'un ni l'autre ne sont de la
sémantique. La sémantique, c'est que « Hébert » est le nom de famille
de Jacques Hébert et que « directeur de la publication » est sa fonction
ou sa profession, non ?

Dans ce cas, j'écrirais plutôt :
<p>Jacques <span class="nom-famille">Hébert</span><br />
<span class="profession">directeur de la publication</span></p>

Peut-être mais je souhaite utiliser pcap sans doute pour autre chose -
ça a un sens pour mois tandis que les attibuts de nom-famille seront
sans doute oublié quelques mois plus tard.
Je connais l'objection de styler par ex .rouge {color:red;} mais je
trouve peut-être à tort que c'est tout de même un moyen mnémotechnique
que je ne refuse pas quand la feuille se style occupe 25 pages A4.
Je commence à avoir du mal à savoir qui fait quoi.
--
A+

Romer

Le 7/12/09 10:17 PM, Olivier Miakinen a écrit :

Bonjour,

Le 12/07/2009 14:00, Bernd a écrit :

Un peu à cheval sur ces questions de sémantique ainsi que sur la
typographie, je me demande s'il est préférable d'employer dans une page
xhtml 1.0 (sricte) la balise suivante pour mettre des éléments en
italique :

<p> Jacques <span class="pcap">Hébert</span><br />
<em>directeur de la publication</em></p>

perso <em> me va
le but étant de mettre en relief la fonction du bonhomme
comme ça c'est fait,
et tant mieux s'il n'y a pas besoin de styler la balise pour obtenir
l'italique (ce dont, normalement, on ne devrait pas avoir à
s'intéresser, de quoi j'me mèle là en tant que webmaster ?)

La vrai question à se poser : "italique" est-ce une bonne idée ?
(est-ce que ça va être bien lisible dans la police choisie par
l'utilisateur ?), en utilisant <em> standard on se déculpabilise du +/-
bon choix de l'apparence finale.

De toutes façons "italique" n'a aucun sens "sémantiquement".
C'est juste un effet de style, de présentation.
Il se trouve que conventionnellement l'emphase est représentée en
italique, et ce n'est rien de plus qu'une convention (qu'on peut bien
détourner via les CSS) qui nous fait nous mélanger les pinceaux entre
sémantique et forme.

où cette forme :

<p> Jacques <span class="pcap">Hébert</span><br />
<span class="italique">directeur de la publication</span></p>

Si « pcap » signifie « à mettre en petites capitales » et « italique »
signifie « à mettre en italique », ni l'un ni l'autre ne sont de la
sémantique. La sémantique, c'est que « Hébert » est le nom de famille
de Jacques Hébert et que « directeur de la publication » est sa fonction
ou sa profession, non ?

Ha! mince!
Là, + haut, j'ai un peu radoté ... !

Dans ce cas, j'écrirais plutôt :
<p>Jacques <span class="nom-famille">Hébert</span><br />
<span class="profession">directeur de la publication</span></p>

et moi j'eussions fait :

<p class="identite">Jacques <span>Hébert</span> :<br />
<strong>Directeur de publication</strong></p>

car les surcharges de class ça me fatigue avec un grand F.
(de plus, sémantiquement : je ne vois pas ce que ça apporte ...)
(par contre ... il y a ce truc là ... "microformat". cf + bas)

ou mieux :

<div id="repertoire">
<dl>
<dt>Josè <span>Albado</span></dt>
<dd>Directeur markéting</dd>
</dl>
<dl>
<dt>Jacques <span>Hébert</span></dt>
<dd>Directeur de publication</dd>
</dl>
</div>

et on n'agace personne avec des histoires de couleurs, italiques ou
capitales petites ou grandes dans le HTML (même si traitreusement on les
a prévues dans les CSS)

Question "sémantique" peut-être mieux comme ça ? :

<ul id="repertoire">
<li><dl>
<dt>Josè <span>Albado</span></dt>
<dd>Directeur markéting</dd>
</dl></li>
<li><dl>
<dt>Jacques <span>Hébert</span></dt>
<dd>Directeur de publication</dd>
</dl></li>
</ul>

Après on style les trucs de #repertoire,

#repertoire dt { color: blue }
#repertoire dt span { font-variant:small-caps }
#repertoire dd { font-family: arial; font-style: italic }

ce qui, normalement, devrait clarifier la gestion de la FdS dans
l'avenir (suffit de lister ce qui est lié à "repertoire")
plutôt que de se perdre dans les classes .rouge .italik possiblement
laborieusement additionnées élément par élément dont auxquels il faudra
revenir sur chacun en cas de modif (de la couleur par exemple).

Et puis on peut touj commenter les lignes de la FdS

#repertoire dt { color: blue } /* dt = patronyme */
#repertoire dt span { font-variant: small-caps } /* le nom */
#repertoire dd { font-family: arial; font-style: italic } /*fonction*/

Après, si tu veux mettre les noms de famille en petites capitales et les
professions en italique, c'est un choix sur lequel tu pourras très bien
revenir plus tard, sans état d'âme à propos de (par exemple) :
.pcap { font-style: italic; }
.italique { font-style: normal; }

Je préfère mon système qui à mon idée confusionnera moins.
(j'y ai eut eu une crise de dyslexisme ou pas ?)


Et malgré mon aversion quant à l'utilisation inutile de class, il parait
que dans certains cas et principalement pour les moteurs de recherche,
la répétitivité des class pour un même type d'item serait un plus
(méthode "microformat").

Et si j'ai bien compris, ça pourrait alors nous donner
(sémantique et mini-fiche) :

<ul id="repertoire">
<li>
<dl class="vcard">
<dt class="fn">Josè <span>Albado</span></dt>
<dd class="org">Directeur markéting</dd>
<dd class="tel">01 50 42 10 00</dd>
<dd class="tel work">01 50 42 10 10</dd>
<dd class="tel cell">06 25 42 20 30</dd>
</dl>
</li>
<li>
<dl class="vcard">
<dt class="fn">Jacques <span>Hébert</span></dt>
<dd class="org">Directeur de publication</dd>
<dd class="tel work">01 50 42 10 12</dd>
</dl>
</li>
</ul>

avec la même FdS que précédemment ou, par exemple, celle-ci :

.vcard { border: 1px solid; background: #ffc; padding: 10px }
.vcard dt, .vcard dd { margin: 0.2em 0; padding: 0 }
.vcard .fn { color: blue }
.vcard .fn span { font-variant: small-caps }
.vcard dd { color: black }
.vcard .org { font-style: italic; }
.vcard .tel { font-family: courier; }
.vcard .tel:before { content: "Tél. : " }
.vcard .tel.work:before { content: "(travail) " }
.vcard .tel.cell:before { content: "Tél. (mobile) : "; color:red }


Question:
est-ce que ces CSS et class n'introduisent pas de la sémantique ?
dans la mesure où des mots "significatifs" sont introduits par les
pseudos-éléments 'before' ou 'after'.



Variante :

<ul id="repertoire">
<li class="vcard">
<dl>
<dt class="fn">Josè <span>Albado</span></dt>
<dd class="org">Directeur markéting</dd>
<dd class="tel">01 50 42 10 00</dd>
<dd class="tel work">01 50 42 10 10</dd>
<dd class="tel cell">06 25 42 20 30</dd>
</dl>
</li>
<li class="vcard">
<dl>
<dt class="fn">Jacques <span>Hébert</span></dt>
<dd class="org">Directeur de publication</dd>
<dd class="tel work">01 50 42 10 12</dd>
</dl>
</li>
</ul>

CSS :

.vcard { border: 1px solid; background: #ffc; margin: 0.2em 0;
list-style: none; padding: 10px }
.vcard .fn { color: blue }
.vcard .fn span { font-variant: small-caps }
.vcard dd { color: black }
.vcard .org { font-style: italic; }
.vcard .tel { font-family: courier; }
.vcard .tel:before { content: "Tél. : " }
.vcard .work:after { content: " (travail)" }
.vcard .cell:after { content: " (mobile)"; color:red }


--
sm