Transcript Summer Faculty Institute - Northern Kentucky University

NKU Professional & Organizational Development Center
Sean Ringey
Web Educational Development Coordinator
—Tim Berners-Lee, inventor of the World Wide Web
Usability
user friendly
Accessibility
barrier free

Usability measures the quality of a user’s
experience

People who use the web site can do so quickly
and easily to accomplish their tasks

Ease of learning

Efficiency of use

Memorability

Error frequency and severity

Subjective satisfaction
“There's no such thing as a training class
or a manual for a Web site. People have
to be able to grasp the functioning of
the site immediately after scanning the
home page—for a few seconds at most.”







Proximity (pg. 1)
Alignment (pg. 1-2)
Consistent navigation position and format
(pg. 3)
Use appropriate text for links (pg. 3)
Style links with CSS (pg. 4)
Text links (pg. 4)
Logos should link to home page (pg. 5)


Plan ahead to create a usable site
More information:
 Usability.gov
 www.great-web-design-tips.com
 POD Home >> Resources >> Web Development

Web accessibility means that people with
disabilities can use the Web.

Currently most Web sites have accessibility
barriers that make it difficult or impossible for
many people with disabilities to use the Web.

A web site is accessible when any potential
user, using any browsing technology, is able
to get a full comprehension of all the
information and fully interact with the site.
User Agent: Device/software
that can access web content
User:
Individual
that uses a
user agent

Blindness (complete loss of sight)

Legally blind (not completely sightless)

Weak vision, dimness, tunnel vision, extreme
near- or far sightedness

Color blindness

Deaf (complete loss of hearing)

Hard of hearing

High/low frequency hearing loss

Repetitive Stress Injuries (Carpal tunnel)

Arthritis

Stroke

ALS (Lou Gehrig’s Disease)

Spinal Cord Injuries

Loss of limbs or digits




Older computers or browsers
Slow connection speeds
Mobile web technologies
Personal preferences


Section 508
Web Content Accessibility Guidelines (WCAG)

Priority 1 - addresses barriers that make
access impossible for one or more groups of
users.

Priority 2 and Priority 3 checkpoints address
barriers that make access difficult and
somewhat difficult, respectively.

Pages 5-8 in your handout

WCAG 1.0 represents a higher standard than
Section 508

Tier One: Top-level web sites that serve the
general campus population (WCAG)

Tier Two: All other web sites for official NKU
departments, offices, groups, organizations,
student organization, as well as distance
learning and web-based course content (508)

Tier Three: Personal web sites (strive for 508)

An image is referenced in HTML with an <img> tag and a src attribute.
Example: <img src=“images/logo.gif”>

In order to add alternative text for images, use the alt attribute within
the <img> tag.
Example: <img src=“images/logo.gif” alt=“NKU Logo and Link to NKU
Home Page”>

Keeping screen readers in mind, text links will be read as they appear and
not as the location that the text links to.
Bad Example:
<a href=“http://www.nku.edu”>Click Here</a>
The above example will show the text, Click Here, on the web page. This
text when clicked will link to NKU’s home page. The problem with this
example is that when the page is read to a person using a screen reader,
the words “Click” and “Here” are read with no further description of what
the text is actually linking to.
Good Example:
<a href=“http://www.nku.edu”>Link to Northern Kentucky University</a>
By using meaningful text, the links will not only make sense to those
without a visual impairment, it will make sense to those using a screen
reader.

Initially tables were meant to hold tabular data. They were never
intended to be used for the layout of a web page.

As the popularity of the web increased, so did the interest to represent
web pages using creative layouts.

Designers found that by using tables in HTML, they were able to recreate
complicated layouts

Are tables still used today?
Yes

Is it OK to use tables as a way to layout a web page?
Yes and/or No (Depending on who you talk to)

In the opinion of some web designers, it is fine to use tables to layout a web
page if it is readable when linearized. In other words, when the table is read from
left to right, top to bottom, does it make sense and follow an order.
Example: Consider a 3 x 3 table
1
2
3
4
5
6
7
8
9
Cell
Item to hold
1,3,6,7,9
Empty cells used as spacers
2
NKU Logo
4
Navigation Links
5
Main body content
8
Links, Copyright information
A screen reader will start at cell 1, read the content in it, then
continue to the next cell going from left to right, top to bottom.
This layout is fine since the logo is read (If it has an alt tag), then
the links, then the body, then copyright info and links.
What would happen if the main body content was placed in cell 9 for
visual reasons?
If the main content was placed in cell 9, the screen reader would have to
visit each and every cell before finally arriving to the main content in the
last cell.
This example is a small example, but imagine on a larger scale having to
wait until the screen reader reaches the last cell just to get the main news
story.
Important: Left to right, top to bottom.
Make sure the layout reads nice and is efficient!