using google web fonts on mac computer

Question

I'm building a web page that uses Google WebFonts (open sans) on a PC and it works perfectly, but when I try it on a mac computer it shows a question mark within the text. Why is this?

Answer 1

The character you are seeing is the replacement character, which is used when a font does not contain a particular Unicode character, in this case, "ñ" AKA U+00F1 AKA "Latin small letter n with tilde".

Google Open Sans does contain this character, so it seems that Safari is not correctly getting the font from the web. The rendering engine is then reverting to another font, and that one is missing the offending character. You will be able to check in dev tools on your mac which font is being grabbed by your script.

I checked the script annotation you posted in the comment to your question. You are returning the fonts in the woff2 format. It turns out that woff2 is not supported in Safari as of version 9, but woff is. I therefore recommend changing the format to woff and serving it to your page locally:

• Download the script you posted (http://fonts.googleapis.com/css?family=Open+Sans:300,400,500,700)

• Save it as a css file (e.g. fonts.css)

• Find-and-replace woff2 to woff

• Save the file

• Add it to your web project (however you add your other files)

• Replace @StyleSheet({"fonts.googleapis.com/css?family=Open+Sans:300,400,500,700";}‌​) with a reference to this newly uploaded file.

Answer 2

Solved! One of the developers had its Eclipse not set to UTF-8 so the file transfer using Git wasn't working properly...to check, go to Preferences>General>Workspace>Text file encoding and set to UTF-8