Problemas con Twitter y Helvetica Neue Bd (How to fix)

Desde que salió la nueva interfaz de Twitter no pude seguir usándolo en Firefox 9. Al abrir cualquier sección de Twitter me encontraba con que el documento era ilegible; aparecían puros caracteres extraños y no se podía hacer absolutamente nada. Y yo maldecía contra el navegador, siendo que no tenía la culpa (completamente).

Le eché la culpa también a JavaScript, a los complementos y a cuando falso dios encontré por ahí. Finalmente, después de varios días de investigar, cabecearme y maldecir, esta mañana se me iluminó la ampolleta y encontré la solución.

Si corría Firefox en modo seguro funcionaba bien, por lo que al principio pensé que era un complemento y me centré en la entretenida pega de ir desactivándolos uno a uno  y ver cuál era el causante del problema. Sin embargo, luego de probarlos todos, seguía sin funcionar.

Luego mis esfuerzos se dirigieron a JavaScript y el CSS, realicé varias pruebas, pero tampoco solucionaron el problema.

Finalmente, cuando ya me había dado casi por vencido y asumido que tendría que utilizar otro navegador para tuitear, llegué a una solución, a lo bestia, pero una solución de cualquier forma.

La solución

Resulta que el problema – al parecer – es generado por la tipografía Helvetica Neue Bd que curiosamente tenía instalada. Así que no me la pensé dos veces y fui a la carpeta de fuentes (windows/Fonts) y con toda la rabia posiblemente acumulada, la eliminé (sí, hice un respaldo antes).

Ahhh… el alivio. Ahora Twitter anda sin problemas. Pero bueno, borrar la tipografía no es la mejor de las soluciones (si bien resultó ser la más aliviante), por lo que me di el trabajo de generar un CSS que sobrescribe el de Twitter y corrige el problema reemplazando Helvetica Neue Bd por otra tipografía (en mi caso, Tahoma queda muy bien).

El problema es que necesitamos que el estilo se aplique cada vez que se carga Twitter y sólo para Twitter. Aquí es donde utilizaremos un complemento llamado Stylish para Firefox que nos ayudará a corregirlo. Pueden instalarla aquí. Una vez que esté instalada, deberemos crear un nuevo estilo en las configuraciones del complemento (menú de firefox->complementos->stylish).

Para el nuevo estilo definiremos:

@-moz-document domain('twitter.com') {
body, .media-not-displayed p, .tweet-box h2, body .latest-status-text, .tweet-counter, #banners form.turn-phx-off-form button.turn-phx-off-button, .colorpicker_current_color, label, input , textarea, select, button {
font-family: "Tahoma" !important
}
}

Con esto nos aseguramos de que funcione sólo en Twitter. Y voilá! Problema solucionado!

Espero les haya servido!

Slds!