Layout Options

The various types of pages and their features for University of Houston websites

Home page layouts

Every unit website should have a home page. The home page should feature information and provide introductory language to explain the purpose of the unit and to suggest what users may find deeper into the site. Practically, a home page cannot link to and represent everything the website has to offer; instead, it works best for headlines, features, calendar of events and timely notices. The following regions or blocks are appropriate for home page layouts.

Features

screenshot of a feature

A feature is a large image or slideshow meant to be the primary focus point on a home page. A feature could be as simple as a photo or as complex as a slideshow with images and captions featuring major news and events.

Announcements

screenshot of an announcement block

An announcement block should be the secondary focus point on a home page. The announcement block is a space to announce important information or simply to describe who you are.

Contacts

screenshot of a contact block

It is very important to have the unit's contact information displayed prominently on a home page. Address, phone number(s), and optionally social media links sould be displayed. A link to a page with more detailed contact information should be included.

Widgets

screenshot of a widget

Widgets or modules are blocks of content that pull data from other parts of the University of Houston website such as news feeds and calendar listings, or from external sources, such as social media and RSS feeds. Since this kind of content is usually not relevant to the content of a standard content page, it's usually best to use widgets on a home page.

SPIFFs

screenshot of a spiff

SPIFFs, or special interest features, are small blocks of content which usually highlight or preview something interesting happing on campus or within the unit. SPIFFs usually include a headline, a photo, some teaser text and a link to a page with more information.


Standard content page layouts

Nearly all sub-pages of a University of Houston website are referred to as standard content pages. A standard content page can take on multiple layouts and feature different kinds of navigation and content, but the addition kinds of content should be relevant to the main content on the page.

Standard

The standard layout includes a main content well with a sidebar. The sidebar can contain related content or navigation, such as SPIFFs, related links, or a table of contents. 

Wide

The wide layout is excludes a sidebar. This layout is best when there is no additional content needed in a sidebar or when the content well contains large tables, figures, a photo gallery, or anything else where the maximum amount of horizontal space is needed. 

Banners

Banners are usually found at the top of a page below the page title or <h1> tag. A banner should span the width of the main content area for both standard and wide layouts. Optionally, a small banner image can be used in the sidebar instead of the full width version. Banners can be photos or graphical elements. The use of text in the image should be avoided.


comments powered by Disqus