Content
About the Process - Design and Layout
- Peer review and the design process
- Drawing on best practices (old and new)
- User feedback and the final design
- The ongoing design process
Peer review and the design process
The MSU Web team reviewed more than 1,800 college and university Web sites, including those for “America’s Best Colleges 2006,” by U.S. News & World Report and all Big Ten universities. From the review, the team selected five sites for further analysis that the team deemed most effective in use of: design, layout, features, type/style of navigation and use of best practices. These sites were those of,
Hiram College, University of Southern California, Abilene Christian University, Cornell University and Wisconsin-Madison University
Drawing on best practices (old and new)
Some design strategies from the 2003 MSU home page design were carried forward in the new design, as they still proved to be effective:
- Use of horizontal audience menu and a vertical topical menu
- Use of news/events/spotlight on the home page
- School wordmark/logo prominent in the header
- Branding tagline prominent on the homepage
- Photo features/highlights on homepage
- Search box in the top right corner
- Global navigation
- Global footer
- No more then eight items in any one horizontal menu
- Use of a prominent photographic element
- Use of small graphics to highlight a story or event
The Web team also identified several common design elements among the top five sites from the peer review that represented more current design practices for a college or university site. Some of these were drawn on for the redesign of the MSU homepage:
- Use of gray or other neutral colors in the body of the site
- A three-column layout
- A centered layout
- Use of a horizontal bar(s) in the header, including school colors
- Use of a prominent panoramic photo
- Use of cutout photos
- Use of the school seal
Early on in the peer review the Web team identified from the University of Wisconsin-Madison's site, the use of a "Yahoo" style menu for topical navigation. It was determined that this style of navigation would work well to show the depth and breadth of MSU.
Initially, two versions of the home page were presented to administrators for selection and approval before the site was launched for public beta. The primary difference between the two was the treatment of the panaramic photo: rounded edges in one version, squared in the other. The later was selected to proceed to beta testing.
User feedback and the final design
In March 2006, a beta version of the new MSU home page design was made available to the public for testing. A survey was launched to gather feedback from users in order to make final adjustments. Over 700 users from the MSU community responded to the survey. Of those, more than 60 percent thought the new site was better or much better when compared to the old site.
In addition , a usability study was commissioned on the redesigned MSU home page by the MSU Usability & Accessibility Center. The Web site was evaluated in one-on-one usability sessions, including sessions with undergraduate students, graduate students and students with sight disabilities. The summary of this study included the following determination:
“Overall, participants were quite successful in locating links to certain information within the MSU home page Web site, such as finding the academic requirements for transfer students or the hours for the MSU main library.”
Feedback from the user survey and the usability study led to the following changes:
- Reducing the height of the main graphic to push content higher in browser windows
- Adding quick links
- Adding more MSU green to the look by changing the bottom gray bar to green
- Highlighting the page a user is currently on
- Making the audience portals more defined and obvious to users
The ongoing design process
The MSU Web Team views the management of the MSU home page as an ongoing process. A process that includes continual reevaluations of the look and feel of the site. The team will continue to gather user feedback to ensure the site continues to meet the needs of users, especially in regards to accessibility. Future updates to the look and layout of the site will build off what we have learned in earlier redesign proceses and will be done with the strategic positioning of the institution in mind.