CSS: "font-size" augmente la graisse de la police ?

Kounkountchek

Membre expert
Club iGen
24 Juillet 2004
1 162
113
47
2^6
Bonjour,

j'ai un petit souci, j'ai choisi pour créer un petit site, une police "Lane - Narrow", le problème étant que quand j'augmente sa taille dans Photoshop, elle reste fine, quand j'augmente sa taille via "font-size" en css, elle devient plus épaisse.
(Cliquez sur l'image pour bien constater la chose)

Click for full size - Uploaded with plasq's Skitch
J'imagine qu'il n'y a rien à faire ? (j'ai essayé font-weight mais il est par défaut au mini)
J'ai testé sans conviction un "opacity:0.9" mais bien sûr ça me change la couleur et c'est pas satisfaisant.
Argh ! :mouais:
Merci
 
bonjour,
compte tenu qu'il ne s'agit pas d'une typo système, et hors question d'utilisation d'un SIFR, je ne vois pas comment vous pourriez intervenir sur la graisse de la typo.

Question bête : votre texte est-il dans une balise hn ?
la mise en balise h1, h2 et h3 provoque un engraissement de la typo.
 
bonjour,
compte tenu qu'il ne s'agit pas d'une typo système, et hors question d'utilisation d'un SIFR, je ne vois pas comment vous pourriez intervenir sur la graisse de la typo.

Question bête : votre texte est-il dans une balise hn ?
merci de répondre,
alors je ne sais pas ce que c'est qu'un SIFR :siffle:
et non mon texte est dans une balise p
ça pose problème que ce soit pas une typo système ? (j'utilise @font-face)
merci
 
Tu as fait un reset sur ta feuille de style?
Là ou je comprend pas ces avec cette police tu as combien de chance quel sois installé chez le client?
 
Non j'ai pas fait de reset, c'est un test.
La police est bien la même c'est juste qu'elle est plus épaisse avec le rendu html qu'en image (png) pour la meme taille (la même hauteur).
@fontface permet justement d'utiliser une police que le client n'a pas
https://developer.mozilla.org/en/CSS/@font-face
Et oui j'ai testé avec Firefox 3.5 et safari 4 (qui reconnait également cette règle)
 
La différence est pas juste liée au lissage des polices ? T'as essayé de l'enlever ?

Aie aie aie, tu as peut-être raison, mais comment je peux l'enlever ? j'avais entendu parler d'une propriété prévue pour le css 3 mais je ne crois pas qu'elle fonctionne actuellement (font-smooth)

Bon je vais faire mon site en Flash au moins il s'affichera comme je le souhaite ! :siffle::D
 
Aie aie aie, tu as peut-être raison, mais comment je peux l'enlever ? j'avais entendu parler d'une propriété prévue pour le css 3 mais je ne crois pas qu'elle fonctionne actuellement (font-smooth)

Bon je vais faire mon site en Flash au moins il s'affichera comme je le souhaite ! :siffle::D

Avec le flash t'auras d'autres surprises, à commencer par l'incompatibilité avec un certain nombre de périphériques mobiles, des entreprises qui le bloquent, des université où il est pas installé, des problèmes de référencement et d'ergonomie. Et il est pas sensé gérer le lissage flash maintenant ?
Mais tu peux mettre des images, tant que tu remplis bien le alt pour faire plaisir aux puristes.

Ça se désactive dans le navigateur, mais je doute qu'il y ait des attributs css correctement gérés par tous les navigateurs. Peut-être des bidouilles javascript différents pour chaque browser qui sait…
 
Aie aie aie, tu as peut-être raison, mais comment je peux l'enlever ? j'avais entendu parler d'une propriété prévue pour le css 3 mais je ne crois pas qu'elle fonctionne actuellement (font-smooth)

Bon je vais faire mon site en Flash au moins il s'affichera comme je le souhaite ! :siffle::D

question quel type de lissage appliques tu sous photoshop? mais bon peu importe la font c'est depuis toujours comme ca essaye avec une simple arial et compare entre un rendu web et ton photoshop, il y a engraissement c'est lié au lissage du navigateur, sous IE je suis sur que tu n'aurais pas le probleme :D mais attention les degats :rolleyes:
 
question quel type de lissage appliques tu sous photoshop? mais bon peu importe la font c'est depuis toujours comme ca essaye avec une simple arial et compare entre un rendu web et ton photoshop, il y a engraissement c'est lié au lissage du navigateur, sous IE je suis sur que tu n'aurais pas le probleme :D mais attention les degats :rolleyes:
J'ai essayé tous les lissages de Photoshop, pas un ne s'approche du rendu web, là c'est "Nette", mais même "Forte" (tiens pourquoi c'est au féminin le lissage?) reste beaucoup plus fin.
En fait je peux pas tester sous IE parce qu'il ne gère pas @fontface, donc de toute façon il utilisera une police de remplacement.


Avec le flash t'auras d'autres surprises, à commencer par l'incompatibilité avec un certain nombre de périphériques mobiles, des entreprises qui le bloquent, des université où il est pas installé, des problèmes de référencement et d'ergonomie. Et il est pas sensé gérer le lissage flash maintenant ?
Mais tu peux mettre des images, tant que tu remplis bien le alt pour faire plaisir aux puristes.

Ça se désactive dans le navigateur, mais je doute qu'il y ait des attributs css correctement gérés par tous les navigateurs. Peut-être des bidouilles javascript différents pour chaque browser qui sait…
Bon je vais faire autrement, et utiliser une police "classique", mais franchement choisir sa police entre 10 polices "sûres pour le web" c'est comme si on ne pouvait utiliser que 10 couleurs différentes pour le web. Que c'est lent à évoluer... :(
 
Un site ne doit pas être identique sur toutes les plateformes, c'est d'ailleurs mission impossible : tu l'imagines sur un iphone? Il faut savoir lâcher du lest et faire en sorte que la mise en page reste bonne malgré l'absence du support de font-face, c'est ce qu'on appelle l'amélioration progressive : on fait un site qui fonctionne partout et pour les navigateurs qui peuvent plus on utilise font-face, svg, etc. ;)