Category Archives: Design

The Shortcomings of Mega Menus

A design paradigm that has been increasingly popular of late, the so called “mega menus,” is a convenient way to corral large quantities of navigational links into a sensible hierarchy. It sounds good on the surface, and often does work well, but it’s not always the best solution.

UIE.com has a very interesting article, 6 Epic Forces Battling Your Mega Menus, that explains some of the primary usability issues with mega menus. A few of them could be designed around fairly easy, such as the common lack of indication that a menu trigger will open a menu. It’s a good read.

The Amazon mega menu seemed like an ideal solution to the growing tab problem. Finally, their design team had a way to show everything you could do on the site without eating up rows of tabs in the header.

Yet, just as suddenly as it had appeared, the mega menu suddenly disappeared. Replaced by a more sophisticated navigation scheme (that’s still on the site today), the mega menu’s lifespan was less than a year.

On the other hand, Jakob Nielsen has some good things to say about mega menus as well as plenty of usability tips for their implementation.

The W3C Has Released the First Working Draft of CSS4

Yes, you read that properly. The W3C has released the first specs for CSS4. Now that most modern browsers are well on their way to supporting CSS3, the W3C is getting started on the next “layer” of CSS. The Selectors Level 4 document already…

Prefixr: Cross-Browser CSS in Seconds

Many CSS3 attributes (e.g. border-radius) have long been implemented in various browsers with vendor prefixes, such as -moz and -webkit, which allow browser vendors to work on implementations of new features before the standard notation is set in stone. Remembering the different prefixes and…

Bootstrap: Twitter’s CSS Framework

Twitter has a new CSS framework, named Bootstrap, that they launched recently, which includes things like grids, custom form styles, tooltips and popovers, etc.. Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. It includes base CSS and HTML…

5 Sites to Find Free PSD Resources for Your Web Designs

Looking for some high-quality PSD resources? Maybe your design skills are lacking and you need some professional-quality elements for the theme you’re making for your blog. Or maybe you need some social media icons. Or maybe you’re just don’t feel like reinventing the wheel…

Easy CSS Sprites with Sprite Cow

CSS sprites are a commonly used technique to decrease page load times. One of the biggest hassles when setting them up, though, is figuring out the coordinates for the images in your sprite. (The other is rebuilding the sprite when you want to add…

Where to Find Free Fonts for CSS @font-face

If you’ve discovered the magic that is the CSS @font-face property, then you have likely run into one of its biggest problems: while there are plenty of free fonts online, not many are licensed with terms that allow you to use them with @font-face.…

Don’t Assume a User’s Browser Window Size

Chris Coyier has an amazing article that finally puts the screen resolution myth to rest. Despite screen resolutions getting progressively bigger, the available width for your web designs is not. If you have a ginormous 30-inch monitor, you probably don’t keep your web browser…

Design Spotlight: Pro Blog Design 2011

The industrious Michael Martin has once again redesigned Pro Blog Design, this time going for a more open (and less blue) look. The new design better incorporates promotion for Pliable Press and his custom design services, while still leaving room for third-party advertisers on…

The League of Moveable Type

Looking for some high-quality open source fonts, perhaps to use with @font-face? Look no further than The League of Moveable Type, an organization that curates a collection of professional typefaces licensed in a way that doesn’t inhibit your ability to use them on the…