Animation Animated GIF Animated GIF Javascript Javascript Java Java Vector animation: Flash, SVG Vector animation: Flash, SVG Shockwave Shockwave 3D 3D

Raster vs Vector Vector: items drawn with lines Vector: items drawn with lines Smooth Smooth Scaled very well Scaled very well Cannot be filled with multiple colors Cannot be filled with multiple colors Raster: pixel based Raster: pixel based 3D shading 3D shading

Raster vs. Vector Raster

Raster vs. Vector Vector

Informing the User Provide information to user Provide information to user Inform of potential load/play times Inform of potential load/play times Required plugins Required plugins

Multimedia Information

3D for the Web Use of 3D very limited (still) Use of 3D very limited (still) Commonly used for product views Commonly used for product views Very computational intensive Very computational intensive VRML VRML Shockwave Shockwave

Web 3D Formats

Controls

3D and Performance 3D files require: Large amounts of memory Large amounts of memory Large amounts of bandwidth Large amounts of bandwidth

Level of Detail

Successive Refinement

Mpeg-4 Future standard: Future standard:Combines: Audio Audio Video Video Vector Graphics Vector Graphics 3D Graphics 3D Graphics

MPEG-4

Human Representation Means to represent virtual humans Means to represent virtual humans Called avatars Called avatars Used to interact with user Used to interact with user Typically used in online games representing: Other users Other users Non-player charactures Non-player charactures

HANIM

Poser

Accessibility Web should be usable by everyone Web should be usable by everyone This includes users with: Vision impairments Vision impairments Hearing impairments Hearing impairments Mobility impairments Mobility impairments

Statistics 8 million people with visual impairments 8 million people with visual impairments 20 million deaf or hard-of hearing 20 million deaf or hard-of hearing 250,000 with spinal cord injuries 250,000 with spinal cord injuries 500,000 with cerebral palsy 500,000 with cerebral palsy 330,000 with MS 330,000 with MS More that half US population over 65 has some type of impairment More that half US population over 65 has some type of impairment

Issues involving Vision Web very visually oriented Web very visually oriented Significant challenges Significant challenges Severity ranges from total blindness to low vision Severity ranges from total blindness to low vision Color blindness Color blindness Visual Stimuli Visual Stimuli

Information Delivery Information display on traditional monitor not available to users with visual impairments Information display on traditional monitor not available to users with visual impairments Two assistive technologies: Screen Readers Screen Readers Refreshable Braille displays Refreshable Braille displays

Screen readers Reads text component of web screen Includes: Links Links Menus Menus Dialog Boxes Dialog Boxes Error Messages Error Messages

Screen Readers Several vendors offer screen readers Several vendors offer screen readers Prices range from $300 to $1000 Prices range from $300 to $1000 Page must be reformatted to support screen readers Page must be reformatted to support screen readers HTML “lang” attribute controls language page will be read in HTML “lang” attribute controls language page will be read in

Refreshable Braille Display For people who are deaf as well as blind screen readers do not work. For people who are deaf as well as blind screen readers do not work. Translates text of page into Braille Translates text of page into Braille Single line of Braille text Single line of Braille text Prices range from $4500 to $14,500 Prices range from $4500 to $14,500

Grade II Braille

Refreshable Braille Display

Reformatting Text For screen readers to work text of page must be formatted to support linear delivery For screen readers to work text of page must be formatted to support linear delivery Tabular data Tabular data Label for Elements Label for Elements Skip navigation Skip navigation Alt Tags for images Alt Tags for images

Tabular Data

Markup Strategy for Tables Course Time Day Prerequisiste Instructor :30 pm -1:00 pm MW None McDonald :30am - 12:00 pm TR None Luecking 212 5:45 pm - 9:00 pm M 211 Carter :30 pm - 1:00pm TR 211 Chan

Label Elements of Forms Billing Information First name (required): Last name(required):

Skip Navigation

Normal Page

Alt Tags (None)

Alt Tags (Descriptive)

Other Vision Issues Screen Magnifiers Screen Magnifiers Color Blindness: Color Blindness: –8% male population –0.5% Female population –Most common red/green Photo Sensitive Epilepsy Photo Sensitive Epilepsy

Color Blindness This is an Ishihara plate commonly used to check for red/green color blindness

Color Blindness This is what a red/green color-blind person might see. Note that the digit (3) is practically invisible.

Mobility Impairments Conditions with affect use of keyboard and mouse Conditions with affect use of keyboard and mouse Might be difficult, Might be impossible Might be difficult, Might be impossible Predictive typing Predictive typing Speech recognition Speech recognition Alternative input technology Alternative input technology

Hearing Impairments Few more issues: Captioned media Captioned media Open or Closed captioning Open or Closed captioning American Sign Language American Sign Language

Web Accessibility Initiative Promote usability for people with disabilities Promote usability for people with disabilities Goal of Universal Access Goal of Universal Access Set of guidelines which address 2 themes: Set of guidelines which address 2 themes: –Graceful Translation –Make content understandable and navigable

Web Accessibility Initiative Guidelines

Globalization Web is growing all over world Web is growing all over world Number of Non English speaking users rapidly increasing Number of Non English speaking users rapidly increasing Usability issues involve use of language and culture Usability issues involve use of language and culture This processes is called globalization This processes is called globalization

Global User Population

Internationalization Internationalization single design used world wide Internationalization single design used world wide Simpler text Simpler text Unambiguous display of number, currency, dates, and times Unambiguous display of number, currency, dates, and times Isolate and remove culturally specific language Isolate and remove culturally specific language

Localization Added cultural context Added cultural context Translation of web page into local language Translation of web page into local language Relevant content Relevant content

Text and Translation Translation: human or automatic? Translation: human or automatic? Attention to writing style Attention to writing style Expression of dates, times Expression of dates, times Express currency in local terms Express currency in local terms Label units of measurements Label units of measurements

Languages Can Expand Labels

Page Layout Unicode for character support Unicode for character support Color issues Color issues Icon issues (including flags) Icon issues (including flags) Text Alignment (left vs. right) Text Alignment (left vs. right)

International User Testing International and local sites need user testing International and local sites need user testing More involved than traditional More involved than traditional Test success of translation Test success of translation International Inspection as alternative International Inspection as alternative Difficulties dues to language gap Difficulties dues to language gap

Personalization Strategy for gaining competitive advantage Strategy for gaining competitive advantage Added service for a user Added service for a user Speeds task completion (I-Click) Speeds task completion (I-Click) Can require login Can require login Cookies Cookies Dynamic Dynamic

Privacy Concerns No right to privacy in US No right to privacy in US Privacy Contracts Privacy Contracts Request of personal information can cause users to leave site Request of personal information can cause users to leave site Highly related to trust Highly related to trust

Trust Many factors affect trust: Context Context Perceived Similarity Perceived Similarity Standing in organization Standing in organization Behavior Behavior Certification Certification References References

Fostering Trust Help establish credibility Help establish credibility Security Statement Security Statement Safe display of personal information Safe display of personal information Use of secure servers Use of secure servers Confirmation of all costs Confirmation of all costs Confirmation of shipping address Confirmation of shipping address

Controlling Privacy No standard for enforcing privacy in place No standard for enforcing privacy in place P3P standard developed P3P standard developed Enforces and exposes site’s privacy policy Enforces and exposes site’s privacy policy Tools to inform users of compliance with their selected privacy policy Tools to inform users of compliance with their selected privacy policy

Trust (P3P)

Privacy Bird

Shows Embedded Content

Privacy Bird