Google has done it again with their new "Google Web Fonts". Now you can safely use a more extensive choice of fonts on your websites.
A major issue I have when working with graphic designers is the choice of fonts they choose. I fully understand the list of "web safe" fonts are pretty limited. But it is important that the web page renders consistently across all browsers and platforms.
When I work with graphic designers and branding specialists I am given a website style sheet. This style sheet defines the colours and fonts for the specific html tags. Examples of these tags are body, h1, h2, h3, h4. If a non-standard font is used, an inconsistent look can result across different browsers with the biggest issue being the the variants of individual character size.
Let me explain the process of how a browser renders a font on a web page. Most recent websites will use CSS (cascading style sheets) to define the look of a web page. This is simply a directive for the browser to use in displaying the page. If the CSS file looks for a font that is not installed on the end users computer, the browsers will use the use the default font. This is often "Times New Roman". If the page is visually designed for a font that has a wider character base than the browsers default font then the visual page layout will be destroyed, with placements on in-line images skewed.
There have traditionally been a number of ways a website developer can force the use of a specific font.
- The font file can be included on the website then a script can see if the users computer has the font installed and if not, then install it. The problem with this is that not all browsers support font installations and different operating systems have different requriement for their font files. You also have to be sure you have the rights to distribute the font.
- A more commonly used solution is to use a server based script to convert the line of text to a flash based snippet, This works well, but has a problem with Apple based mobile devices.
- Use the font in an image, and replace the image with the line of text. This is usally used in headers. Sorry! But Search Engines do not read text in images. This reduces the opporutunity to utilise your keywords.
Google has come to the rescue allowing the website designers and website developers to have it both ways enabling the incorporation of great design and great search engine optimisation.
If you want to use these Google web fonts on your website we can assist you.
