[CSS] Taille des polices du forum
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
[CSS] Taille des polices du forum
Bonjour,
Je règle toujours la taille des polices par défaut aux alentours des 13 à 15 pixels dans les préférences du navigateur.
Les caractères sur le forum me semblaient pourtant bien petits, et après avoir essayé un réglage à 18 pixels sans que ça change l'aspect de la page que je lisais, j'ai fait d'abord un 'Ctrl++' qui a effectivement grossi les caractères, puis j'ai regardé le code source :
La taille des caractères est fixée par défaut :scro-gneu-gneu!:
Serait-il possible de faire autrement ?
J'ai trouvé ce fil qui en parle sur Alsacréations, et cet article depuis le fil en question...
Bonne journée, Mélodie.
Je règle toujours la taille des polices par défaut aux alentours des 13 à 15 pixels dans les préférences du navigateur.
Les caractères sur le forum me semblaient pourtant bien petits, et après avoir essayé un réglage à 18 pixels sans que ça change l'aspect de la page que je lisais, j'ai fait d'abord un 'Ctrl++' qui a effectivement grossi les caractères, puis j'ai regardé le code source :
La taille des caractères est fixée par défaut :scro-gneu-gneu!:
Serait-il possible de faire autrement ?
J'ai trouvé ce fil qui en parle sur Alsacréations, et cet article depuis le fil en question...
Bonne journée, Mélodie.
- gyo
- Maître du Kyudo
- Messages : 1049
- Inscription : jeu. 19 avr. 2007, 10:40
- Localisation : Nantes (44)
Coucou mélodie,
euh tu oublies un détail.. c'est quoi ton navigateur ! J'imagine que c'est firefox, si c'est le cas, tu peux fixer une taille mini à ne pas franchir dans les préférences du navigateur, ainsi tu vas dans Polices -> Avancés -> taille minimum et hop tu choisis la taille que tu veux. Sinon un autre moyen est de créer ta propre CSS et de la charger pour tous les sites et puis y a aussi Greasemonkey bon voilà, je ne peux pas t'en dire plus.
euh tu oublies un détail.. c'est quoi ton navigateur ! J'imagine que c'est firefox, si c'est le cas, tu peux fixer une taille mini à ne pas franchir dans les préférences du navigateur, ainsi tu vas dans Polices -> Avancés -> taille minimum et hop tu choisis la taille que tu veux. Sinon un autre moyen est de créer ta propre CSS et de la charger pour tous les sites et puis y a aussi Greasemonkey bon voilà, je ne peux pas t'en dire plus.
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
Hello gyogyo a écrit :Coucou mélodie,
Les navigateurs se règlent tous de manière identique (je ne parle pas de IE que je ne connais pas) et comme dit dans mon post, c'est ce que je fais toujours.euh tu oublies un détail.. c'est quoi ton navigateur ! J'imagine que c'est firefox, si c'est le cas, tu peux fixer une taille mini à ne pas franchir dans les préférences du navigateur, ainsi tu vas dans Polices -> Avancés -> taille minimum et hop tu choisis la taille que tu veux.
Je lis difficilement les CSS, quant à créer la mienne... (c'est pour rire ?)Sinon un autre moyen est de créer ta propre CSS
Greamonkey pour générer des bouts de code javascript à la volée : non, je parlais d'accessibilité et de standards, pas de cas particuliers (je ne suis pas un cas particulier pour ce qui est de la vue).et de la charger pour tous les sites et puis y a aussi Greasemonkey bon voilà, je ne peux pas t'en dire plus.
De deux choses l'une : ou la CSS du forum peut être modifiée aisément, ou elle ne peut pas être modifiée aisément, auquel cas je poursuivrai à coups de 'Ctrl++' pour augmenter la taille de police à chaque page.
Si ça peut être modifié facilement (je ne sais pas non plus comment pbpBB fonctionne de ce point de vue) alors ça mérite d'être signalé.
Les codes fautifs dans le code source sont toutes les propriétés 'font-size':
http://pastebin.archlinux.fr/995
parce qu'elles sont exprimées en pixels. Je ne sais pas écrire une feuille de style, je sais par contre pour l'avoir lu, que les 'em' et les % ages permettent l'adaptation de la page par le navigateur. Ce qui produit un effet visuel correct quel que soit le réglage du navigateur (paramètre taille et propriété des polices comme tu disais) (déjà configuré pour et par l'utilisateur concerné, bien sûr) mais aussi, les 'em' et les pourcentages, bien employées pour le réglage des bordures, des tours de cadres, et autres mesurables permet aussi à la page d'être fluide et de s'adapter à toutes les tailles et résolutions de moniteurs.
De là la citation que j'ai faite du forum Alsacréations (où j'ai cherché le topic le plus approchant) et de leur article relatif à la question.
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
http://css.alsacreations.com/Tutoriels- ... vec-les-em
etCode : Tout sélectionner
em
, le principe</h2>Code : Tout sélectionner
font-size
Le fonctionnement de la propriété CSSavec lesCode : Tout sélectionner
font-size
est simple : <em>un élément HTML pour lequel on a demandé une taille de texte deCode : Tout sélectionner
em
aura un texte dont la hauteur représente X fois la hauteur du texte de son élément parent</em>.Code : Tout sélectionner
Xem
Dite comme ça, la définition est un peu abrupte. Ce qu'il faut en retenir, c'est qu'en écrivanton ne demande pas une taille de texte fixe et absolue, mais une taille de texte <em>proportionnelle</em> à la taille de texte de l'élément parent. La valeur demandée, en <em>em</em>, est un coefficient multiplicateur. Concrètement, un paragraphe dont la taille du texte seraitCode : Tout sélectionner
font-size: Xem
aura un texte deux fois plus haut que le texte de l'élément qui contient ce paragraphe.Code : Tout sélectionner
2em
Pour être encore plus clair, prenons un petit exemple :
Dans cet exemple, le paragraphe aura une hauteur de texte deHTML :
body
<p>Ceci est un paragraphe.</p>
/body
CSS :
body {font-size: 15px;}
p {font-size: 0.8em;}, soit une hauteur de texte de 12 pixels.Code : Tout sélectionner
15px * 0,8
Mais l'intérêt desn'est-il pas justement de se passer complètement des pixels pour la taille du texte, afin de ne pas figer la taille du texte et de permettre à l'utilisateur de la modifier ? (là, il y a un renvoi en bas de page, je crois) Si, bien sûr ! Alors comment faire ?Code : Tout sélectionner
em
C'est très simple : il suffit de n'utiliser que des valeurs relatives, enou en pourcentages, et de bannir les tailles de texte en pixels !Code : Tout sélectionner
em
Voici cette fois un exemple un peu plus complet, et surtout plus accessible :
HTML :
body
div id="page"
div id="en-tete"
...
/div
div id="contenu"
...
/div
/div
/body
CSS :
html {font-size: 100%;}
body {font-size: 0.8em;}
div#en-tete {font-size: 1.2em;}
/* On augmente la taille du texte pour l'en-tête */
div#contenu {}
/* On ne modifie pas la taille du texte pour le contenu principal.
Du coup, le texte du contenu principal garde la taille du texte définie pour BODY */
-
- Chu Ko Nu
- Messages : 405
- Inscription : lun. 18 sept. 2006, 16:21
- Localisation : france, yvelines 78
la solution "em" est plutot bof vu qu'elle se rapporte toujours a une taille de font (celle par defaut si rien de défini)
la solution "%" est trop differente d'un navigateur a l'autre (100% d'un truc non défini ça peut valoir un paquet de chose du coup...)
les "px" sont vraiment les moins chiants a gerer
par contre dans firefox tu peut regler la resolution en "dpi" et ca devrait resoudre ton probleme, tapes comme adresse: "about:config"...bon le soucis c'est que je me souviens plus du nom de l'option mais....
la solution "%" est trop differente d'un navigateur a l'autre (100% d'un truc non défini ça peut valoir un paquet de chose du coup...)
les "px" sont vraiment les moins chiants a gerer
par contre dans firefox tu peut regler la resolution en "dpi" et ca devrait resoudre ton probleme, tapes comme adresse: "about:config"...bon le soucis c'est que je me souviens plus du nom de l'option mais....
- kozaki
- Chu Ko Nu
- Messages : 422
- Inscription : mer. 13 sept. 2006, 22:49
- Localisation : London > . < Paris
- Contact :
+ 101 avec Melodie. Elle recommande simplement de respecter les standards web après tout.
Les tailles de polices relatives (comme les tailles de boxes : un contre-exemple bien pourri) permettent à tou-te-s de voir les pages dans les meilleurs conditions possibles quel que soit leur soft et leurs handicaps.
C'est la meilleure solution.
"html, body * { font-size 1em; } par exemple.
Ensuite on donne la taille des éléments en fonction de leur niveau sémantique : h1 150%, h2 130%, ..., p 70% par exemple.
Je dis ça mais je code des pages web bon an mal an depuis 2000 (en fait c la moitié de mon boulot).
Les tailles de polices relatives (comme les tailles de boxes : un contre-exemple bien pourri) permettent à tou-te-s de voir les pages dans les meilleurs conditions possibles quel que soit leur soft et leurs handicaps.
C'est la meilleure solution.
Justement non : on fixe la taille par défaut dès le départ, avec unla solution "%" est trop differente d'un navigateur a l'autre (100% d'un truc non défini ça peut valoir un paquet de chose du coup...)
"html, body * { font-size 1em; } par exemple.
Ensuite on donne la taille des éléments en fonction de leur niveau sémantique : h1 150%, h2 130%, ..., p 70% par exemple.
Je dis ça mais je code des pages web bon an mal an depuis 2000 (en fait c la moitié de mon boulot).
~ Configs ~ PGP Key: 1C2A554EFF0157D9
« Demande un conseil à ton ennemi et fais le contraire (proverbe juif)
SVP intéressé par tout retour d'exp. sur Arch ARM en général, et sur portable (CrOS) en particulier.
« Demande un conseil à ton ennemi et fais le contraire (proverbe juif)
SVP intéressé par tout retour d'exp. sur Arch ARM en général, et sur portable (CrOS) en particulier.
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
Y'a houhouou !!!!kozaki a écrit :Je dis ça mais je code des pages web bon an mal an depuis 2000 (en fait c la moitié de mon boulot).
Tu animes des sessions pour apprendre ? (j'ai lu sur les % il n'y a pas si longtemps, et j'aime beaucoup apprendre là-dessus).
_alexmyself : les % aussi j'aime bien, les 'em' je ne dis rien, c'est moins parlant, mais je pense que c'est pour les pages fluides, donc qui s'adaptent selon les résolutions ?
- vincentxavier
- Elfe
- Messages : 778
- Inscription : ven. 11 août 2006, 18:17
- Localisation : Epinay sur Seine (93)
Vous pouvez toujours utiliser http://bugs.archlinux.fr pour soumettre un rapport de bug. Si vous ne voulez pas que ca soit rediriger vers /dev/null il est intéressant de proposer un patch ou un fichier css complet.
Voila voila
Cela dit, pour l'accessibilité, il faut définir les tailles en em au début du fichier de style pour pouvoir ensuite utiliser des tailles en %.
Voila voila
Cela dit, pour l'accessibilité, il faut définir les tailles en em au début du fichier de style pour pouvoir ensuite utiliser des tailles en %.
Warranty
THIS ADVICE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
En clair, je ne pourrais être tenu responsable des dégats causés par l'utilisation de mes conseils
THIS ADVICE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
En clair, je ne pourrais être tenu responsable des dégats causés par l'utilisation de mes conseils
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
euh ! c'est ce que kozaki a dit...vincentxavier a écrit :Cela dit, pour l'accessibilité, il faut définir les tailles en em au début du fichier de style pour pouvoir ensuite utiliser des tailles en %.
Justement non : on fixe la taille par défaut dès le départ, avec un
"html, body * { font-size 1em; } par exemple.
Ensuite on donne la taille des éléments en fonction de leur niveau sémantique : h1 150%, h2 130%, ..., p 70% par exemple.
- kozaki
- Chu Ko Nu
- Messages : 422
- Inscription : mer. 13 sept. 2006, 22:49
- Localisation : London > . < Paris
- Contact :
vincentxavier, t sûr que bugs.archlinux.fr est l'endroit ?
Car c'est absolument pas un bug dont il s'agit, mais d'une amélioration.
Sinon oui c'est ce que tu as dit.
Et pour l'exemple "complet", bin y-a rien de + à savoir que ce que j'ai posté juste au-dessus (la partie sur laquelle tu sembles être passé rapidement )
Sinon, dedana je te passe ma bible : LEs standarS cé pas kompliké
Et pour le pourquoi expliqué clairement sans chichis : Formatage du texte en CSS (sous "Essayer !" )
Car c'est absolument pas un bug dont il s'agit, mais d'une amélioration.
Sinon oui c'est ce que tu as dit.
Et pour l'exemple "complet", bin y-a rien de + à savoir que ce que j'ai posté juste au-dessus (la partie sur laquelle tu sembles être passé rapidement )
Sinon, dedana je te passe ma bible : LEs standarS cé pas kompliké
Et pour le pourquoi expliqué clairement sans chichis : Formatage du texte en CSS (sous "Essayer !" )
~ Configs ~ PGP Key: 1C2A554EFF0157D9
« Demande un conseil à ton ennemi et fais le contraire (proverbe juif)
SVP intéressé par tout retour d'exp. sur Arch ARM en général, et sur portable (CrOS) en particulier.
« Demande un conseil à ton ennemi et fais le contraire (proverbe juif)
SVP intéressé par tout retour d'exp. sur Arch ARM en général, et sur portable (CrOS) en particulier.
- warnaud
- Maître du Kyudo
- Messages : 1640
- Inscription : ven. 11 août 2006, 17:05
- Localisation : Rolle (CH)
Le délire c'est qu'on va pas forcément créer 50 feuilles de style pour tous les cas de figures et toutes les applis C'est en partie la css du site, bref ça sent la surcharge de balise pour pas grand chose.
Perso ça marche de base sur tout mes ordis / navigateurs (sans rien toucher)
Déjà est-ce que tes polices sont installées comme il faut ?
T'as les polices 100/75dpi bitstream (font-bitstream-speedo ttf-bitstream-vera) ?
Perso ça marche de base sur tout mes ordis / navigateurs (sans rien toucher)
Déjà est-ce que tes polices sont installées comme il faut ?
T'as les polices 100/75dpi bitstream (font-bitstream-speedo ttf-bitstream-vera) ?
Plus ça rate, plus ça a de chance de réussir. En somme, un succès n'est qu'une erreur qui a finit par réussir (même par erreur). Ne déséspérez donc pas et perseverez. Utilisez La Rache™
Patientia quod lard quod barrus planto diligo ut licentia
—¤÷(`[¤*Powered By *¤]´)÷¤—
Archlinux ~ Fvwm ~ Irssi ~ URxvt
Patientia quod lard quod barrus planto diligo ut licentia
—¤÷(`[¤*Powered By *¤]´)÷¤—
Archlinux ~ Fvwm ~ Irssi ~ URxvt
ça me rappelle un truc cette histoire de css mais je ne sais plus quoi......warnaud a écrit :Le délire c'est qu'on va pas forcément créer 50 feuilles de style pour tous les cas de figures et toutes les applis C'est en partie la css du site, bref ça sent la surcharge de balise pour pas grand chose.
Perso ça marche de base sur tout mes ordis / navigateurs (sans rien toucher)
Déjà est-ce que tes polices sont installées comme il faut ?
T'as les polices 100/75dpi bitstream (font-bitstream-speedo ttf-bitstream-vera) ?
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
Je les ai les polices, dans mon système, mais j'aime bien pouvoir avoir l'affichage conforme à la configuration que je fais en graphique dans les préférences, (taille mini etc... ) au lieu d'augmenter les caractère à la molette de souris. Ça me semble plus sympa.
À propos de CSS, j'ai regardé dans les réglages en graphique dans un phpBB que j'ai en local, ça n'a pas l'air de produire de résultat quand je fais des modifications là, (police 1, 2 et 3).
En voyant ça je pensais que c'était tout simple... mais apparemment non.
À propos de CSS, j'ai regardé dans les réglages en graphique dans un phpBB que j'ai en local, ça n'a pas l'air de produire de résultat quand je fais des modifications là, (police 1, 2 et 3).
En voyant ça je pensais que c'était tout simple... mais apparemment non.
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
Dans la CSS de la feuille de style du forum je suppose ?
Déjà pour lire nos causeries:
http://www.yoyodesign.org/doc/w3c/css2/ ... size-props
Déjà pour lire nos causeries:
ben 12px pour moi c'est trop petit. J'imagine que 100% ou aux environs, genre entre 0.9 et 1.2em pourrait être mieux ? Comme la typo est proportionnelle en rapport de ce qui est la norme configurée dans nos butineurs...}
.postbody {
font-size : 12px;
}
http://www.yoyodesign.org/doc/w3c/css2/ ... size-props
j'avais trouvé une doc sensass un coup, avec des illustrations pour expliquer les tailles relatives je n'arrive pas à remettre la main dessus.15.2.4 La taille de police : les propriétés 'font-size' et 'font-size-adjust'
- warnaud
- Maître du Kyudo
- Messages : 1640
- Inscription : ven. 11 août 2006, 17:05
- Localisation : Rolle (CH)
Ouais toi c'est des vraies bugsosku a écrit : ça me rappelle un truc cette histoire de css mais je ne sais plus quoi......
Plus ça rate, plus ça a de chance de réussir. En somme, un succès n'est qu'une erreur qui a finit par réussir (même par erreur). Ne déséspérez donc pas et perseverez. Utilisez La Rache™
Patientia quod lard quod barrus planto diligo ut licentia
—¤÷(`[¤*Powered By *¤]´)÷¤—
Archlinux ~ Fvwm ~ Irssi ~ URxvt
Patientia quod lard quod barrus planto diligo ut licentia
—¤÷(`[¤*Powered By *¤]´)÷¤—
Archlinux ~ Fvwm ~ Irssi ~ URxvt
- kozaki
- Chu Ko Nu
- Messages : 422
- Inscription : mer. 13 sept. 2006, 22:49
- Localisation : London > . < Paris
- Contact :
1 feuille de style est nécessaire, et une ligne (cf posts + haut), quelque soit le nombre de pages. C'est le but des css standards d'ailleurs, de simplifier pour les utilisateurs et les codeurs.warnaud a écrit :Le délire c'est qu'on va pas forcément créer 50 feuilles de style pour tous les cas de figures et toutes les applis C'est en partie la css du site, bref ça sent la surcharge de balise pour pas grand chose.
Perso ça marche de base sur tout mes ordis / navigateurs (sans rien toucher)
Déjà est-ce que tes polices sont installées comme il faut ?
T'as les polices 100/75dpi bitstream (font-bitstream-speedo ttf-bitstream-vera) ?
Que ça s'affiche nickel sur les machines/écrans/applis du webmestre est bien, c sûr
~ Configs ~ PGP Key: 1C2A554EFF0157D9
« Demande un conseil à ton ennemi et fais le contraire (proverbe juif)
SVP intéressé par tout retour d'exp. sur Arch ARM en général, et sur portable (CrOS) en particulier.
« Demande un conseil à ton ennemi et fais le contraire (proverbe juif)
SVP intéressé par tout retour d'exp. sur Arch ARM en général, et sur portable (CrOS) en particulier.
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
Si j'ai compris correctement le principe, c'est la feuille de style du thème utilisé qui doit régler tout ça, celle qu'on trouve dans le répertoire templates/subsilver ou template/autre_theme.kozaki a écrit :1 feuille de style est nécessaire, et une ligne (cf posts + haut), quelque soit le nombre de pages
- mélodie
- Maître du Kyudo
- Messages : 2784
- Inscription : lun. 30 oct. 2006, 02:06
- Localisation : Pyrénées
Si je fais ça c'est avec Scite. 'replace : 12 px : by 1.2em' ; 'replace : 10px : bymarc[i1] a écrit : Un bon éditeur de CSS : cssed
J'ai hate de voir la feuille de style de mélodie
0.9em' et ce genre. (20 px par 200% par exemple).
J'ai eu cssed, mais je ne m'en servais jamais, je l'ai donc désinstallé. (et puis il faut apprendre à faire avec un éditeur simple, pour comprendre ce qu'on fait).
Je pense que n'importe qui peut remplacer les quelques px par des em ou des %.