b8

Category pages at a glance

Site Genre: Pattern Group b

magnify image Figure B8.1 Categories are labeled well and laid out consistently throughout Martha Stewart’s Web site. When visitors travel deeper through the levels, they know where they are by the color scheme, the navigation elements, and the content.

Background

This pattern shows how to design different sections of a Web site so that they are distinct but still obviously part of the larger overall site. Category pages are often reached through one of the MULTIPLE WAYS TO NAVIGATE (B1) including any of the organization schemes for BROWSABLE CONTENT (B2), such as HIERARCHICAL ORGANIZATION (B3), TASK-BASED ORGANIZATION (B4), CHRONOLOGICAL ORGANIZATION (B6), and POPULARITY-BASED ORGANIZATION (B7).

Close

PROBLEM

Some customers want to see which content or products are the most popular. But without clear labels indicating how the content was rated and over what period, popularity lists are useless.

buy the book to find out more

SOLUTION

magnify image FigureB8.3 Focus category pages on the featured content, while using consistent navigation.

Use a section category layout consistently throughout your site, with the same navigation elements, giving customers a strong sense that they have arrived at a new section and a clear idea of how to get back.

Other Patterns to Consider

Build a consistent category page layout using a PAGE TEMPLATE (D1) and CONTENT MODULES (D2), with consistent GRID LAYOUT (I1), NAVIGATION BARS (K2), and LOCATION BREAD CRUMBS (K6) to indicate where the customer is on the site. Use BROWSABLE CONTENT (B2) to provide strong information scent that customers either are getting closer or are on the right page. If you’re using TAB ROWS (K3), you might change the color of the tab for each category section. If you’re using a subsection element in a SEARCH ACTION MODULE (J1), make the default the current section. Use the CLEAR FIRST READ (I3) to indicate the section name so that visitors know that they’ve arrived at a new category.

Close

 

Pattern Resources

PATTERN COMMENTS

POST A COMMENT and/or EXAMPLE WEBSITE

You must be logged in to post a comment.