There was a day when web designers had about ten fonts to choose from that they knew would display correctly on the web. It was a dark, desperate time. Don’t get me wrong, some of these fonts are pretty solid screen fonts; Georgia, Verdana and Trebuchet MS being my personal favorites. They read well and look decent. However, a handful of utilitarian fonts isn’t good for designing attractive, unique websites. Up until now, the go-to methods for getting a unique font on your website were to embed images or *shudders* use Flash. Thankfully, modern web technologies are making this a thing of the past.

CSS2 introduced a rule called @font-face that allows browser to download a font and render a webpage with it. However there was never a consensus on which font file format (alliteration!) to use on the web, so @font-face never took off… until now. Modern browsers now include support for most font file formats (I’ll never tire of saying that) and the web is starting to be a much nicer place for us typophiles.

Why is the ability to embed fonts into websites so awesome? Because there are now hundreds of fonts that you can use on the web and the list is growing every day. If one of your clients has a unique font as part of their branding, you can now use that font when building their website. If you want to make your blog have some extra pop, you can use a wild display font for your h1’s and h2’s. The world is your oyster, my friends.

Now you’re asking, “Where do I start!?” First, Six Revisions has a fantastic write up about @font-face and using fonts on the web. Read it. Next, go find some great web-ready fonts! The foundry FontFont makes some of the best fonts around. I must recommend FF Meta as a the most readable sans-serif you ever did see and FF Tisa as a delightfully personable serif. You should check out FontFont’s whole web font offering as well as Google’s open source web font offering. Enjoy.

“The Mid-Atlantic’s premier provider of Electrical Testing, Engineering & Field Services” – Potomac Testing was ready for a powerful new look. We designed a new brand identity to help them amp up their presence.

We applied their new brand to their recent sponsorship of the PowerTest 2011 – the electrical maintenance and safety trade show held in Washington, DC in February. Under tight deadlines, we created a cohesive presence for Potomac Testing in the form of t-shirts, banners, brochures and giveaways that garnered rave reviews.

We also designed and developed their website, which you can see here. With a clean, friendly design, it offers much more information and interactivity to visitors than the previous site. It launched before the conference.

Last week, I came across a post on Toxel.com (a favorite site of mine) about 15 Examples of Modern Web Design. Yes, these are all cool looking and provide visual stimulation, but they go beyond just looking sweet. Check ‘em out:

Web technology is expanding exponentially in so many ways, and we should embrace it, especially if it makes life a little bit easier. And that is what modern web design is about. Things like Cascading Style Sheets, or CSS, are enabling web designers the ability to create amazing works of art while still enhancing functionality and site efficiency.

And although CSS and other web technologies aren’t necessarily new, they continue to update and change for the better, allowing increased usability. Their usage continues to enhance design and functionality, two things that go hand. And yes, while the sites above are artistic and beautiful, they are more than just pretty. They connect function with identity, which is just good design.