December 2007

Beefy Input Boxes Tutorial

After reading my article about using CSS to style form controls you might get the impression that I never use CSS for this purpose. Allthough I avoid it when not necessary, sometimes modifying a look of a form improves the usability of a site.

One way that designers show the relative importance of objects on the screen is by increasing the size of one element relative to the other elements on the page. Many sites call attention to input boxes by making them extra beefy. Today I will show you how to create a beefy input box that works in all of the modern browsers.

Typography Rules!

This just in, sites with excellent typography are some of the highest rated on the web. Well at least thats the case on commandshift3.com. For those of you stuck on Windows, command shift 3 is the keyboard shortcut for a screenshot on a Mac. Command shift 3 describes itself as hot or not for websites and basically thats what it is, you are shown two screenshots of websites, and click on the one you like the best.

The real reason for this post though, is not to promote command shift 3, but to point out that the current top 3 sites focus primarily on typography to create their desired effect.