Caractères gras et CSS
-
- Lézard vert
- Messages : 194
- Inscription : 13 nov. 2004, 08:54
Caractères gras et CSS
Bonjour,
Je souhaite différencier complétement le fond (texte sous HTML) de la forme (CSS) comme mes lectures, questions et réponses dans ce forum m'incitent à le faire. Je me pose une question (encore ? la 3ème aujourd'hui... désolé !) :
Cette question concerne l'utilisation de la "balise" <b> qui devient obsolète, semble-t-il et est aisément remplacée par un "font-weight: bold;" en CSS. Mais ce n'est pas trop pratique lorsqu'on ne veut mettre en gras qu'un seul mot dans un paragraphe... Faut-il créer un style spécifique à l'aide de la balise <span> ou peut-on sémantiquement, tolérer l'usage du <b> ?
Question annexe :
En CSS, quand on nomme (baptise) un style, faut-il lui donner un nom sans rapport avec son rendu ou peut-on l'évoquer dans son "nommage" ? Exemple, je veux donner une couleur spécifique à certains liens... est-il bien venu de le baptiser par exemple a.Pink {...} ou vaut-il mieux dé-corréler son nom de la couleur...
Merci d'avance...
Je souhaite différencier complétement le fond (texte sous HTML) de la forme (CSS) comme mes lectures, questions et réponses dans ce forum m'incitent à le faire. Je me pose une question (encore ? la 3ème aujourd'hui... désolé !) :
Cette question concerne l'utilisation de la "balise" <b> qui devient obsolète, semble-t-il et est aisément remplacée par un "font-weight: bold;" en CSS. Mais ce n'est pas trop pratique lorsqu'on ne veut mettre en gras qu'un seul mot dans un paragraphe... Faut-il créer un style spécifique à l'aide de la balise <span> ou peut-on sémantiquement, tolérer l'usage du <b> ?
Question annexe :
En CSS, quand on nomme (baptise) un style, faut-il lui donner un nom sans rapport avec son rendu ou peut-on l'évoquer dans son "nommage" ? Exemple, je veux donner une couleur spécifique à certains liens... est-il bien venu de le baptiser par exemple a.Pink {...} ou vaut-il mieux dé-corréler son nom de la couleur...
Merci d'avance...
Bienheureux les fêlés car ils laissent passer la lumière...
Re: Caractères gras et CSS
Tout dépend de ce que tu veux faire. Si c'est juste pour décorer, alors il faut effectivement utiliser un font-weight:bold;. MAIS je doute que ce soit là à titre purement décoratif dans ton cas, mais que c'est bel et bien dans le but de mettre en évidence ton texte que tu as cette balise <b>.Mirovinben a écrit :Bonjour,
Je souhaite différencier complétement le fond (texte sous HTML) de la forme (CSS) comme mes lectures, questions et réponses dans ce forum m'incitent à le faire. Je me pose une question (encore ? la 3ème aujourd'hui... désolé !) :
Cette question concerne l'utilisation de la "balise" <b> qui devient obsolète, semble-t-il et est aisément remplacée par un "font-weight: bold;" en CSS. Mais ce n'est pas trop pratique lorsqu'on ne veut mettre en gras qu'un seul mot dans un paragraphe... Faut-il créer un style spécifique à l'aide de la balise <span> ou peut-on sémantiquement, tolérer l'usage du <b> ?
Dans ce cas, il existe des moyens de mettre en évidence des morceaux de texte Ce sont les éléments em et strong, em servant à mettre de l'emphase sur le texte, et strong a mettre une emphase plus forte. À toi de choisir lequel tu veux, sachant que em est souvent rendu en italiques dans les navigateurs graphiques et strong en gras. Mais via les CSS tu peux très bien mettre en gras tes em si tu estimes que c'est une simple emphase que tu veux, et qu'il n'y a pas d'insistance forte dessus
Mieux vaut effectivement mettre un nom sans rapport avec le rendu, mais plutôt un nom en rapport avec le sens que tu donne à la classe.Mirovinben a écrit :Question annexe :
En CSS, quand on nomme (baptise) un style, faut-il lui donner un nom sans rapport avec son rendu ou peut-on l'évoquer dans son "nommage" ? Exemple, je veux donner une couleur spécifique à certains liens... est-il bien venu de le baptiser par exemple a.Pink {...} ou vaut-il mieux dé-corréler son nom de la couleur...
Merci d'avance...
Dans ton cas ta classe "pink" le jour où tu trouve que le rose est plus drole mais que tu veux la mettre en vert vif... eh ben tu es embêté, tandis que si tu lui a mis un nom représentant à quoi elle sert, tu pourra facilement changer sa représentation graphique. Quelques exemples dans les trucs et astuces du W3C : Use class with semantics in mind.
-
- Lézard vert
- Messages : 194
- Inscription : 13 nov. 2004, 08:54
Merci Calimo d'avoir si rapidement et si exhaustivement répondu à mes 2 questions.
Pour la première, je voulais me simplifier la frappe (un peu cossard l'gars pour tapper <span class="xxx">...</span> !!) et je vais adopter <em> plutôt que <b> ou <strong> qui se rapprochent trop de ma 2ème question "pink" ou "pas pink"... quitte à enrichir mon <em> dans la CSS en fonction du conteneur qui, lui, aura un "id" ou une "class" selon mes besoins...
Pour la deuxième, ça confirme ce que je pensais... autant dé-corréler totalement...
Pour la première, je voulais me simplifier la frappe (un peu cossard l'gars pour tapper <span class="xxx">...</span> !!) et je vais adopter <em> plutôt que <b> ou <strong> qui se rapprochent trop de ma 2ème question "pink" ou "pas pink"... quitte à enrichir mon <em> dans la CSS en fonction du conteneur qui, lui, aura un "id" ou une "class" selon mes besoins...
Pour la deuxième, ça confirme ce que je pensais... autant dé-corréler totalement...
Bienheureux les fêlés car ils laissent passer la lumière...
<strong></strong> remplace <b> en XHTML me semble t'il ...
il n'est pas forcément nécessaire de passer par CSS pour utiliser le gras me semble t'il ...
en tout cas <strong> valide en XHTML strict ...
il n'est pas forcément nécessaire de passer par CSS pour utiliser le gras me semble t'il ...
en tout cas <strong> valide en XHTML strict ...
“La médiocrité obtiendra immanquablement la préséance en se travestissant des oripeaux de la bienséance.”
-
- Lézard vert
- Messages : 194
- Inscription : 13 nov. 2004, 08:54
Tout à fait d'accord avec toi, "HP"... mais si on veut séparer la forme du fond on doit légitimement s'interdire l'usage de balises modifiant l'affichage d'un texte dans le code HTML et faire migrer cette mise en forme dans la CSS. Et le mot "strong" évoque trop précisément la mise en "gras" d'un texte... qui peut éventuellement être affiché dans une couleur différente, en italique, gras ou avec une taille de caractère plus grande. Le fait de s'affranchir d'une balise trop explicite rendra la maintenance de la CSS plus aisée (voir les réponses très intéressantes de Calimo à mes différentes questions)...
Je sais, je donne l'impression de couper les cheveux en quatre mais à l'étape où je suis dans mon utilisation de plus en plus intensive des CSS, une erreur de choix peut entraîner une perte de temps et d'énergie dont je souhaite me passer.
Vous ne pouvez pas imaginer la révolution culturelle que je suis en train de vivre !... Mon but est d'arriver à construire un site qui puisse fonctionner comme Zen Garden (URL ?): changer complètement l'apparence d'un site sans toucher à son contenu en changeant simplement de feuille de style. Le site de Calimo (?) http://extensions.geckozone.org/Accueil est pas mal également dans le genre.
Je sais, je donne l'impression de couper les cheveux en quatre mais à l'étape où je suis dans mon utilisation de plus en plus intensive des CSS, une erreur de choix peut entraîner une perte de temps et d'énergie dont je souhaite me passer.
Vous ne pouvez pas imaginer la révolution culturelle que je suis en train de vivre !... Mon but est d'arriver à construire un site qui puisse fonctionner comme Zen Garden (URL ?): changer complètement l'apparence d'un site sans toucher à son contenu en changeant simplement de feuille de style. Le site de Calimo (?) http://extensions.geckozone.org/Accueil est pas mal également dans le genre.
Bienheureux les fêlés car ils laissent passer la lumière...
enfin à mon sens si gras, barré (<del>) ou italique sont utilisés à bon escient,
ces balises ont autant de sens que les balises de titre (<h1>, <h2>, etc ) ...
la feuille de style pourrait par exemple venir ajouter des effets de couleur par dessus, mais leur place en dur dans le code se justifie aisément à mon sens, ce ne sont pas de simples balises de mise en forme.
ces balises ont autant de sens que les balises de titre (<h1>, <h2>, etc ) ...
la feuille de style pourrait par exemple venir ajouter des effets de couleur par dessus, mais leur place en dur dans le code se justifie aisément à mon sens, ce ne sont pas de simples balises de mise en forme.
“La médiocrité obtiendra immanquablement la préséance en se travestissant des oripeaux de la bienséance.”
-
- Lézard vert
- Messages : 194
- Inscription : 13 nov. 2004, 08:54
C'est tout à fait vrai...
Le mieux est d'utiliser ces balises dans le Html ET de les re-définir dans la CSS. Ce que je fais déjà avec h1..h6 (mais la signification de ce que peut représenter h1..h6 n'est pas indiqué textuellement dans la balise, contrairement à <b>, <i> ou <strong>...
voui ! je pinaille mais j'avance grâce à vous tous !
Le mieux est d'utiliser ces balises dans le Html ET de les re-définir dans la CSS. Ce que je fais déjà avec h1..h6 (mais la signification de ce que peut représenter h1..h6 n'est pas indiqué textuellement dans la balise, contrairement à <b>, <i> ou <strong>...
voui ! je pinaille mais j'avance grâce à vous tous !
Bienheureux les fêlés car ils laissent passer la lumière...
par contre une question que je me pose c'est pourquoi de HTML à XHTML des balises comme <b> sont devenues <strong>, <strike> est devenu <del> ...
je me demande un peu la nécessité de ces changements ...
je me demande un peu la nécessité de ces changements ...
“La médiocrité obtiendra immanquablement la préséance en se travestissant des oripeaux de la bienséance.”
-
- Lézard vert
- Messages : 194
- Inscription : 13 nov. 2004, 08:54
J'ai fait un tour sur le site d'Alsacréation - page traitant de ces balises... c'est intéressant. Par contre il semble que l'obsolescence de certaines balises soit controversée...
Bienheureux les fêlés car ils laissent passer la lumière...
Arg, au secours, STOOOOP, vous êtes complètement faux là !!!
b=bold (gras)
strong=mise en exergue forte.
Ce n'est pas du tout pareil. Sauf erreur de ma part, "b" valide en XHTML 1.0 Strict. On peut, par convention, devoir mettre un mot en gras sans vouloir y mettre une emphase.
En tous cas "i" peut se justifier parfois, par exemple dans les noms latins des animaux, il est admis qu'on les mets en italiques. Cela ne veut pas dire qu'on y mets une emphase, pas du tout, c'est juste une convention pour les représenter. Dans ce cas, <i> a tout son sens, et il ne faudrait pas mettre de <em>. C'est rare mais ça existe.
Strong comme je l'ai dit est défini par : Indique une mise en exergue plus forte. Je ne vois pas où tu vois le rapport avec une mise en gras. Le gras c'est juste la manière commune qu'ont les navigateurs graphiques pour la représenter. Mais ce n'est pas du tout, mais alors vraiment pas son sens
b=bold/gras
strong=mise en emphase forte, et il se trouve qu'il est représenté par la mise en gras dans les navigateur graphiques.
i=italique
em=emphase, et il se trouve qu'il est représenté par la mise en italiques dans les navigateur graphiques.
strike=barré
del=supprimé, et il se trouve qu'il est représenté en barré dans les navigateur graphiques.
u=underline/souligné
ins=ajouté, et il se trouve qu'il est représenté par le soulignement dans les navigateur graphiques.
Non, il ne remplace pas, il a un sens différent.HP a écrit :<strong></strong> remplace <b> en XHTML me semble t'il ...
il n'est pas forcément nécessaire de passer par CSS pour utiliser le gras me semble t'il ...
b=bold (gras)
strong=mise en exergue forte.
Ce n'est pas du tout pareil. Sauf erreur de ma part, "b" valide en XHTML 1.0 Strict. On peut, par convention, devoir mettre un mot en gras sans vouloir y mettre une emphase.
En tous cas "i" peut se justifier parfois, par exemple dans les noms latins des animaux, il est admis qu'on les mets en italiques. Cela ne veut pas dire qu'on y mets une emphase, pas du tout, c'est juste une convention pour les représenter. Dans ce cas, <i> a tout son sens, et il ne faudrait pas mettre de <em>. C'est rare mais ça existe.
Et aussi en HTML 4.01 transitionnel. Et probablement aussi en HTML 3.2 etc.HP a écrit :en tout cas <strong> valide en XHTML strict ...
Ah bon ? Tu trouves ? Moi pas !Mirovinben a écrit :Et le mot "strong" évoque trop précisément la mise en "gras" d'un texte...
Strong comme je l'ai dit est défini par : Indique une mise en exergue plus forte. Je ne vois pas où tu vois le rapport avec une mise en gras. Le gras c'est juste la manière commune qu'ont les navigateurs graphiques pour la représenter. Mais ce n'est pas du tout, mais alors vraiment pas son sens
http://www.csszengarden.com/tr/francais/Mirovinben a écrit :Zen Garden (URL ?)
Argh ! Mais où as-tu vu que del=barré ? Lis les spécifications bon sang !HP a écrit :enfin à mon sens si gras, barré (<del>) ou italique sont utilisés à bon escient,
Le barré ce n'est que la manière de rendre cette suppression dans un navigateur graphique !Dans les spécifications il y a écrit :Les éléments INS et DEL sont utilisés pour marquer les parties d'un document qui ont été insérées ou supprimées, afin de suivre l'évolution des versions de ce document
Ce ne sont pas DU TOUT des balises de mise en forme ! Mais alors vraiment pas du tout du tout. Ce sont des balises qui indiquent la fonction ou l'état d'un bout de texte. Alors c'est vrai que les navigateurs graphiques leur attribuent un style par défaut, mais il ne faut pas le confondre avec leur sens.HP a écrit :mais leur place en dur dans le code se justifie aisément à mon sens, ce ne sont pas de simples balises de mise en forme.
J'espère que tu as compris pourquoi ce que tu as écrit est totalement-archi-absolument faux ? Si non je réexplique Mais c'est très important de bien comprendre la différence.HP a écrit :par contre une question que je me pose c'est pourquoi de HTML à XHTML des balises comme <b> sont devenues <strong>, <strike> est devenu <del> ...
je me demande un peu la nécessité de ces changements ...
b=bold/gras
strong=mise en emphase forte, et il se trouve qu'il est représenté par la mise en gras dans les navigateur graphiques.
i=italique
em=emphase, et il se trouve qu'il est représenté par la mise en italiques dans les navigateur graphiques.
strike=barré
del=supprimé, et il se trouve qu'il est représenté en barré dans les navigateur graphiques.
u=underline/souligné
ins=ajouté, et il se trouve qu'il est représenté par le soulignement dans les navigateur graphiques.
Mais il valide en XHTML 1.0 TransitionnelHP a écrit :et pourquoi <strike> ne valide pas en XHTML ?
je pensais à le remplacer par <del> du coup ...
mais finalement, je ne sais plus trop quoi faire !
Par contre il ne valide pas en HTML 4.01... strict
Tout dépend du sens qu'il a. C'est juste purement et uniquement décoratif ? Un text-decoration:line-trough (ou un truc du genre) est parfait. Mais si c'est un passage supprimé --> del
Si c'est autre chose, il faut trouver encore autre chose.
-
- Lézard vert
- Messages : 194
- Inscription : 13 nov. 2004, 08:54
Heu... juste pour mettre mon grain de sel en attendant que les pages perso de Wanadoo soient à nouveau disponibles :
Je crois me rappeler que "strong" chez les imprimeurs typographes signife (signifiait ?) "caractère gras"... mais je n'en suis plus si certain.
Quoiqu'il en soit j'utiliserai <em> parceque c'est moins fatiguant à saisir...
Dans mon Harrap's "strong" = "fort"...
Je crois me rappeler que "strong" chez les imprimeurs typographes signife (signifiait ?) "caractère gras"... mais je n'en suis plus si certain.
Quoiqu'il en soit j'utiliserai <em> parceque c'est moins fatiguant à saisir...
Dans mon Harrap's "strong" = "fort"...
Bienheureux les fêlés car ils laissent passer la lumière...
OK ...calimo a écrit :Tout dépend du sens qu'il a. C'est juste purement et uniquement décoratif ? Un text-decoration:line-trough (ou un truc du genre) est parfait. Mais si c'est un passage supprimé --> del
je me servirai d'un <del> comme prévu ...
idem chez moi pour le Harrap's
“La médiocrité obtiendra immanquablement la préséance en se travestissant des oripeaux de la bienséance.”
Qui est en ligne ?
Utilisateurs parcourant ce forum : Aucun utilisateur inscrit et 12 invités