SlideShare una empresa de Scribd logo
1 de 21
Web Usability an Accessibility
By:
Sana Ullah(4849)
Salman Saeed khan(4884)
Content
• Web Accessibility
• Disabilities
• Vision impairment
• Hearing impairment
• Mobility impairment
• Cognitive Impairment
• Learning impairment
• Assistive Technologies
• Web Accessibility Standards
Web Usability and Accessibility 2
Web Accessibility
“Accessible” means that people are able to use your
website even under limiting conditions.
To be accessible, your website must be:
• Perceivable (see, hear, touch)
• Operable (device independent)
Making your website accessible is like
providing a wheelchair ramp for your
building.
Web Usability and Accessibility 3
Disabilities
• Vision
• Hearing
• Mobility
• Cognitive
• learning
Web Usability and Accessibility 4
Vision impairment
• Blind low vision, color blindness
• Challenges:
– Inability to view images or videos
– Inability to understand and navigate organization of Web
page
• What can you do to help?
– Provide alt tags for all images
– Provide headers and descriptions for tables
– Provide audio explanations for complicated diagrams and
images
Web Usability and Accessibility 5
Hearing impairment
• Deaf or hard of hearing
• Challenges:
– Listening to audio/video clips
– Difficulty participating in real-time audio chats
• What can you do to help?
– Provide transcripts for audio
– Provide captioning for video
– Provide closed captioning or try access for live chats
Web Usability and Accessibility 6
Mobility impairment
• Difficulty using fingers, hands, or arms
• Challenges:
– Unable to use mouse
– Unable to select small buttons or icons
– Unable to participate in real-time text chat
• What can you do to help?
– Make buttons and links reasonably large
– Provide keyboard alternatives for anything that requires a
mouse
– Provide audio alternatives for text requirements
Web Usability and Accessibility 7
Cognitive Impairment
• Developmental disabilities
• Cognitive disabilities
– Affecting memory
– Attention
– Developmental maturity
– Problem-solving
– Logic skills etc.
Web Usability and Accessibility 8
Learning impairment
• Effects the learning process involving one or more
abilities
– speaking
– Listening
– Reading, writing and spelling
– Reasoning and organizing
• Challenges:
– Getting lost in navigation
– Inability to understand cluttered content or worded clearly
Web Usability and Accessibility 9
How can Disabled people
Navigate the Web?
Assistive Technologies
It is a generic term that includes assistive, adaptive, and
rehabilitative devices for people with disabilities and
includes the process used in selecting, locating, and
using them.
Web Usability and Accessibility 11
Examples of AT
• Screen Readers and magnifiers
• Refreshable Braille display.
• Captioning SW
• Voice Recognition SW
• Touch Screens
• Switches and pointer sticks
Web Usability and Accessibility 12
Web Accessibility Standards
• W3C WCAG – Worldwide Web Consortium Web
Content Accessibility Guidelines
• Federal Section 508 – Web-based Intranet and
Internet Information and Applications (1194.22)
• Commonwealth of Massachusetts Web Accessibility
Standards, version 2.0
Web Usability and Accessibility 13
Web Accessibility Standards 2.0
• HTML markup – A state agency web page must use HTML
markup tags according to industry standards. [1.1]
• Forms – Forms designed to be completed online and other
interactive elements must be accessible by people using
assistive technology. [1.5]
• Text Equivalents – A state agency web page must provide a
text equivalent for every non-text element. [3.1]
• Multimedia – A state agency web page must provide
synchronized auditory and readable text descriptions of the
important information on the visual track of a multimedia
presentation. [3.2]
• Audio – A state agency web page must provide a text
equivalent for information provided in audio format. [3.3]
Web Usability and Accessibility 14
Web Accessibility Standards 2.0(continued)
• Color – A state agency must ensure that the use and selection
of color do not affect the information conveyed on a page.
[3.5]
• Document File Formats – All information published on a state
agency web page must be published in HTML, whenever
possible, to eliminate the need for additional software. [4.1]
• File Size Optimization – A state agency must optimize files to
improve download time. [5.1]
• Web Accessibility Statement – A state agency web site must
provide a link to a web accessibility statement. [6.1]
• Website Validation – A state agency must validate web
content against these Standards prior to posting and at
regular intervals after posting. [7.1]
Web Usability and Accessibility 15
Testing Tools
• Testing tools include:
– SW used by disabled (e.g. JAWS)
– Emulators (e.g. Fangs)
– Compliance checkers
• Remember that tools are not people
Web Usability and Accessibility 16
Design Tips
• Layout and Structure
– Use headings in content consistently
– Use the captions, summaries, and row and column headers for
tables
– Use appropriate metadata
• Navigation
– Use clear, descriptive text for hyperlinks
– Set hyperlinks to open in new window
– Use meaningful text for page titles
• Color
– Avoid using color as only indicator
– Avoid using red
• Text
– Use clear, simple language
Web Usability and Accessibility 17
Design Tips
• Forms and tables
• Images
– Add meaningful alt text to all images
– For complex images, add a description link
– Avoid flickering images and unnecessary animated images
– Avoid using images of text
• Multimedia
– For audio clips, use a description link
– For video clips, use captioning or use a description link
– For video clips, provide a link to an audio file
– Provide a link to download appropriate audio/video player
Web Usability and Accessibility 18
Benefits
Making your website accessible:
• Helps people with disabilities use the web.
• Separates content from presentation, making the
website easier to manage and web pages quicker to
download.
• Increases your site’s usability.
• Increases your websites visibility in search engines.
• Provides good publicity and addresses questions of
possible liability(responsibility).
Web Usability and Accessibility 19
THANKS
Web Usability and Accessibility 20
?
Any Question
Web Usability and Accessibility 21

Más contenido relacionado

Destacado

Ky thuat-truyen-so-lieu
Ky thuat-truyen-so-lieuKy thuat-truyen-so-lieu
Ky thuat-truyen-so-lieuNguyen Vong
 
Chuong 4.1 tin hieu va pho
Chuong 4.1 tin hieu va phoChuong 4.1 tin hieu va pho
Chuong 4.1 tin hieu va phothanhyu
 
Analog and Digital Signals
Analog and Digital SignalsAnalog and Digital Signals
Analog and Digital SignalsSana Ullah
 
Analogue & Digital
Analogue & DigitalAnalogue & Digital
Analogue & Digitalk13086
 
Analog and digital signals
Analog and digital signalsAnalog and digital signals
Analog and digital signalsteja reddy
 

Destacado (6)

Ky thuat-truyen-so-lieu
Ky thuat-truyen-so-lieuKy thuat-truyen-so-lieu
Ky thuat-truyen-so-lieu
 
Truyền số liệu và mạng máy tính
Truyền số liệu và mạng máy tínhTruyền số liệu và mạng máy tính
Truyền số liệu và mạng máy tính
 
Chuong 4.1 tin hieu va pho
Chuong 4.1 tin hieu va phoChuong 4.1 tin hieu va pho
Chuong 4.1 tin hieu va pho
 
Analog and Digital Signals
Analog and Digital SignalsAnalog and Digital Signals
Analog and Digital Signals
 
Analogue & Digital
Analogue & DigitalAnalogue & Digital
Analogue & Digital
 
Analog and digital signals
Analog and digital signalsAnalog and digital signals
Analog and digital signals
 

Similar a Web Accessibility

Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)Carrie Anton
 
Accessibility testing kailash 26_nov_ 2010
Accessibility testing kailash 26_nov_ 2010Accessibility testing kailash 26_nov_ 2010
Accessibility testing kailash 26_nov_ 2010Kailash More
 
Impact of-accessibility-on-technical-writing
Impact of-accessibility-on-technical-writingImpact of-accessibility-on-technical-writing
Impact of-accessibility-on-technical-writingMohammad Qais Mujeeb, PMP
 
Campus Commitment for Equal Access_Techshare India 2014
Campus Commitment for Equal Access_Techshare India 2014Campus Commitment for Equal Access_Techshare India 2014
Campus Commitment for Equal Access_Techshare India 2014BarrierBreak
 
Introduction to Web Accessibility
Introduction to Web AccessibilityIntroduction to Web Accessibility
Introduction to Web AccessibilityMathilde Buenerd
 
Web For All
Web For AllWeb For All
Web For AllISOCHK
 
Web accessibility with Ametys CMS
Web accessibility with Ametys CMSWeb accessibility with Ametys CMS
Web accessibility with Ametys CMSAmetys
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibilitybarbarac
 
Web Accessibility and Design
Web Accessibility and DesignWeb Accessibility and Design
Web Accessibility and Designcolinbdclark
 
Designing and Testing for Digital Accessibility
Designing and Testing for Digital AccessibilityDesigning and Testing for Digital Accessibility
Designing and Testing for Digital AccessibilityUsability Matters
 
Accessibility Overview - 508 and WCAG Compliance
Accessibility Overview - 508 and WCAG ComplianceAccessibility Overview - 508 and WCAG Compliance
Accessibility Overview - 508 and WCAG ComplianceFrank Walsh
 
Make Your Website Accessible to Everyone
Make Your Website Accessible to EveryoneMake Your Website Accessible to Everyone
Make Your Website Accessible to EveryoneAria Williams
 
Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09TechSoup
 
With Accessibility in Mind
With Accessibility in MindWith Accessibility in Mind
With Accessibility in MindAlly Kimmel
 

Similar a Web Accessibility (20)

Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
Web Accessibility Top 10 - LCC (1/2 day workshop, August 2013)
 
Accessibility testing kailash 26_nov_ 2010
Accessibility testing kailash 26_nov_ 2010Accessibility testing kailash 26_nov_ 2010
Accessibility testing kailash 26_nov_ 2010
 
Impact of-accessibility-on-technical-writing
Impact of-accessibility-on-technical-writingImpact of-accessibility-on-technical-writing
Impact of-accessibility-on-technical-writing
 
Campus Commitment for Equal Access_Techshare India 2014
Campus Commitment for Equal Access_Techshare India 2014Campus Commitment for Equal Access_Techshare India 2014
Campus Commitment for Equal Access_Techshare India 2014
 
Improving Your Website's Accessibility
Improving Your Website's AccessibilityImproving Your Website's Accessibility
Improving Your Website's Accessibility
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
Introduction to Web Accessibility
Introduction to Web AccessibilityIntroduction to Web Accessibility
Introduction to Web Accessibility
 
Web For All
Web For AllWeb For All
Web For All
 
Web accessibility with Ametys CMS
Web accessibility with Ametys CMSWeb accessibility with Ametys CMS
Web accessibility with Ametys CMS
 
Web Accessibility
Web AccessibilityWeb Accessibility
Web Accessibility
 
Web Accessibility and Design
Web Accessibility and DesignWeb Accessibility and Design
Web Accessibility and Design
 
Accessible computing
Accessible computingAccessible computing
Accessible computing
 
Speech Enabling Social Networks
Speech Enabling Social NetworksSpeech Enabling Social Networks
Speech Enabling Social Networks
 
Designing and Testing for Digital Accessibility
Designing and Testing for Digital AccessibilityDesigning and Testing for Digital Accessibility
Designing and Testing for Digital Accessibility
 
Accessibility Overview - 508 and WCAG Compliance
Accessibility Overview - 508 and WCAG ComplianceAccessibility Overview - 508 and WCAG Compliance
Accessibility Overview - 508 and WCAG Compliance
 
Make Your Website Accessible to Everyone
Make Your Website Accessible to EveryoneMake Your Website Accessible to Everyone
Make Your Website Accessible to Everyone
 
Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09Webinar - Web Accessibility 101 - 2016-08-09
Webinar - Web Accessibility 101 - 2016-08-09
 
Accessibilitytesting public
Accessibilitytesting publicAccessibilitytesting public
Accessibilitytesting public
 
Designing for Everybody Workshop
Designing for Everybody WorkshopDesigning for Everybody Workshop
Designing for Everybody Workshop
 
With Accessibility in Mind
With Accessibility in MindWith Accessibility in Mind
With Accessibility in Mind
 

Último

Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Educationpboyjonauth
 
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingGrant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingTechSoup
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3JemimahLaneBuaron
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introductionMaksud Ahmed
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13Steve Thomason
 
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxContemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxRoyAbrique
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeThiyagu K
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfUmakantAnnand
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxNirmalaLoungPoorunde1
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxOH TEIK BIN
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAssociation for Project Management
 
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdfssuser54595a
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...EduSkills OECD
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon AUnboundStockton
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxpboyjonauth
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991RKavithamani
 
Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentInMediaRes1
 

Último (20)

Introduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher EducationIntroduction to ArtificiaI Intelligence in Higher Education
Introduction to ArtificiaI Intelligence in Higher Education
 
Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1Código Creativo y Arte de Software | Unidad 1
Código Creativo y Arte de Software | Unidad 1
 
Grant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy ConsultingGrant Readiness 101 TechSoup and Remy Consulting
Grant Readiness 101 TechSoup and Remy Consulting
 
Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3Q4-W6-Restating Informational Text Grade 3
Q4-W6-Restating Informational Text Grade 3
 
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdfTataKelola dan KamSiber Kecerdasan Buatan v022.pdf
TataKelola dan KamSiber Kecerdasan Buatan v022.pdf
 
microwave assisted reaction. General introduction
microwave assisted reaction. General introductionmicrowave assisted reaction. General introduction
microwave assisted reaction. General introduction
 
The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13The Most Excellent Way | 1 Corinthians 13
The Most Excellent Way | 1 Corinthians 13
 
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptxContemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
Contemporary philippine arts from the regions_PPT_Module_12 [Autosaved] (1).pptx
 
Measures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and ModeMeasures of Central Tendency: Mean, Median and Mode
Measures of Central Tendency: Mean, Median and Mode
 
Concept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.CompdfConcept of Vouching. B.Com(Hons) /B.Compdf
Concept of Vouching. B.Com(Hons) /B.Compdf
 
Employee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptxEmployee wellbeing at the workplace.pptx
Employee wellbeing at the workplace.pptx
 
Staff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSDStaff of Color (SOC) Retention Efforts DDSD
Staff of Color (SOC) Retention Efforts DDSD
 
Solving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptxSolving Puzzles Benefits Everyone (English).pptx
Solving Puzzles Benefits Everyone (English).pptx
 
APM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across SectorsAPM Welcome, APM North West Network Conference, Synergies Across Sectors
APM Welcome, APM North West Network Conference, Synergies Across Sectors
 
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
18-04-UA_REPORT_MEDIALITERAСY_INDEX-DM_23-1-final-eng.pdf
 
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
Presentation by Andreas Schleicher Tackling the School Absenteeism Crisis 30 ...
 
Crayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon ACrayon Activity Handout For the Crayon A
Crayon Activity Handout For the Crayon A
 
Introduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptxIntroduction to AI in Higher Education_draft.pptx
Introduction to AI in Higher Education_draft.pptx
 
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
Industrial Policy - 1948, 1956, 1973, 1977, 1980, 1991
 
Alper Gobel In Media Res Media Component
Alper Gobel In Media Res Media ComponentAlper Gobel In Media Res Media Component
Alper Gobel In Media Res Media Component
 

Web Accessibility

  • 1. Web Usability an Accessibility By: Sana Ullah(4849) Salman Saeed khan(4884)
  • 2. Content • Web Accessibility • Disabilities • Vision impairment • Hearing impairment • Mobility impairment • Cognitive Impairment • Learning impairment • Assistive Technologies • Web Accessibility Standards Web Usability and Accessibility 2
  • 3. Web Accessibility “Accessible” means that people are able to use your website even under limiting conditions. To be accessible, your website must be: • Perceivable (see, hear, touch) • Operable (device independent) Making your website accessible is like providing a wheelchair ramp for your building. Web Usability and Accessibility 3
  • 4. Disabilities • Vision • Hearing • Mobility • Cognitive • learning Web Usability and Accessibility 4
  • 5. Vision impairment • Blind low vision, color blindness • Challenges: – Inability to view images or videos – Inability to understand and navigate organization of Web page • What can you do to help? – Provide alt tags for all images – Provide headers and descriptions for tables – Provide audio explanations for complicated diagrams and images Web Usability and Accessibility 5
  • 6. Hearing impairment • Deaf or hard of hearing • Challenges: – Listening to audio/video clips – Difficulty participating in real-time audio chats • What can you do to help? – Provide transcripts for audio – Provide captioning for video – Provide closed captioning or try access for live chats Web Usability and Accessibility 6
  • 7. Mobility impairment • Difficulty using fingers, hands, or arms • Challenges: – Unable to use mouse – Unable to select small buttons or icons – Unable to participate in real-time text chat • What can you do to help? – Make buttons and links reasonably large – Provide keyboard alternatives for anything that requires a mouse – Provide audio alternatives for text requirements Web Usability and Accessibility 7
  • 8. Cognitive Impairment • Developmental disabilities • Cognitive disabilities – Affecting memory – Attention – Developmental maturity – Problem-solving – Logic skills etc. Web Usability and Accessibility 8
  • 9. Learning impairment • Effects the learning process involving one or more abilities – speaking – Listening – Reading, writing and spelling – Reasoning and organizing • Challenges: – Getting lost in navigation – Inability to understand cluttered content or worded clearly Web Usability and Accessibility 9
  • 10. How can Disabled people Navigate the Web?
  • 11. Assistive Technologies It is a generic term that includes assistive, adaptive, and rehabilitative devices for people with disabilities and includes the process used in selecting, locating, and using them. Web Usability and Accessibility 11
  • 12. Examples of AT • Screen Readers and magnifiers • Refreshable Braille display. • Captioning SW • Voice Recognition SW • Touch Screens • Switches and pointer sticks Web Usability and Accessibility 12
  • 13. Web Accessibility Standards • W3C WCAG – Worldwide Web Consortium Web Content Accessibility Guidelines • Federal Section 508 – Web-based Intranet and Internet Information and Applications (1194.22) • Commonwealth of Massachusetts Web Accessibility Standards, version 2.0 Web Usability and Accessibility 13
  • 14. Web Accessibility Standards 2.0 • HTML markup – A state agency web page must use HTML markup tags according to industry standards. [1.1] • Forms – Forms designed to be completed online and other interactive elements must be accessible by people using assistive technology. [1.5] • Text Equivalents – A state agency web page must provide a text equivalent for every non-text element. [3.1] • Multimedia – A state agency web page must provide synchronized auditory and readable text descriptions of the important information on the visual track of a multimedia presentation. [3.2] • Audio – A state agency web page must provide a text equivalent for information provided in audio format. [3.3] Web Usability and Accessibility 14
  • 15. Web Accessibility Standards 2.0(continued) • Color – A state agency must ensure that the use and selection of color do not affect the information conveyed on a page. [3.5] • Document File Formats – All information published on a state agency web page must be published in HTML, whenever possible, to eliminate the need for additional software. [4.1] • File Size Optimization – A state agency must optimize files to improve download time. [5.1] • Web Accessibility Statement – A state agency web site must provide a link to a web accessibility statement. [6.1] • Website Validation – A state agency must validate web content against these Standards prior to posting and at regular intervals after posting. [7.1] Web Usability and Accessibility 15
  • 16. Testing Tools • Testing tools include: – SW used by disabled (e.g. JAWS) – Emulators (e.g. Fangs) – Compliance checkers • Remember that tools are not people Web Usability and Accessibility 16
  • 17. Design Tips • Layout and Structure – Use headings in content consistently – Use the captions, summaries, and row and column headers for tables – Use appropriate metadata • Navigation – Use clear, descriptive text for hyperlinks – Set hyperlinks to open in new window – Use meaningful text for page titles • Color – Avoid using color as only indicator – Avoid using red • Text – Use clear, simple language Web Usability and Accessibility 17
  • 18. Design Tips • Forms and tables • Images – Add meaningful alt text to all images – For complex images, add a description link – Avoid flickering images and unnecessary animated images – Avoid using images of text • Multimedia – For audio clips, use a description link – For video clips, use captioning or use a description link – For video clips, provide a link to an audio file – Provide a link to download appropriate audio/video player Web Usability and Accessibility 18
  • 19. Benefits Making your website accessible: • Helps people with disabilities use the web. • Separates content from presentation, making the website easier to manage and web pages quicker to download. • Increases your site’s usability. • Increases your websites visibility in search engines. • Provides good publicity and addresses questions of possible liability(responsibility). Web Usability and Accessibility 19
  • 20. THANKS Web Usability and Accessibility 20
  • 21. ? Any Question Web Usability and Accessibility 21

Notas del editor

  1. Cognitive  being conscious intellectual activity (as thinking, reasoning, remembering, imagining, or learning words)