Google Web Fonts displaying poorly on Chrome Mac - css

I'm using Google Web Fonts on a site and it's rendering pretty poorly in Chrome Mac Version 19.0.1084.52. This only seems to be an issue when font-weight: 700 (bold); is used. Here is a screenshot comparison of my site and how it renders on the Google Web Fonts site:
http://cl.ly/0Q3m2F1X0f3S3I190U2n
It's the same size and weight yet it's not nearly as clean and clear on my site.
Also using -webkit-font-smoothing: antialiased;
Any insight would be greatly appreciated. Thanks!

Related

Google chrome font rendering issue

While developing my website, I noticed how Chrome was rendering my fonts (Roboto).
Long story short, here is a Screen shot of both the browsers:
IE/Firefox:
http://i.stack.imgur.com/mEZWb.jpg
Chrome:
http://i.stack.imgur.com/4NTwY.jpg
Checked the website in m y friends' pc too, but the bug is still there. My chrome version is 44.0.2403.125 and the font-face is Roboto. What to do?
Did you download the roboto font to your computer by any chance? I had a similar problem where I downloaded and installed a font to my computer, but it was bolder than the font I had been using with google fonts for my website, and after I installed the bolder font version, the font on my website also became bolder. I discovered that chrome is set to use locally stored versions of fonts with the same name wherever possible.
The solution was to un-install the bolder font version stored on my computer and refresh the cache.

Font-awesome fonts proving problematic with IE11

We are using Font-Awesome 4.0.2, and have been doing so for about 18 months. Just recently, with IE 11.0.9600 17843, we have noticed intermittent rendering issues. We can CTRL-F5, and the fonts appear, then go off the page and return and find some fonts absent. When you hover over them they reappear.
On some instance of the same IE11 browser(64bit not 32bit) it works fine. We have checked the security settings ie fonts can be downloaded.
There is no issue with Mozilla or Chrome.
Weirdly the problem exist with the live site and not the QA site. Both are on the internet.
I have have researched this, and the intermittent nature is the key, and it may point to a bug in a recent IE11 update, since this did work with IE11.
Advice appreciated...
Should we update to the newest Font-Awesome ie 4.3, or is this newer version just contain more fonts?
Thanks in advance.

Fonts only display correctly in Incognito Mode

I'm using a couple of custom fonts in my site, one from google fonts and another that I uploaded along side the index.html. All properly declared in the css file.
When I preview the site throught the HTML Editor (Sublime Text 3) it shows just fine with all the custom fonts in place, but once I upload it to the server and acess the site through the internet all the fonts change to arial, I believe. This also happens in Internet Explorer. I looked the CSS file and its all good. The fonts are declared in the right elements and there is no overwrite.
Now the wierd part is that when I open the site in Inconito Mode from Chrome, the fonts load just fine. Which makes me think that there is no problem with the css. When I inspect the element thought the browser it shows as crossed out.
Have no idea what is causing this, anyone have ever seen something like this?
I'm having the same problem, not only with google fonts but also with fonts I made myself and are uploaded to the same server; In my case it was because I installed the chrome app disable web fonts (without knowing that I did that), and this app isn't working in incognito mode.
Make sure to clear the cache of your browser. If your using google font, i guess your reference is made to the google site. Make sure the server can access the google site.
I have already experienced a delay for the font to load because of the external reference.
Hope this help.

google font make page load very slow in china

I am using google font on my site. Some clients in china said that the site load very slow. I checked it, it is causing by the google fonts. I looked the google font faq, they said it will download the font file to the customer's computer before loading the site. Are there any way to fixed this slow loading issue?
This was a known issue... Google Fonts were slow loading in China. Previously you could serve mirrors of the fonts through Qihoo 360 CDN servers in China. However, as of August 2016 the problem has been fixed. At the same time Qihoo 360 has stopped fonts.useso.com and all mirrored fonts hosted under fonts.useso.com stop working now. Details are described here.
Google has fixed Google Fonts, which now directly serves the css and
font files from Google’s servers in Beijing, which means Google Fonts
are much more stable and faster to users in China now.
I recommend all webmasters who have been using fonts.useso.com switch
back to the original Google Fonts as soon as possible.
I figured a way to fixed it. Instead of loading it with link tag, I changed to load the font with javascript and load it async, it is fine now. much faster

Auto install a font used on my website

I am using a custom font on my site and in search of a way that this font will be installed automatically on the user's system who is opening the site.
Is there any script or any way to do that?
Yes, font squirrel has an easy-to-use generator that will transform your font into various formats appropriate for different browsers.
The font is not actually installed on the user's machine, it's linked remotely, like an image or script. There's no way to automatically install things on people's machines for obvious security reasons.
The answer is Yes!
New in CSS3 is #font-face, which tells a browser to download a font and use it to render some text. This is an an example I made with jsFiddle. The caveat with #font-face is that each browser requires a different file type to work. On websites like Google Web Fonts you can use fonts that will work in all browsers.

Resources