How to Fix the Microsoft.com Home Page

When Microsoft redesigned their home page, I was wondering if they simply threw it out there for critique. The page was violating at least a couple of basic design tenets, and I simply didn’t think Microsoft would leave it as-is. However, either nobody behind Microsoft.com sees anything wrong, or they left the job half done (again).

Alignment

What jumped out at me first was misalignment of page elements. To quote Robin Williams (the designer, not the actor):

“Nothing should be placed on the page arbitrarily. Every item should have a visual connection with something else on the page. […]

Be conscious of where you place elements. Always find something else on the page to align with, even if the two objects are physically far away from each other.”

(From The Non-Designer’s Design Book)

How many misaligned elements can you count here?

To stress my point, I drew a schematic diagram of the page:

Let’s rearrange elements just a little, so they become visually tied together:

This layout would bring at least some order to the otherwise disorganized page.

Proximity

Another important design principle is that of proximity:

“Group related items together, move them physically close to each other, so the related items are seen as one cohesive group rather than a bunch of unrelated bits. Items or groups of information that are not related to each other should not be in close proximity (nearness) to the other elements, which gives the reader an instant visual cue as to the organization and content of the page.”

Let’s go back to the original home page. At least two groups of elements are out of whack: the logo + slogan at the top; and the search/navigation box + promo on the right. I colored them together on the following diagram to show how I’d arrange them:

There are plenty of other ways to group related elements close to each other (proximity). This is only one of them.

Usability

From the usability standpoint, I still don’t understand why the “vertical tabs” of the content are so slow. This must be the slowest and most awkward tab implementation I’ve ever seen.

Conclusion

Even after several months of its existence, the new Microsoft.com home page still looks half-baked. Doesn’t one of the busiest pages on “the Internets” deserve at least very basic design considerations?

If you are a regular reader of my blog, you may remember my previous “redesign” exercise:

1. A Web Standards Showcase
2. Genesis
3. Rolling Up the Sleeves
4. Pardon Our Dust
5. The Final Frontier