internet-explorer-9 antialiasing cleartype text-rendering

internet explorer 9 - IE 9 no utiliza antialiasing de sub-píxeles bajo ciertas condiciones



internet-explorer-9 cleartype (7)

[Título original: el texto de IE 9 se reproduce muy mal; ¿hay una solución? )

IE 9 está mostrando muy mal el texto en mi aplicación. El problema no está en la configuración de Borrar tipo de mi monitor, ya que IE 9 en el modo de compatibilidad, Firefox y Chrome, todos procesan bien el texto. Aquí hay una comparación lado a lado de cómo se representa el texto con IE 9, IE 9 en modo de compatibilidad y Chrome:

Intenté aplicar esta respuesta , pero parece que no se aplica a nada después de IE 7. ¿Alguien sabe de alguna solución que podamos aplicar a nuestro sitio para corregir la representación incorrecta del texto de IE 9?

Editar:

He reducido la página del problema a lo esencial. Como puedes ver, no se necesita mucho para reproducirse. Asegúrese de que IE tenga un modo de navegador si IE9 y el modo de documento de los estándares IE9:

<html xmlns="http://www.w3.org/1999/xhtml"> <body style="background-color: rgb(30, 34, 59); color: rgb(255, 85, 0); font-size: 20px"> Home </body> </html>


La representación de fuentes ClearType se utiliza en todos los modos de documento IE9; El posicionamiento de subpíxeles se usa solo en el modo de estándares por defecto de IE9. Los modos de compatibilidad de IE9 (Quirks, 7 y 8) utilizan métricas de texto de píxeles completos.

Así que intenta cambiar tu doctype para usar el modo de Quirks :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

o

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

o uno de los modos de compatibilidad.

Más información de MSDN


IE9 en modo estándar utiliza direccionamiento de subpíxeles para texto. Se puede decir que "suaviza" los caracteres del texto, o puede decir lo contrario, es decir, que "difumina" los caracteres. Es esencialmente lo mismo.

Personalmente, no encuentro diferencias fáciles de percibir entre sus tres imágenes, y en realidad prefiero la primera. Sin embargo, depende de las preferencias personales.

He buscado un poco en la web, y no parece ser una forma de limpiar desactivar la representación de subpíxeles en IE9. Este enlace podría interesarle: Deshabilite Cleartype (suavizado de texto) en IE9

En WPF, hay una opción para desactivar la representación de fuentes de subpíxeles y obligar a las letras a "ajustar a los píxeles". Pero IE9 no parece tener tal cambio.

Sin embargo, mi recomendación es: ¿es un problema tan grande que querrías hacerlo en primer lugar? Si la representación de texto de sub-píxel le da un resultado muy feo en su sitio (¿está utilizando muchos tipos muy pequeños?), Tal vez deba replantearse el diseño de su sitio en primer lugar. Los tipos que son tan pequeños que la representación de subpíxeles los hace poco claros es mejor evitarlos en un sitio web.

Y no se sabe cuándo otros navegadores agregarán la representación de subpíxeles al texto en el futuro; de hecho, FF4 ya usa Direct2D, pero puede que no esté usando DirectWrite.


Internet Explorer 9 parece dejar de usar el antialiasing de sub-píxeles en condiciones realmente aleatorias. Por ejemplo, aquí hay otro ejemplo que lo activa (supongo que hay más):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd"> <HTML><HEAD> <TITLE></TITLE> <BODY> Outside the div - with sub-pixel AA. :) <div style="border-radius: 1px; overflow: hidden;"> Inside the div - no sub-pixel AA. :( </div> </BODY></HTML>

El texto dentro de la div no se procesará con antialiasing de sub-píxel ("coloreado"), pero el texto fuera de él. Tanto el border-radius como las declaraciones de overflow son necesarias para desencadenar el error.

(¿Puede alguien intentarlo si sucede en su sistema y dejar un comentario? Me gustaría saber si el error solo se activa en ciertas configuraciones del sistema).

Si cambia el Modo de documento en las Herramientas del desarrollador de IE a algo que no sea los "estándares IE9", el problema desaparecerá.

Personalmente, estoy casi dispuesto a vivir con eso, pero si realmente te molesta, te sugeriría que borres paso a paso tu hoja de estilos para descubrir qué lo desencadena.


La única forma en que puedo hacer que las fuentes se vean bien es recurrir a la funcionalidad de IE8 a través de:

<meta http-equiv="x-ua-compatible" content="IE=8" />

La actualización de Microsoft support.microsoft.com/kb/2545698 ya se había instalado, y ya uso font-size: 11px;

La opacity:.9999 solución opacity:.9999 era mejor que nada, pero no tan buena como lo muestra el modo IE8.


Parece que está configurando la opacity:.9999 en el body hace que el texto en el modo de estándares de IE9 sea mucho más similar a como lo hace en el modo de Quirks.


Respuesta corta: este es un problema cuando se especifican tamaños de fuente en pt (puntos), en lugar de píxeles.

Entonces, lo que sucede es que el nuevo motor de renderizado de IE9 usa DirectWrite, que no se ajustará al píxel más cercano como lo hizo con GDI +, por lo que si el tamaño de punto no se asigna a un número de píxeles completo, lo dibujará exactamente de esa manera , lo que hace que parezca borroso.

El modo de compatibilidad de IE8 no sufrirá este problema, ya que utiliza la representación GDI normal a la que estamos acostumbrados.

Así que revise todas sus hojas de estilo, etc. y si solicita fuentes de tamaño en puntos, eso es exactamente lo que se dará en IE9, y dependiendo de la fuente utilizada, etc., su tamaño en puntos puede o no corresponder a un tamaño claro y nítido.

Esto se explica en detalle aquí:


Si necesita usar IE y odia ese suavizado como en esta imagen http://i.stack.imgur.com/SViG0.png Intente activar la Vista de compatibilidad (ALT + T para mostrar el menú Herramientas)