22 June, 2012

(Firefox) How to "fix" that ugly Roboto font in developer.android.com documentation pages?

Today I opened online Android SDK as usual and was shocked. They have replaced their body font with some kind of a blurry crap. At first I tried reading it hoping I'll get used to it, but after a whlie I became dizzy and my eyes were hurt...

So, I had to fix that in order to continue reading the documentation.

In the page source I identified the line:
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=
        Roboto:regular,medium,thin,italic,mediumitalic,bold" title="roboto">

It's basically this Roboto font that makes me sick.

The easiest solution was to block fonts.googleapis.com at the system level, i.e. add 127.0.0.1 fonts.googleapis.com to C:\Windows\System32\drivers\etc\hosts file. That did work, the browser replaced missing Roboto with the default Arial (which is perfect). But I didn't want to totally disable Google Fonts API (in case if some webside uses it for actually cool looking font).

Since I am using Firefox, I checked if there are addons that can filter HTTP requests using resular expressions or wildcards. Redirector addon didn't work: it seems to redirect only URLs you enter in the address bar.

And finally BlockSite addon was just what I needed. I added the following URL to the black list:
http://fonts.googleapis.com/css?family=Roboto:*

... and enjoyed reading Arial.

Still, it is very annoying when Google adds new "looks" and "features" without giving users an opportunity to say they hate it!

PS: I switched back from Chrome to Firefox for a similar reason...

2 comments: