Download State Board Website Exemplars - National Council of State Boards

STATE BOARD WEBSITE EXEMPLARS
Christine Andrews Paulsen, Ph.D.
Concord Evaluation Group
June 9, 2011
NCSBN NLC and Consumer Conference in Chicago, Ill
CONFERENCE OBJECTIVES

The conference is consumer-focused:





Describe the current state of consumer protection from the
viewpoint of the consumer.
Describe the consumer perspective on scope of practice.
Understand the consumer view of discipline and
accountability.
Identify the importance of transparency in a state board
website.
Describe performance measurement and its role in
accountability.
2
PRESENTATION OBJECTIVES

This presentation is also consumer-focused:
Importance of consumer-driven websites
 Best practices and exemplars


Based on our review of State Board of Nursing websites
3
WHAT IS A CONSUMER-DRIVEN WEBSITE?
Usable
 Accessible
 Transparent
 Understandable
 Meets the consumers’ needs and expectations

4
WHAT DOES “NOT USABLE” LOOK LIKE?

It may help to start with examples of poorly designed
websites. Have you ever visited a website that made you
ask, “What were they thinking?!”
5
WHAT DOES “NOT USABLE” LOOK LIKE?

Cool and sleek design does not always equal usable
design
6
WHAT DOES “NOT USABLE” LOOK LIKE?

Poorly designed sites do not match users’ expectations
7
WHAT DOES USABLE LOOK LIKE?
Most of the topics I will cover are discussed further in
the Research-Based Web Design & Usability Guidelines
(U.S. DHHS) at http://usability.gov/
 I will draw upon examples of State Board of Nursing
websites as exemplars.
 Keep in mind that consumers seek out websites for
basically 3 reasons:

To buy something
 To play/socialize
 To find information*


This presentation will focus on the third consumer type
8
CONSUMER-DRIVEN DESIGN
When

Involves consumers at all
stages of website
development
 Planning
 Prototypes
 Content writing
 Launch
 Website revisions
What
Needs assessments
 Usability testing
 Focus groups
 Surveys
 Observations
 Polls
 Feedback link
 Can be formal or informal

9
CONSUMER-DRIVEN DESIGN

The goal is to create a site that meets the needs of the
consumers who will be using the site, not just the needs
of the organization







Who are your users?
Why will they visit your site?
What information do they need?
In what format do they need it?
How do your consumers expect your site to work?
How experienced are your consumers with websites?
What accessibility challenges do your consumers have?
10
THE HOMEPAGE
Different and, in some ways, more important than other
pages
 Must quickly and clearly convey the purpose of the site
 Users should always be able to access the homepage
from all pages within a site.1

11
THE HOMEPAGE
Try to limit the amount of text/prose on your homepage
so users can quickly determine what they can do with
the site and where to navigate.2
 This is also more accessible for blind users who rely on
screen readers to read all the text on the screen.

12
THE HOMEPAGE

Use the homepage to create a positive first impression
of your website and build it’s credibility.3
13
PAGE LAYOUT
Don’t use cluttered pages.4
 Use moderate white space.5
 Place important information in a prominent location.6

14
NAVIGATION


All pages should contain navigational options (again, more
accessible for screen readers).7
Long pages should provide a table or list of contents with jump links
that take users to the corresponding content further down the
page.8 Long pages should also include a “skip navigation” link for
screen reader users.
15
NAVIGATION
Ensure that tab labels tell users exactly what function
they serve or their destination (more accessible).9
 Do not rely solely on breadcrumbs for navigation.10

16
LINKS
Link labels should be meaningful and easy to understand
(essential for accessibility).11
 Link names should match their destination pages.12
 Don’t confuse users with links that are not clearly
clickable.13
 Let users know when a link will take them to a
document or an external page (more accessible).14

17
TEXT APPEARANCE
Use plain (e.g., sans-serif) fonts on high-contrast
backgrounds (e.g., black on white).15 This is critically
important for blind, low vision, and aging users.
 Use bold text sparingly.16

18
TEXT APPEARANCE

Do not convey important information with color alone.
Use font, special characters, images with alt-text or
other context in addition to using color (accessibility).17
What NOT to Do
What TO Do
From http://jimthatcher.com/webcourse7.htm
19
CONTENT
Arrange lists and tasks in a logical and efficient order.18
 Make lists and prose easy to scan, using clear, welllocated headings; short phrases and sentences; and
small readable paragraphs.19
 Avoid the use of jargon and acronyms.20

20
MEDIA
Use background images sparingly and make them
simple, especially when used behind text.21
 All clickable images should be labeled with alt-text.22
 All non-text elements, including video, should provide a
text alternative. So, videos should always offer closed
captioning for users with hearing difficulties.23

21
MEDIA

If an image is not essential to understanding the content
(see example) then alt-text is not required.

In this case (buttons), alt-text would be required.
22
FREQUENTLY ASKED QUESTIONS

Include a comprehensive and useful set of Frequently
Asked Questions (FAQs) that apply to each of the main
content sections of the website.24
23
SEARCH FUNCTIONALITY
Include search features that are easy to use and allow
for successful searches using basic search terms.25
 Program search features to return as many relevant
search results as possible.26

24
ADDITIONAL RESOURCES

http://usability.gov

http://section508.gov

http://www.w3.org/WAI/intro/wcag
25
SOURCES
1.
Farkas, D.K. & Farkas, J.B. (2000). Guidelines for designing web navigation. Technical
Communication, 47(3), 341-358.
2.
Bailey, R.W., Koyani, S., & Nall, J. (2000, September 7). Usability testing of several health
information Web sites, National Cancer Institute Technical Report. Bethesda, MD.
3.
Amento, B., Hill, W., Terveen, L., Hix, D., & Ju, P. (1999). An empirical evaluation of user
interfaces for topic management of web sites. Proceedings of CHI’99, 552-559.
4.
Rosenholtz, R., Li, Y., Mansfield, J. & Jin, Z. (2005). Feature congestion: a measure of
display. CHI 2005 Proceedings.
5.
Chaparro, B.S. & Bernard, M.L. (2001). Finding information on the Web: Does the amount
of whitespace really matter? Proceedings of the Tenth Annual Usability Professionals’
Association Conference.
6.
Faraday, P. (2001). Attending to web pages. Proceedings of CHI 2001, 159-160.
7.
Lynch, P.J. & Horton, S. (2002). Web Style Guide (2nd Edition). New Haven, CO: Yale
University Press.
8.
Zimmerman, D.E., Slater, M., & Kendall, P. (2001). Risk communication and a usability case
study: Implications for Web site design. Proceedings of the IEEE International Professional
Communication Conference, 445-452.
26
SOURCES
9.
Badre, A.N. (2002). Shaping Web Usability: Interaction Design in Context. Boston, MA:
Addison Wesley Professional.
10.
Hull, S.S. (2004), Influence of training and exposure on the usage of breadcrumb
navigation, Usability News, 6.1.
11.
Mobrand, K.A. & Spyridakis, J.H. (2002). A web-based study of user performance with
enhanced local navigational cues. Proceedings of the IEEE International Professional
Communication Conference, 500-508.
12.
Ibid.
13.
Tullis, T.S. (2001). Web usability lessons learned. Fidelity Center for Applied Technology
Technical Report. Fidelity Investments.
14.
Nielsen, J. & Tahir, M. (2002). Homepage Usability: 50 Sites Deconstructed. Indianapolis,
IN: New Riders Publishing.
15.
Williams, T.R. (2000). Guidelines for designing and evaluating the display of information
on the Web. Technical Communication, 47(3), 383-396.
16.
Joseph, K.M., Knott, B.A. & Grier, R.A. (2002). The effects of bold text on visual search of
form fields. Proceedings of the Human Factors and Ergonomics Society 46th Annual
Meeting, 583-587.
27
SOURCES
17.
Section 508 Standards outlined in Subpart B, Technical Standards (§ 1194.22 Webbased intranet and internet information and applications).
18.
Ozok, A.A. & Salvendy, G. (2000). Measuring consistency of web page design and its
effects on performance and satisfaction. Ergonomics, 43(4), 443-460.
19.
Nielsen, J. & Tahir, M. (2002). Homepage Usability: 50 Sites Deconstructed.
Indianapolis, IN: New Riders Publishing.
20.
Morrell, R.W., Dailey, S.R., Feldman, C., Mayhorn, C.B., & Echt, K.V. (2002, April).
Older adults and information technology: A compendium of scientific research and
web site accessibility guidelines. National Institute on Aging Report. Bethesda, MD.
21.
Detweiler, M.C. & Omanson, R.C. (1996). Ameritech Web Page User Interface
Standards and Design Guidelines. Ameritech (now SBC).
22.
Williams, T.R. (2000). Guidelines for designing and evaluating the display of
information on the Web. Technical Communication, 47(3), 383-396.
23.
Section 508 Standards outlined in Subpart B, Technical Standards (§ 1194.22 Webbased intranet and internet information and applications).
28
SOURCES
24.
Nielsen, J. (2003, November 10). The ten most violated homepage design
guidelines. Alertbox.
25.
Spool, J., Schroeder, W., & Ojakaar, E. (2001, November). Users don’t learn to search
better. UIEtips.
26.
Rosenfeld, L. & Morville, P. (2002). Information Architecture for the World Wide Web
(second edition). Sebastopol, CA: O’Reilly.
29