TSN.ca - Website redesign

At a glance

Earlier this week, Tsn.ca, a popular sports Website in Canada launched its newly redesigned Website. Overall, the Website structure is clearer and information is easier to find but, the overbearing use of upper cap text and shades of gray are questionable design decisions.

Improvements

• Information architecture: Columns are better separated with clear headers and sub-headers. The information on every page is relevant.
• Better branding: Clean and sober design with a good sized Tsn logo. The logo is no longer overpowered by the advertisements.
• Improved navigation: First and second level navigations are grouped in a logical manner. The old rollover navigation was removed allowing users with limited dexterity to navigate effectively.
• Intuitive search: Clean and easy to use, the search process (search label > search term input > search submit) is clear and easy to understand.
• Clean tables: Rows and columns are properly labelled, information is clear and easy to find. Proper header alignment makes a big difference.

Further improvements needed

• Link styling: Links, static text and text advertisements are often hard to differentiate. The fonts and colors used are the same when they should be different.
• Visibility of system status: Page headers are clear but page titles (browser) and the secondary navigation should also let the user know where he is.
• Upper cap text: Almost all content, including important information, is upper cap. Upper cap text can be useful to make specific text elements stand out but, it is 20 to 30% harder to read because of the lack of variation.
• Insufficient contrast: Gray on gray and light gray on white makes reading difficult for aging and visually impaired users. Online tools can be used to test your Website’s color contrasts.
• No support for low resolution monitors: Less and less of an issue, Tsn.ca’s users with 800 x 600 screen resolutions (7%) will need to scroll horizontally.

Overall

Tremendous improvements to the information architecture and navigation makes the site a lot more efficient. Small styling changes (eg. using mixed case, fluid design, etc.) would be required to take this site to the next level.

This entry was posted on Saturday, April 12th, 2008 at 2:44 pm and is filed under Design Strategy. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.