Using fonts on your website was a pipe-dream just a short while ago. Plugins were introduced that allowed you to use Flash to load fonts on the fly, but the results were less than spectacular, and quite cumbersome to work with. But recently introduced technologies have made it possible for designers to display fonts on your web page using little more than a snippet of code.
I wrote a brief introduction to FontDropper 1000, a new service from Extensis, which allows designers to see what their site would look like using one of thousands of fonts available through Extensis’ WebINK technology. At the time, I could see that it was a cool technology, but I didn’t really follow-up on it because I’m not a “web guy” and figured it would be more trouble than it was worth.
WebINK allows for easy implementation of fonts, sizes and colors to an existing site
A few months ago, I met with a member of the Extensis team who happened to be in Phoenix for a convention, and we got on the discussion of why I hadn’t used their WebINK technology here on The Graphic Mac. I explained that I’m not a web guy, and the thought of hacking away for hours at my site code didn’t appeal to me. He then spent a few minutes convincing me to give it a try. If you’ve been a long-time visitor to this site, you’ve probably noticed that I did indeed get around to it a week or so ago, and it was incredibly easy.
As you can see in the image above, I used Arial exclusively for the site. But using WebINK I was able to quickly and easily change all the fonts on the site to exactly the font combination I wanted, as well as adjust the size and color for readability.
With instant previews of what my site would look like, I spent countless hours using FontDropper 1000 to play with different combinations of fonts. Because Extensis offers thousands of fonts, including the entire Google Web Fonts collection, as part of their service, I had plenty of combinations to try. Though it took me hours to decide what fonts to use, it only took a few minutes to copy and paste the required code into my site’s CSS – a fact I was quite proud of considering my knowledge of CSS is limited to little more than what CSS stands for.
All you need to do is sign up for an account on the WebINK site, play with FontDropper 1000 to see what your existing site will look like and choose your fonts. Once you do that, it’s a simple copy/paste job and you’re done. If you don’t have an existing site, or you’re in the process of re-designing it, they even offer a WebINK Photoshop plugin that allows you to use any of the available WebINK fonts in your Photoshop mock-up.
The WebINK site offers plenty of information and samples for you to read through, and a 30-day demo is available for you to test your font combination choices.
Overall, I’m thrilled that I was convinced to give WebINK a try, and I think any web designer will be quite happy with the ease of use and the results Extensis brings to adding fonts to your web design workflow.