Google Chrome a-t-il des problèmes de lissage des polices et comment peuvent-ils être résolus ?

Google Chrome propose-t-il un lissage des polices ?

Google Chrome a longtemps eu du mal avec le rendu des polices, en particulier pour les petites tailles de police. Bien que le problème persiste, des développements importants ont eu lieu et des solutions potentielles pour atténuer le problème.

Mise à jour de l'état (décembre 2013)

En juin 2014, Chrome version 37 inclura un correctif pour le problème de rendu des polices. Les versions actuelles de Chrome (en mai 2013) ne disposent pas d'une solution appropriée lors du chargement des polices via diverses méthodes telles que @import ou webfont.js de Google.

Solution de contournement à l'aide d'astuces CSS

Bien qu'un correctif définitif ne soit pas encore disponible, les astuces CSS peuvent atténuer partiellement le problème en « lissant » la police rendue. Une solution de contournement consiste à ajouter un trait fin au texte à l'aide de la propriété -webkit-text-Stroke :

-webkit-text-stroke: 0.Xpx;

Vous pouvez également utiliser la syntaxe RGBA pour un effet plus subtil :

-webkit-text-stroke: 1px rgba(0, 0, 0, 0.1);

Une autre solution consiste à appliquer une fausse ombre au texte :

text-shadow: #fff 0px 1px 1px;

Vraie solution (auto-hébergée Polices)

Pour les polices auto-hébergées, il existe une solution potentielle impliquant le chargement des polices Web dans un ordre spécifique. Quant aux fichiers de polices TTF/OTF, ils bénéficient désormais d'une prise en charge plus large par les navigateurs et peuvent fournir de meilleurs résultats.

Développement actif par Google

L'équipe de développement de Google Chrome travaille activement sur le problème du rendu des polices. Les mises à jour sur la chronologie de résolution sont disponibles dans le rapport de bug officiel.

Exemples de comparaisons

Positif :

• Gauche : Firefox 23, Droite : Chrome 29
• Haut : Firefox 23, Bas : Chrome 29

Négatif :

• Chrome 30
• Chrome 29

Utilisation l'AVC Solution de contournement :

• Première ligne : par défaut
• Deuxième ligne : -webkit-text-Stroke : 0,3px ;
• Troisième ligne : -webkit-text -trait : 0,6 px ;

Article de blog Référence

Pour des informations plus détaillées et des mises à jour sur l'état du problème, reportez-vous à l'article de blog : Comment réparer le rendu des polices laides dans Google Chrome.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!