Interface Design CGS2826 Web Design Program in Interdisciplinary Computing Florida State University From Web Style Guide, Chapter 4: Interface Design
Users of web documents don’t just look at information, they interact with it in novel ways that have no precedents in paper document design; therefore, web designers must be versed in the art and science of interface design.
Wayfinding The elements of the built environment that allow us to navigate successfully through complex spaces like cities, towns, and the Web.
Orientation: Where am I right now?
Route decisions: Can I find the way to where I want to go?
Mental mapping: Are my experiences consistent and understandable enough to know where I’ve been and to predict where I should go next?
Closure: Can I recognize that I have arrived in the right place?
On the Web there is no sense of scale or compass directions.
Wayfinding Print designers and editors often chafe at the heavy interface framing of web pages—do we really need such a burden of headers and footers and buttons and links? Well, yes, we do. Without that navigation interface, and all the “you are here” markers it provides, we’d all be back to that lost-in-space feeling that was so common in the early days of the web.
Paths & Breadcrumbs
In large sites users should be able to readily see when they have passed important regional boundaries. If all the pages look identical, it’s hard to tell where you are within a large site.
As pages get more complex, offering many choices, you risk overwhelming the user with the “Times Square effect” of too many competing visual stimuli.
Regions: Create a unique but related identity for each site region
Nodes: Don’t confuse the user with too many choices on home and major menu pages
Landmarks: Use consistent landmarks in site navigation and graphics to keep the user oriented
User interface research shows that about half of web users prefer to browse through menu lists of links to find information, and the other half will go straight to the search box to enter keywords for search. Supporting both navigation paradigms is important to user interface design.
Multiple and complementary “you are here” markers help users stay oriented in complex sites. These landmark and wayfinding elements are especially important to users who navigate by searching - who may never even see your home page .
For sites larger than a few pages, provide search on every page. Be sure to define the scope of the search, ie. the site, the department, the entire organization, the entire Web?
MINIMIZE STEPS Users prefer a few pages of carefully organized choices over many layers of oversimplified menu pages
Strong site identity
Focus on content
Visible site structure
Functional stability has two components: getting things right the first time as you design the site, and then keeping things functioning smoothly over time.
Provide direct links to the Web master.
Pages should load in less than 10 seconds.
“ Folder tabs” are ideal when your site has relatively few (five to seven) major navigation categories. Semantically, header navigation lists should always be marked up as html lists, even if what appears on the page looks more like a collection of folder tab graphics.
Every webpage needs…
An informative title (which also becomes the text of any bookmark to the page)
The 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
The home page url
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 your site
At least one heading to identify and clarify the page content
Mailing address and contact information or a link to this information
Alternate (“alt”) text identifying any graphics on the page
Enterprise interface programs have three primary aims: coherence, symbolism, and positioning. The Enterprise Interface