Web Design Elementals: 
  Case Study III
web design:


planning
design basics

case study details






other resources

links
class rolldocuments

credits



Microsoft Corporation

Pic of Microsoft's main pageMicrosoft's website (live site) uses a navigation structure similar to the one we saw on the Dell website, with its link structure spread across the webpages. Microsoft has some main links, located in black, on the top of each webpage. The links down the left side of most webpages are pretty consistent as well, but change with different areas of the website .

Screenshot of a Microsoft pageAnother problem with Microsoft's site is its lack of effective color use. While most of the site uses a light blue, many pages on the site use different colors, like yellow on the office page, red on the college employment page, and images for headers on the download page.

Besides the lack of color coordination and link design, Microsoft's website offers a few more pearls of poor design. navigationally, the site is a mess. Once a viewer enters some areas of the website, like the Office area, accessed from a link on the main page, there exists no way to get back to Microsoft's home page other than the word "Microsoft" on the top-right of the webpage.

Screenshot of a Microsoft page Screenshot of a Microsoft page
(Two example webpages whose themes do not match any other webpages)

 

While it is always good practice to have a link back to your main page on every page in a site, this link should be easy to find and with the rest of the link navigation on the webpage. Microsoft does not include this link with any existing link areas, forcing the user to search for ways to get back to the main page.

Screenshot of a Microsoft pageMeanwhile, on the top left area of the Office webpage, there exists not one, not two, but three links to "Microsoft Office Home." This is the site the user currently is on after arriving from the main page, and even within the site, three links, all in the same concentrated area, is very poor design. As well, links should not direct users to the page they are already on, as this frustrates users who may not understand why the page does not change when they click on a link.

Another element to note on the Microsoft site is its failure to remain in the 800x600 pixel size that the main page fits into. The site's artwork and text all cuts off neatly at the 800x600 mark on some pages, but overflows on others.

Screenshot of a Microsoft pageAlso, although the site is designed for this minimum size, when the browser window is very large, the site does not adjust for the increased visibility area, instead locking all its content into non-resizable tables. Even if the end user has a larger space available for veiwing, the Microsoft website still imposes restrictions on how much a viewer can see at one time.

This of course, is also true for the Apple and Dell sites as well, as neither site resizes to fit larger monitors. The Apple site does however change with larger monitors, as it is always centered on the screen. Thus, increased browser windows and the extra white space that they allow is used to greater effect since it is divided and thus less distracting to the site overall.

Screenshot of a Microsoft page with no imagesLike the rest of the sites we have looked at so far, Microsoft's webpages do employ "alt" tags to inform readers who may not accept images on their browsers.

In the end, the biggest problem with Microsoft's website is its lack of consistency. Poor consistency is bad design. It is hard for the user to understand and it reflects poorly on the sponsor. In this case, the sponsor is the largest software manufacturer in the world.