fonte monospace : rendu étrange

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : fonte monospace : rendu étrange

ANViL

yep...definitely ♫

Hi all :hello:

J'ai actuellement un petit souci avec une fonte / police de caractère externe, de type monospace ( source code pro ) : la hauteur de certains chiffre varie selon la taille appliquée, et juste pour corser les choses, ce ne sont pas toujours les mêmes dont la hauteur varie :pt1cable:

exemple : ( 16px, 18px et 22px )

( gauche et droite sont identiques, j'ai juste mis les différences de hauteur en évidence à gauche)

16px : tous les chiffres ont la même hauteur, excepté le 1 qui est plus grand
18px : tous les chiffres ont la même hauteur, excepté le 4 , 5 , 6 , 7 qui sont plus petits
22px : tous les chiffres ont la même hauteur, excepté le 5 et le 7 qui sont plus petits

Si quelqu'un a une explication valable, je suis preneur :bounce:

ci-après, le code de la page de test ( nécessite les polices externes, cf-lien ci-dessus )

Code :

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="content-type" content="application/xhtml+xml;charset=utf-8" />
<title>font test</title>
<style type="text/css">
* {
padding : 0 ;
margin : 0 ;
border : 0 ;
font-family : 'Source Code', monospace ;
font-weight : normal ;
}
h1 ,
h2 ,
p
{
padding : 1em 20px ;
border-bottom : 1px rgb(170,170,170) solid ;
color : rgb(150,150,150) ;
}
h1 {
font-size : 16px ;
}
h2 {
font-size : 18px ;
}
p {
font-size : 22px ;
}
@font-face
{
font-family : 'Source Code' ;
src : url('fonts/woff/source-code-regular.woff') format('woff') ,
url('fonts/ttf/source-code-regular.ttf') format('truetype'),
url('fonts/svg/source-code-regulart.svg') format('svg') ;
font-weight : normal ;
font-style : normal ;
}
@font-face
{
font-family : 'Source Code' ;
src : url('fonts/woff/source-code-regular.woff') format('woff') ,
url('fonts/ttf/source-code-regular.ttf') format('truetype'),
url('fonts/svg/source-code-regulart.svg') format('svg') ;
font-weight : bold ;
font-style : normal ;
}
</style>
</head>
<body>
<h1>0123456789</h1>
<h2>0123456789</h2>
<p>0123456789</p>
</body>
</html>

Message édité par ANViL le 03-04-2013 à 11:28:37

---------------
Easy Ridin' ⎝⏠⏝⏠⎠

Publicité

gatsu35

Blablaté par Harko

Quand on bosse avec des font custom, on prend le TTF ou le OTF? et on va dans fontsquirrel pour la conversion, là dans l'outil on coche n'oublie pas la fonction X-height qui va permettre d'aligner la font à la hauteur de la font système la plus proche et rulez
Mais à mon avis ton problème vient juste de la fonte qui est faite comme ça

Message cité 1 fois
Message édité par gatsu35 le 02-04-2013 à 16:05:30

---------------
Blablaté par Harko

ANViL

yep...definitely ♫

gatsu35 a écrit :

Quand on bosse avec des font custom, on prend le TTF ou le OTF?

Pour les fontes custom, on prend en général le kit complet webfont :

EOT pour IE 8 et inférieur
WOFF pour tous les browers modernes ( c'est le standard web du futur )
TTF / OTF conviennent aux browsers modernes mais seront de toute façon remplacés à terme par les polices WOFF ( format optimisé )
SVG pour certains browsers mobiles qui ne supportent rien d'autre

gatsu35 a écrit :

et on va dans fontsquirrel pour la conversion, là dans l'outil on coche n'oublie pas la fonction X-height qui va permettre d'aligner la font à la hauteur de la font système la plus proche et rulez
Mais à mon avis ton problème vient juste de la fonte qui est faite comme ça

je n'ai pas trouvé la fonction x-height dans fontsquirrel [:transparency]

Ce qui me tue, c'est que lorsque je fais un 'test drive' avec la fonte Source Code Pro, et que j'entre 0123456789 ... tous les chiffres ont la même hauteur [:tinostar]

Message cité 1 fois

---------------
Easy Ridin' ⎝⏠⏝⏠⎠

gatsu35

Blablaté par Harko

ANViL a écrit :

Pour les fontes custom, on prend en général le kit complet webfont :

EOT pour IE 8 et inférieur
WOFF pour tous les browers modernes ( c'est le standard web du futur )
TTF / OTF conviennent aux browsers modernes mais seront de toute façon remplacés à terme par les polices WOFF ( format optimisé )
SVG pour certains browsers mobiles qui ne supportent rien d'autre

C'était pas une question en fait, je me suis trompé, c'était une affirmations, les webfonts, je maîtrise assez bien et ait fait assez de recherche la dessus en mode "crossbrowser" /rangesagrossemythe

ANViL a écrit :

Mode Expert => X-height Matching:

---------------
Blablaté par Harko

FORUM HardWare.fr

Programmation

HTML/CSS

fonte monospace : rendu étrange

Sujets relatifs
[FICO Xpress] étrange erreur - problème syntaxe	Rendu de plusieurs "plans d'eau" non aligné en OpenGL
Problème étrange d'inclusion de header	Modification du rendu d'un JTexfield Apres saisie
comportement étrange de BIGNUM	probleme rendu IE/FF
Plus de sujets relatifs à : fonte monospace : rendu étrange

Page générée en 0.078 secondes