DESIGN ELEMENTS: IDEAS May 25, 2010

Template Examples 2 Navigation is organized by topic and by audience. Global navigation is horizontal. “Stories” about programs, students, alumni, and faculty highlights the school’s strengths. “Modules” allow school to highlight content. “Connect with Mason” emphasizes social networking tools and blogs.

3 William & Mary’s design is consistent throughout, yet allows for variation of design within a clear style and system.

4 Easily changeable modules (text, image, content) for a variety of uses. Stays in template design, but allows for some variety through imagery, left navigation, and modules on right and bottom.

Easily changeable modules (text, image, content) for a variety of uses.

6 Indiana’s design is consistent throughout, yet allows for variation of design within a clear style and system. Departments highlight strengths through messaging and images.

7

Multiple Modules 8

9

10

11

12

13

14

15

16

17

Actions Are Clear 19

Audience-Based Navigation 20 Navigation is organized by audience- based visual design.

Fast Facts 21 This module allows room for a lot of “fast facts” without using much space.

22 Navigation is organized by audience-based visual design.

Admissions Design  New Students Site 24

Content Design 26 Large headers make the page easy to scan. Font size and spacing make the text easy to read.

Clear action items on the right side. Content Design

Large headers make the page easy to scan. Font size and spacing make the text easy to read. Clear action items on the right side.

29 Clear action items on the right side. Large headers make the page easy to scan. Font size and spacing make the text easy to read.

30 Large headers make the page easy to scan. Font size and spacing make the text easy to read.

31 Header-size links on jump pages make list of links easier to read.

32 Header-size links on jump pages make list of links easier to read.

Related Links/Quick Links 33

34

35

36

Faculty/Staff/College Counselor Bio Pages 37

39