This is the second post of the Microsoft.com Home Page Redesign project. In my previous post I laid out the reasons I started this exercise in the first place. Let's move on.
What We've Got
Microsoft's web site is incredibly busy. With this magnitude of traffic it's easy to see any redesign wins or losses. According to Inside Microsoft.com the site had
- 165 million unique users
- 1,201 million page views
- 590 million successful downloads
in May 2004.
Size
This must be the whole site with its numerous subsidiaries, not just the home page, but still... We'll use these numbers to gauge our progress.
The original home page, that I lifted on June 15, is 48,677 bytes in size delivered uncompressed. It takes about two dozen packets to deliver it. Assuming 165 million unique visitors per month that adds up to 7.3 Terabytes.
Structure
The page is littered with tables (and everything that goes with them), font tags, inline styles, etc. Inline CSS styles are legit, but their excessive use defeats the purpose of content/structure separation. Speaking of which... there's no separation of content from presentation on the current home page.
Browsers
The page renders acceptably well only in IE/Win 5.5, 6.0. Everywhere else it falls apart.
Our Objectives
To gauge success or failure of our redesign we need to set clear goals and expectations. Let's commit to the following objectives:
- Reduce payload. We will restructure the page, throw away all tables, unless they are needed to present tabular data. We will separate structure (HTML) from presentation (CSS) and behavior (ECMAScript aka JavaScript). We will make sure the page validates properly as either XHTML Strict or XHTML Transitional. We'll talk about this choice later.
- We will make the page more accessible by adding
title and alt attributes where necessary.
- We will make the page usable in IE 5.0/5.5/6.0, Mozilla, and Opera. I don't have IE/Mac at my disposal (some day I will). I will appreciate if someone checks the final page on a Mac.
What We Won't Do
In a traditional sense, redesign gives a site a new look, improved navigation, ease of use, better accessibility, etc. We will not give Microsoft's home page a new look. It's a link galore right now, and so be it. The point of this redesign showcase is to show how to revamp a site the "web standards way" and illustrate benefits.
What We Will Do
Even though visual revamping isn't on the agenda, a structural one is. We won't be able (and we don't have to or need to) create an exact replica of the page, but the majority of work will be about structuring content and styling it with CSS.
This will not be a traditional redesign per se. There won't be deliverables. There won't be exploration of site structure with diagrams and charts. There will be no post-launch maintenance. We will work in the context of only one page. If you want to considerably improve your skills in the web design business read Web Redesign: Workflows That Work or The Design Of Sites.
