{"id":274,"date":"2013-03-29T13:19:25","date_gmt":"2013-03-29T19:19:25","guid":{"rendered":"http:\/\/www.stevenheld.com\/blog\/?p=274"},"modified":"2014-09-17T10:32:16","modified_gmt":"2014-09-17T16:32:16","slug":"weird-font-in-google-chrome","status":"publish","type":"post","link":"https:\/\/www.stevenheld.com\/blog\/weird-font-in-google-chrome\/","title":{"rendered":"Strange Glyph Font in Chrome – Temporary Solution"},"content":{"rendered":"

\"Google<\/a><\/p>\n

Chrome Glyph Font Problem – A Temporary Solution<\/h1>\n

Recently, I’ve noticed that Google Chrome has been displaying a weird glyph font with unreadable characters of certain fonts. None of the typical resolutions have helped, including: refreshing the page, closing the browser or even restarting the computer. I am using the latest version of Google Chrome version: 37.0.2062.120. The other browsers – Firefox, Safari, Opera – all display these same webpages just fine.<\/p>\n

\"Screen<\/a><\/p>\n

I did some research and found out that I am not alone with this issue and that Google is currently working on a solution<\/a>. The problem seems to be related to the fonts Helvetica, Helvetica Neue, and Arial. I’m not sure why Google Chrome is the only browser with this issue but I have noticed there are some fonts on web pages that display just fine interspersed with this strange glyph font.<\/p>\n

Because I am a graphic designer and I love typography, I found this problem very intriguing. I discovered that if I changed the CSS font-family of a page that had the weird chrome fonts to another sans-serif font such as Gill Sans, I was able to read the page just fine.<\/p>\n

A Temporary Solution<\/h3>\n

I reasoned that if the problems were with those specific fonts – I could deactivate them or replace them with a different font. Unfortunately, some of these fonts are system fonts and cannot be deactivated because they are used by my mac system. So my other thought, that actually works (but is really just a band-aid to the problem until Google solves the issue) is to edit the user specific css file for Chrome.<\/p>\n

To find the custom.css file (on a Mac it is in a hidden folder on the newer OSX) go the Finder<\/em> then click on the Go<\/em> menu item at the top. After the go menu is listed, hold down the Option<\/em> key to display the Library<\/em> option. Releasing the Option<\/em> key will hide the Library<\/em> option. You’ll find the custom.css file under the Application Support\/Google\/Chrome\/Default\/User StyleSheets\/custom.css.<\/p>\n

This file is blank unless you edit it. Open the custom.css and add the following code:
\n@font-face { font-family: \u2018sans-serif\u2019; src: local(\u2018gill sans\u2019); }
\n@font-face { font-family: \u2018helvetica\u2019; src: local(\u2018gill sans\u2019); }
\n@font-face { font-family: \u2018helvetica neue\u2019; src: local(\u2018gill sans\u2019); }
\n@font-face { font-family: \u2018Arial\u2019; src: local(\u2018gill sans\u2019); }<\/code><\/p>\n

Then save the file, restart Chrome and viola! A temporary fix to the font issue.<\/p>\n","protected":false},"excerpt":{"rendered":"

Chrome Glyph Font Problem – A Temporary Solution Recently, I’ve noticed that Google Chrome has been displaying a weird glyph font with unreadable characters of certain fonts. None of the typical resolutions have helped, including: refreshing the page, closing the browser or even restarting the computer. I am using the latest version of Google Chrome […]<\/p>\n","protected":false},"author":1,"featured_media":275,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4,3,5],"tags":[],"class_list":["post-274","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-design","category-information","category-typography"],"_links":{"self":[{"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/posts\/274","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/comments?post=274"}],"version-history":[{"count":11,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/posts\/274\/revisions"}],"predecessor-version":[{"id":346,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/posts\/274\/revisions\/346"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/media\/275"}],"wp:attachment":[{"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/media?parent=274"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/categories?post=274"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.stevenheld.com\/blog\/wp-json\/wp\/v2\/tags?post=274"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}