Typekit allows web designers and developers a way of embedding non-system-specific fonts using the font-face CSS property and jQuery.

After a quick and easy registration process on the Typekit website, selecting my fonts, and adding 2 lines of javascript code to my website, I was up and running. Simple as that.

So whats the problem?

Well, I’m not really going to moan about the limited amount of fonts available on both the free and paid versions. I think Typekit has opened the eyes of many font foundries and is doing a fantastic job as a ‘licensed font distribution platform’. As Typekit matures, we’ll no doubt see the catalogue swell in size, and might even see a version of Helvetica included!

Conclusion

My main problem is not anything to do with Typekit but the way Windows render fonts. Perhaps Typekit has made many designers forget just how terrible these fonts render. On the other hand, its making the problem more apparent. The above picture shows an example font from Typekit rendered in Safari on OS X (top) and IE8 on Windows 7 (bottom).

In some respect, maybe I’d be happier sticking with sIFR or Cufon from a rendering perspective (although they both have limitations and issues of their own), until we can use font-embedding with no draw-backs, as ultimately this is the way forward.

With the launch of IE9 the “dark side” might finally be able to render fonts appropriately.

Having just put my website live, I thought I’d share with you a summary of the tools I used…

Headdress

Headdress allows you to virtually host websites on your local network without having to dig through configuration files.

I use this application when I start to hand code my HTML/CSS templates. It’s also very handy for browser testing before the HTML goes anywhere else, on programs such as Parallels or VMware.

MODx Content Framework

MODx is an open source Content Management System, that can be easily integrated with clean and semantic HTML. No hacking existing systems to suit your requirements.

XAMPP

XAMPP is a practical and complete web server solution for your Mac. I use this to develop MODx locally as it’s quicker developing offline and I don’t require an internet connection, making it a great tool to have whilst working on the road.

Paparazzi!

Great little application for taking screen shots of full length web pages. Features include a delay timer, crop size and screen resolution. Give it a try!

I have finally found the time whilst traveling to put my portfolio website together. Tokyo seemed like the perfect inspirational place to settle down and get creative with the laptop.

An online portfolio is something I’ve never had in 10 years of designing websites professionally. My Mac also died on me with an earlier attempt, so I guess it wasn’t meant to be!

www.jonleverrier.com

I decided to go down the minimalistic route and built the layout around a grid system, as I felt it gave more focus on my work. I plan to add more pieces to the work and archive sections - as there is still so much missing from the site!

Features include:

• HTML5 Markup
• Hidden Hash Grid
• MODx CMS Integration

blog.jonleverrier.com

I actually wanted the blog to look like my portfolio website, however some of the sizing limitations of Tumblr didn’t play nice with my grid layout. So you are now viewing a custom theme I designed for my very own Tumblr blog. Very impressed with the system so far. Big thumbs up.