Arial : comment supprimer les différences entre PC et Mac ?

Bonjour à tous,

Je développe actuellement un site à partir d'un Mac. J'utilise comme font-family: arial, sans-serif

Sur Mac, le site rend très bien, mais dès que je le teste sur PC, quelque soit le navigateur, la police est bien plus fine ce qui modifie vraiment le rendu.

J'ai lu à plusieurs reprises qu'il y avait des différences dans les polices entre PC et Mac, mais y'a-t-il, en CSS ou autre, un moyen d'avoir un rendu identique quelque soit les machines et sans passer par des images ? Y'aurait-il sinon une police proche d'Arial ayant la même apparence sur PC et Mac ?

Merci beaucoup pour votre aide !

Bonne soirée,

TheMoutch

Salut,

Il est inévitable d'avoir un rendu légèrement différent, car les polices ne sont pas exactement identiques et n'ont surtout pas le même degré de lissage selon le système d'exploitation.
Cela fait partie des choses qu'il faut accepter légèrement différentes selon les configurations.
Modifié par Mikachu (21 Sep 2009 - 13:28)

Merci beaucoup Mikachu, mais là la différence de rendu me semble vraiment notable.

N'y a-t-il aucun best practice à ce sujet ?

TheMoutch

Mmmmh personnellement je n'utilise pas l'Arial mais la Tahoma ou la verdana, plus élégantes et agréables à lire sur un écran.

Bonjour,

les utilisateurs sont habitués à ce qu'ils voient sur leur écran de PC ou de Mac. Si tu vas à l'encontre de ça, les utilisateurs de l'un des deux systèmes d'exploitation vont pas comprendre

Faut éviter de caler en CSS au pixel près un texte sur PC parce que sur Mac, inévitablement ça ne passe pas. Si ton intégration supporte un agrandissement du texte (je parle d'accessibilité là) c'est déjà moins problématique quand ça arrive

C'est effectivement le lissage (anti-aliasing) qui va jouer.

Chez Microsoft, on privilégie la netteté et la lisibilité. Tout est fait pour rentrer dans les pixels, même si ça altère légèrement la tronche de la police.

Chez Apple, on préfère rester fidèle à la police, qu'elle conserve au mieux sont apparence, même si ça floute un peu dans certains cas.

body {font-family:Verdana, sans-serif} résoudra ton problème, c'est la même sur toutes plateformes cette police. et puis comme déjà dit, moi je la trouve plus jolie et plus lisible sur un écran.

Merci pour tous vos messages. Je vois donc qu'il n'y a pas de solution absolue et qu'il faut se débrouiller avec.

Tu n'aurais pas une capture d'écran pour montrer les différences?

TheMoutch a écrit :
N'y a-t-il aucun best practice à ce sujet ?

Tu veux dire aucune bonne pratique?

Bonne pratique 1: se faire une raison, et se souvenir que l'utilisateur de telle ou telle platforme va considérer «son» lissage des polices (ou absence de lissage) comme normal (il y a des utilisateurs de Windows XP, habitués au non-lissage par défaut, qui ont violemment critiqué IE7 à cause de son lissage des polices activé par défaut).
Bonne pratique 2: en tenir compte dans son design.
Bonne pratique 3: tester.

À garder en tête:
1. Les différentes versions de Windows ont des paramètres par défaut différents. Les versions plus récentes ont un système de lissage des polices plus évolué, qui ne donnerait pas exactement le même rendu qu'une version précédente de ce système de lissage.
2. Il ne faut pas comparer le rendu sur Mac et le rendu sous Windows XP sans lissage ClearType, mais plutôt le rendu du texte en Arial sur ton site et sur d'autres sites utilisant cette police. Si pour une même configuration (système, paramètres, navigateur) tu as des différences importantes, ça peut être un bug; autrement, c'est normal.
Bien sûr si ton site sous Windows
Modifié par Florent V. (21 Sep 2009 - 13:18)