Yale University. Calendar. Directories.

Yale Web identity

Consistent user interface and visual design create a sense of place on the Web. Members of the Yale community as well as Web visitors typically navigate a range of Yale sites. University Web pages should therefore ideally share navigation conventions and certain elements of design and “branding.”

Yale has developed a set of Web guidelines that permits considerable design flexibility while preserving key interface and institutional “branding” elements that complement Yale’s visual identity. These user-oriented interface elements create a minimal but consistent set of navigation conventions across all University Web sites:

Use Yale Web page layout
Use Yale typefaces
Use the Yale logo
Use Yale Web Blue


Use Yale Web page layout

The following diagram illustrates the fundamental “pixel grid” for Yale sites. Detailed information about using this grid is available in Web style guidelines and resources.

Generic page grid for Yale pages.

 

Back to Top

Use Yale typefaces

Typographic consistency is a subtle but powerful way to create a sense of place within Yale’s Web offerings. Yale has developed a highly legible system of typefaces for Web page graphic and HTML typography.

Examples of the Yale, Verdana, and Georgia fonts.

Details of Yale Web typography

Back to Top

Use the Yale logo

The Yale logo should always be positioned at the left side of the page footer of all official Web sites of the University. The logo should be linked to the Yale University home page. Refer to guidelines for exact placement of the Yale logo.

Example of the Yale logo in a web page footer.

 

Back to Top

Use Yale Web Blue

Always incorporate some instance of Yale Web Blue in your Web site to anchor your design within the larger Yale color family. Yale Web Blue need not be the dominant color; it may be used as a spot color for a repeated graphic component, or for specific typographic elements.

The dominant colors of your site should be drawn from Yale’s extended set of colors for Web design. Limit the dominant layout elements of your site design to a set of three to four coordinated colors.

Yale Web Blue swatch.

 

Back to Top

 

Yale QuickLinks.