Interface Design Web Design Professor Frank

Design Graphic design and visual graphics are equally important Both work together to create look, feel and functionality of website

Wayfinding Elements of the built environment that allow us to navigate successfully through complex spaces

4 Components of Wayfinding Orientation Route Decision Mental Mapping Closure

Maps as Wayfinding Metaphor Paths Edges Districts Nodes Landmarks

Navigating the Web No sense of scale or movement No compass You are here

Paths “Breadcrumb trails” show where you are in relation to overall site

Districts and Edges Consistent page grid, terminology, and navigation links Visual flexibility to create identifiable regions and edges within the larger space

Nodes “Give the user choices” but... too many choices leave user overwhelmed and likely to give up

Landmarks “You are here” orientation clues Use consistent landmarks in site navigation and graphics to keep the user oriented

Browse vs Search Half of users will browse through menus, half will go directly to search box All readers will use both the browse and search features at some point

Orientation Both the browse and search aspects of navigation must support the user’s sense of location and orientation to the major landmarks of a site Use Breadcrumb trails, tabs or links that change color to indicate the current location, and section titles

Orientation

Orientation (continued)

Supporting Search Users Make search available on every page! Scope of search? Whole site or entire Internet? Results page should look like the rest of the web site

Interface Design Stems from organization of printed books and library indexing and classification systems Don’t get so lost in the novelty of web pages that basic standards of editorial consistency, business communications, and graphic design are tossed aside!

Freestanding Pages Need: Informative title (also the name of a bookmark) Creator’s identity (author or institution) A creation or revision date A copyright statement, Creative Commons statement, or other statement of ownership to protect your intellectual property rights At least one link to a local home page or menu page, in a consistent location on all pages Home page url

Also Helpful An organization logo or name near the upper left corner, with a link back to your home page Navigation links to other major sections of site At least one heading to identify and clarify the page content Contact information or a link contact info Alternate (“alt”) text identifying any graphics on the page

Enterprise Interface Consistent design = consistent message Attract more users, keep the visitors you do get and get repeat visitors

Enterprise Design Elements Coherence Symbolism Positioning

Coherence, Symbolism, Positioning

Last Words! An effective web presence can be a powerful tool for enhancing the status and competitive positioning of an enterprise, but only if the web site effectively projects a feeling of trust in the knowledge and competence of the organization that produced it.