Web fonts have come along way and there is some really great work being done to make it more reliable across many browsers and platforms.

We were using sIFR which is a flash based solution I thought worked pretty well. Then we tried out Cufon which basically renders an SVG version of the font using javascript to display it on the page. Which also seemed to work ok until I had to edit a 10,000 character page that Cufon generated inline styles for. Yes, an inline style for EVERY character! (man that was a headache)

We also tried @import but that was unreliable on some devices. TypeKit seemed like it was too early and nothing seemed to really stand out as a reliable, easy to implement solution. Until now!

Google is doing some really great development with a handful of fonts that are simple to implement and reliable across all the popular devices being used today. But the library is pretty limited to make it a main solution. I'm sure that will change shortly though.

I have to say, I've been a long time user of Suitcase and was even an active beta tester for the app at one time, so I may be a little biased. But it makes sense for them to rollout their version of how fonts should be implemented on the web since they have years of experience with fonts and font issues. And rollout a solid solution they did!

Think iTunes for fonts.

Font designers will love WebINK like musicians are loving iTunes. They still have a little work to do in pricing and reliability across different devices. But it's a great first start!

What are your thoughts on these solutions and have you seen anything better?

Comments

Chris Robers commented on 09-Sep-2010 05:53 PM

Nice write up. Web fonts are maturing before our eyes. It should be noted that several of the most prolific and important font foundries have embraced web fonts. Monotype, Linotype and ITC are all currently available for web font usage via Fonts.com's web font service (http://webfonts.fonts.com). These collections contain the most widely used fonts for corporate identity and branding. Fonts.com Web Fonts is the only service to support 40 major languages including Chinese, Japanese and Korean, and now lists 4,752 fonts. 2,279 can be used for free. Over 7,000 web fonts will be available at end of beta.

Anonymous commented on 20-Sep-2010 07:11 PM

Thanks for the info Chris! webfonts.fonts.com looks like a very strong player indeed! It's good to see some really heavy hitters embracing the web.

Anonymous commented on 14-Sep-2012 03:33 AM

You get a lot of respect from me for writing these helpful atricels.

Anonymous commented on 14-Sep-2012 03:33 AM

For the love of God, keep writing these atrilces.

Anonymous commented on 14-Sep-2012 04:16 AM

I am making a blog in Japanese now. I am American so this is not easy. I wish my sarech box could be in Japanese.Your comments on font were very helpful. I was completely lost before I read your comments.

Anonymous commented on 14-Sep-2012 04:17 AM

You really saved my skin with this infroamtion. Thanks!

Anonymous commented on 14-Sep-2012 07:03 AM

I stopped using drop shwaods (and gradients) because they caused my site to download so slowly because of this, I've been creating unsafe web text in a new Photoshop document (with a transparent background), and then save it. I then drag and drop the image
into my iWeb page and resize as needed. It seems to allow the page to load 99% faster that way. Please tell me I'm wrong, as it is so terribly tedious to do a bunch of different texts this way.

Anonymous commented on 14-Sep-2012 07:04 AM

Hello, why should I turn non web-safe fonts into imeags? Everything seems to be fine without doing so. It seems as if my non web-safe font is shown properly as a text on my brand new website, so search engines are able to identify and browsers are able
to display.But maybe I'm wrong and live in the illusion of my own mac with firefox and safari??? Must try neighbours windows explorer later on Best wishesSteffie

Anonymous commented on 14-Sep-2012 12:41 PM

It would be a really cool trick, aultohgh it doesn't work properly always: e.g. if the user is surfing the web with firefox most probably he/she will see a squared shadow framing the text. I would strongly recommend to use tools such as photoshop and create
text-image file in giff format (which also easily support the transparent background and it's definitely light weight).btw thanx for the blog, it's nice and helpful!!

Anonymous commented on 14-Sep-2012 12:41 PM

It is indeed a truly amnaizg tool for font selection. But be warned that not all computers/users can view the special font you've set for your site. It's depending on whether or not the user has the approprite font installed into their computer.

Anonymous commented on 14-Sep-2012 03:00 PM

I think this is one of the most vital info for me. And i am glad reading your aritlce. But wanna remark on some general things, The web site style is perfect, the aritlces is really excellent :-D. Good job, regards, Charlott Rennick

Anonymous commented on 14-Sep-2012 06:13 PM

I followed the video, tried to add 1 font and then came back with a csuotm functions error, so now I can't do anything! boo! Any advice?How can I get it back to what it was? Will I have to re-install the theme?Thanks in advance for your help.

Anonymous commented on 14-Sep-2012 06:13 PM

You are the MAN!!!This is beyond aesowme. I have no technical background in programming, web development or even computers. Everything has been self-taught or through watching videos like yours. I can't tell you how much this has helped me.