Tired of the same old fonts? So are we!

Tired of the Same Old Same Old Web Safe Fonts?

Google's Making the Web Beautiful!

Web Safe Fonts
The art of web design follows certain standardly accepted rules or "best practices" - and one of the main ones is in regards to "Web Safe Fonts". These are the standard fonts that are likely to be present on a wide range of computer systems. If a visitor does not have the correct font on their website, the browser will substitute an alternative font. This is generally not acceptable to most web designers and the alternative solution is to use flash, which has the fonts embedded in the file, or to create graphics for use on the web.

Serif Fonts
In general, serif fonts are mainly used for headings on the web. They tend to lose readability at smaller sizes and usually do not look good in Windows unless the ClearType preference is turned on.

font-family: 'Bookman Old Style', serif;	Bookman Old Style
font-family: Garamond, serif;	Garamond
font-family: Georgia, serif;	Georgia
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;	Palatino Linotype, Book Antiqua
font-family: 'Times New Roman', Times, serif;	Times New Roman, Times

Sans Serif Fonts
Sans Serif fonts are generally selected for the majority of text content on a website. They generally look good at most sizes, have a contemporary feel and render neatly on most operating systems. Of course, that is not to say that serif font's cannot be used for larger blocks of text, but again, the general rule is sans serif.

font-family: Arial, Helvetica, sans-serif;	Arial, Helvetica
font-family: 'Arial Black', Gadget, sans-serif;	Arial Black, Gadget
font-family: Impact, Charcoal, sans-serif;	Impact, Charcoal
font-family: 'MS Sans Serif', Geneva, sans-serif;	MS Sans Serif, Geneva
font-family: 'MS Serif', 'New York', sans-serif;	MS Serif, New York
font-family: 'Trebuchet MS', Helvetica, sans-serif;	Trebuchet MS, Helvetica
font-family: Verdana, Geneva, sans-serif;	Verdana, Geneva
font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif;	Lucida Sans Unicode, Lucida Grande
font-family: Tahoma, Geneva, sans-serif;	Tahoma, Geneva

Monospace Fonts
If you need all of the characters to line up to the same width, monospace fonts are a good choice.

font-family: Courier, monospace;	Courier
font-family: 'Courier New', Courier, monospace;	Courier New, Courier
font-family: 'Lucida Console', Monaco, monospace;	Lucida Console, Monaco

"Cursive" Fonts
Cursive is generally avoided on the web; however,  the "somewhat cursive" Comic Sans MS font can be used and in fact, is typically overused

font-family: 'Comic Sans MS', cursive;

Comic Sans MS

Mobile Safe Fonts
The list of fonts for mobile devices is even smaller, limited to Arial/Helvetica, Courier New/Courier, Georgia, Times New Roman/Times, Trebuchet MS and Verdana.

Google Web Fonts to the Rescue!
Cost: FREE! With Google Web Fonts, web designers now have hundreds of web safe fonts to choose from! Google Web Fonts is a library that is continuously growing and the setup to use the fonts only requires one line of code in teh HTML for each font you use. It is easy to set up, compatible with most modern browsers and the vast majority of modern mobile operating systems, including Android 2.2 and iOS 4.2+ (iPhone, iPad, iPod). The fonts are hosted by Google; however you are allowed to download them for your design process and for use offline. Because they are hosted on another server, it can increase download time, but it is relatively minor and can be faster than serving images. The text is also now search engine friendly where images are not.

font-family: 'Tangerine', serif;

Making the Web Beautiful!

Websketching's New Web Content Management (WCM) System 5 for Websites, Tablets & Mobile Devices - coming soon - will support Google Web Fonts! You will simply select the Google Fonts you would like to use in the Template Designer!

Thanks Google!

Is Your Website Mobile-Ready?

There are more than 70 million people browsing the mobile web each day in the U.S. alone. A recent study by Morgan Stanley predicted that by 2015 there will be more mobile web users than desktop users.

Mobile Marketing Strategy 2011

Should you have a mobile website now? If mobile is rapidly becoming the dominant web venue, why wouldn't you? Can visitors to your site read the content, or is the text too small. While the layout of your 950 pixel by 640 pixel website might look great on your desktop it probably doesn’t work for a Smartphone. Chances are the text is tiny and unreadable with lots of awkward zooming and scrolling needed.

Excerpts from the Morgan Stanley Report published April 12. 2010

“State of the Internet…Mobile Will Be Bigger Than Desktop Internet in 5 Years.”

“Mobile Ramping Faster than Desktop Internet Did and Will Be Bigger Than Most Think”

“5 Trends Converging (3G + Social Networking + Video + VoIP + Impressive Mobile Devices) regarding pace of change, we believe more users will likely connect to the Internet via mobile devices than desktop PCs within 5 years”

“Rapid Ramp of Mobile Internet Usage Will be a Boon to Consumers and Some Companies Will Likely Win Big (Potentially Very Big) While Many Will Wonder What Just Happened.”

Mobile Web Content – Boiled Down Short Readable Chunks

Most mobile web users are traveling, going from point A to point B; they aren't interested in reading long documents or pages of text. They want immediate, valuable information. A mobile website needs to be boiled down into small, readable chunks.

Ask yourself; “What is the most important message I need to get across to a mobile visitor?” Is it the latest news from your company, or is it a valuable offer they shouldn't miss just because they aren't in the office?

Think about blog posts that are shorter and contain optional links to longer versions. Think about video - it's more important than ever, since most smart phones are great for video, and it doesn't require reading a lot of tiny text.