Skip to content

The Home Page Wireframe

The Pages

Homepage

Wireframe of homepage«Click this thumbnail image to view a larger image

We announced this wireframe in a previous post, but we decided to post it here again. We stripped out all visual design elements—the slight colors we’d included previously, as well as the UT wordmark—so that our design would be presented as cleanly as possible. Attention should be on structure and organization, not visual design.

When we devised the various navigational elements that we’re proposing here, we considered not only the way our users access information about UT, but also what they look for most often. We also considered our primary audiences. We considered the navigational structure of other higher ed sites. We considered the chancellor’s initiatives. We considered the messages that our university most wants to emphasize. We wanted to be certain that there were clear inroads for prospective students, as they are the lifeblood of our university. We wanted to be clear that we value academics and diversity, as well as athletics and “tradition.” We wanted to include space for showcasing the opportunities our local and regional location offers—both culturally and recreationally.

Some Notes on the Header

But first—what’s a “header”? For our purposes here, the header is the space at the top of the webpage above the first navigation bar. On this site, for instance, it includes the horizontal orange bar with the links to tools and to our Google search appliance, as well as the UT wordmark and the image that reads “Creative Communications.”

There’s a navigation bar in the header of our wireframes, and it collects tools that will be accessed most often by visitors who are already members of our campus community. Our analytics show that most of our local visitors use utk.edu as a gateway to these tools—as the first stop on a path to access the student portal, e-mail, the directory, the A-Z list, etc. These items will have dropdowns (they’ll either trigger on hover or click, whichever we determine to be most in keeping with functionality and best practices as we work out the proof of concept).

Some Notes on the Footer

“Footer” is shorthand for the area of the webpage situated directly beneath the central content. On this site, for instance, it’s dark gray and includes only very basic contact information. The header and footer work together to “wrap” the content of our web pages and provide consistent visual identity and common information throughout each page of a site.

We’re planning to have a bit more information in our footer than we’ve previously had. The campus map will be graphically represented and linked here, as well our social media outlets. We’ll also provide access to information about the university, its administration, its mission, and its initiatives. Contact information will be linked here, as well as information about the site and links to the new web templates, branding information, and Creative Communications’ services.

We’re not putting this information in the footer because it isn’t important. Web design trends of the past few years have taught users to look for key information in the footer—information that remains consistent across pages, even as content varies from page to page. Make no mistake—the footer is another navigation and will provide access to key information about our university.

Some Notes on Redundancy

For those of you who may still hold reservations regarding the footer information—the page of traditions or the page on “vision and mission,” for instance—while we do plan to create central pages that collect and clearly state that information, the site as a whole should embody and reflect those things, as well. Where it’s relevant and appropriate, we’ll reference the university’s history on the category pages of the site. The branding will be reflected in the appearance and structure of the site, as well as in the style of the stories we tell. The vision and mission of our university will likewise be embodied throughout the site. Members of our administration will be accessible via the “People Finder” tool in the header navigation bar, and they’ll also be featured throughout the site. The chancellor’s initiatives will be present in the pages of the site.

In other words, even though the formal navigation of the site is of central importance to the success of the site—by providing structure and organization of information, by anticipating visitor needs, by offering logical arrangement of news and information, and by providing access—we will also be employing more subtle means of providing information access and emphasis. While there will be separate pages of the site, no page will be truly separate. There will be no one way to access information. Rather, there will be many ways.

» Proceed to the next post to view the secondary page wireframes

2 thoughts on “The Home Page Wireframe

Comments are closed.

The flagship campus of the University of Tennessee System and partner in the Tennessee Transfer Pathway.