SlideShare a Scribd company logo
1 of 17
Evaluating the accessibility of
  Rich Internet Applications
      Nádia Fernandes, Daniel
     Costa, Sérgio Neves, Carlos
        Duarte, Luís Carriço


         W4A 2012 – Accessible Web 2.0
Motivation
• The Internet has become an indispensable
  tool for our everyday life

• And it is used by all kind of people
  – With different physical and/or mental capabilities




     2          W4A 2012 – Accessible Web 2.0
Problems
• The content of Web pages must become
  accessible to all users

• Developers need a way to help them
  implement an accessible page

• Tools should be provided to enable evaluation
  of the accessibility

     3        W4A 2012 – Accessible Web 2.0
Solution
• The Web Content Accessibility Guidelines
  (WCAG)
  – A set of best practices for developing an accessible
    Web page

• Automated accessibility evaluators
  – QualWeb (Nádia et al)
  – Achecker
  – And more…

     4          W4A 2012 – Accessible Web 2.0
New Challenges
• Web pages are no longer static content displayers

• With the Web development, Rich Internet
  Applications are becoming a trend

• New elements are introduced on the Dom tree
  triggered by javascript functions



     5          W4A 2012 – Accessible Web 2.0
New approach
• QualWeb 3.0
  – New WCAG techniques evaluated (including CSS
    techniques)

  – Added a new module that triggers and observes
    changes made on the Dom tree




    6           W4A 2012 – Accessible Web 2.0
Architecture




7   W4A 2012 – Accessible Web 2.0
Interaction Simulator
• This component is responsible for activating
  interactive elements in the HTML document
   – For each interactive element it is attached a
     function (Crawler) that triggers this element
     periodically

   – At the same time there is an Observer which
     analyses the Dom tree to see if it has changed

   – A change in the Dom tree is considered a new state
     of the RIA




   8            W4A 2012 – Accessible Web 2.0
QualWeb evaluator
• The evaluator receives the new state and
  performs the evaluation

• 20 HTML WCAG 2.0 and 6 CSS WCAG 2.0

• Then generates an EARL report



     9        W4A 2012 – Accessible Web 2.0
Experimental study
• 5o inspiring Web applications
  – http://speckyboy.com/2009/09/02/50-inspiring-
    web-application-and-service-web-site-designs/




    10         W4A 2012 – Accessible Web 2.0
Goal
• The goal of this experiment is to validate this
  new approach

• Understand if it is possible to automatically
  trigger changes on the Web page

• Understand if those changes affect the
  accessibility of the page

     11         W4A 2012 – Accessible Web 2.0
Results




12   W4A 2012 – Accessible Web 2.0
Results
• There was an average of 5 different states per
  page
  – The number of fails and warnings increased 4% and
    10% in comparison with the original state

• In this experiment the average of pass results is
  28% , fail results represent an average of 12% and
  60% for warnings.

• 43% of the Warning results come from the CSS
  evaluation

     13         W4A 2012 – Accessible Web 2.0
Advantages
• The main advantages are:
  – The evaluation is made on browser environment
     • VS “Offline” evaluation


  – Evaluates WCAG 2.0 techniques (HTML and CSS)
     • VS WCAG 1.0


  – Can evaluate parts of the Web page that were
    otherwise unreachable

    14            W4A 2012 – Accessible Web 2.0
Conclusions
• The results obtained show that it is possible to
  evaluate automatically states that can be
  triggered without human intervention

• We demonstrated that there are differences when
  evaluating different states of the Web page

• We have developed a more complete evaluation
  of Web pages




     15           W4A 2012 – Accessible Web 2.0
Future Work
• Implement more WCAG 2.0 techniques

• Perform more tests

• Remove some limitations we had




    16        W4A 2012 – Accessible Web 2.0
Questions?
• Daniel Costa – dancosta@di.fc.ul.pt
• Nádia Fernandes – nadiaf@di.fc.ul.pt




    17        W4A 2012 – Accessible Web 2.0

More Related Content

Similar to Evaluating the accessibility of rich internet applications

Inter Lab 2006 Open Process Web Design Through W I K I
Inter Lab 2006    Open Process Web Design Through  W I K IInter Lab 2006    Open Process Web Design Through  W I K I
Inter Lab 2006 Open Process Web Design Through W I K I
guestd43c7f
 

Similar to Evaluating the accessibility of rich internet applications (20)

WCAG
WCAGWCAG
WCAG
 
adasitecompliance.com
adasitecompliance.comadasitecompliance.com
adasitecompliance.com
 
IWMW 2003: Content Management - Buy or Build?
IWMW 2003: Content Management - Buy or Build?IWMW 2003: Content Management - Buy or Build?
IWMW 2003: Content Management - Buy or Build?
 
Migrating to Drupal: Open Source Library Intranets
Migrating to Drupal: Open Source Library IntranetsMigrating to Drupal: Open Source Library Intranets
Migrating to Drupal: Open Source Library Intranets
 
All change for WCAG 2.0 - what you need to know about the new accessibility g...
All change for WCAG 2.0 - what you need to know about the new accessibility g...All change for WCAG 2.0 - what you need to know about the new accessibility g...
All change for WCAG 2.0 - what you need to know about the new accessibility g...
 
Inter Lab 2006 Open Process Web Design Through W I K I
Inter Lab 2006    Open Process Web Design Through  W I K IInter Lab 2006    Open Process Web Design Through  W I K I
Inter Lab 2006 Open Process Web Design Through W I K I
 
Web Content Accessibility Guidelines
Web Content Accessibility GuidelinesWeb Content Accessibility Guidelines
Web Content Accessibility Guidelines
 
Introduction to the web engineering Process.pdf
Introduction to the web engineering Process.pdfIntroduction to the web engineering Process.pdf
Introduction to the web engineering Process.pdf
 
A quantitative analysis of wcag 2.0 compliance for some indian web portals
A quantitative analysis of wcag 2.0 compliance for some indian web portalsA quantitative analysis of wcag 2.0 compliance for some indian web portals
A quantitative analysis of wcag 2.0 compliance for some indian web portals
 
My talk at Riga 2016 Web Accessibility Meetup
My talk at Riga 2016 Web Accessibility MeetupMy talk at Riga 2016 Web Accessibility Meetup
My talk at Riga 2016 Web Accessibility Meetup
 
UNC CAUSE 2010: Drupal BOF Presentation
UNC CAUSE 2010: Drupal BOF PresentationUNC CAUSE 2010: Drupal BOF Presentation
UNC CAUSE 2010: Drupal BOF Presentation
 
The Delight and Difficulties of Universal Java Script with React
The Delight and Difficulties of Universal Java Script with ReactThe Delight and Difficulties of Universal Java Script with React
The Delight and Difficulties of Universal Java Script with React
 
A MDD approach for modelling web accessibility
A MDD approach for modelling web accessibilityA MDD approach for modelling web accessibility
A MDD approach for modelling web accessibility
 
Migrating from Instantis 8.0 to EnterpriseTrack 8.7 - A Customer Story
Migrating from Instantis 8.0 to EnterpriseTrack 8.7 - A Customer StoryMigrating from Instantis 8.0 to EnterpriseTrack 8.7 - A Customer Story
Migrating from Instantis 8.0 to EnterpriseTrack 8.7 - A Customer Story
 
Crm for school education publishing and management system
Crm for school education publishing and management systemCrm for school education publishing and management system
Crm for school education publishing and management system
 
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web contentATAGTR2017 SPEAKING EYE for differently abled people to see the web content
ATAGTR2017 SPEAKING EYE for differently abled people to see the web content
 
W3C WAI update at OZeWAI conference 2013
W3C WAI update at OZeWAI conference 2013W3C WAI update at OZeWAI conference 2013
W3C WAI update at OZeWAI conference 2013
 
What’s Next with Accessibility?
What’s Next with Accessibility?What’s Next with Accessibility?
What’s Next with Accessibility?
 
Webinar
WebinarWebinar
Webinar
 
WAI activity update presented at Canberra accessibility meetup 2014.02
WAI activity update presented at Canberra accessibility meetup 2014.02WAI activity update presented at Canberra accessibility meetup 2014.02
WAI activity update presented at Canberra accessibility meetup 2014.02
 

Recently uploaded

Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
instagramfab782445
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
mark11275
 
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Nitya salvi
 
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
eeanqy
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
eqaqen
 
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
nirzagarg
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
yhavx
 
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
gajnagarg
 
ab-initio-training basics and architecture
ab-initio-training basics and architectureab-initio-training basics and architecture
ab-initio-training basics and architecture
saipriyacoool
 
poliovirus-190801072449. pptx
poliovirus-190801072449.            pptxpoliovirus-190801072449.            pptx
poliovirus-190801072449. pptx
ssuser0ad194
 

Recently uploaded (20)

Independent Escorts Goregaon WhatsApp +91-9930687706, Best Service
Independent Escorts Goregaon WhatsApp +91-9930687706, Best ServiceIndependent Escorts Goregaon WhatsApp +91-9930687706, Best Service
Independent Escorts Goregaon WhatsApp +91-9930687706, Best Service
 
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdfJordan_Amanda_DMBS202404_PB1_2024-04.pdf
Jordan_Amanda_DMBS202404_PB1_2024-04.pdf
 
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
Abortion pill for sale in Muscat (+918761049707)) Get Cytotec Cash on deliver...
 
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for FriendshipRaebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
Raebareli Girl Whatsapp Number 📞 8617370543 | Girls Number for Friendship
 
How to Build a Simple Shopify Website
How to Build a Simple Shopify WebsiteHow to Build a Simple Shopify Website
How to Build a Simple Shopify Website
 
How to Create a Productive Workspace Trends and Tips.pdf
How to Create a Productive Workspace Trends and Tips.pdfHow to Create a Productive Workspace Trends and Tips.pdf
How to Create a Productive Workspace Trends and Tips.pdf
 
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
Call Girls In Ratnagiri Escorts ☎️8617370543 🔝 💃 Enjoy 24/7 Escort Service En...
 
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
怎样办理伦敦国王学院毕业证(KCL毕业证书)成绩单留信认证
 
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
一比一定(购)西悉尼大学毕业证(WSU毕业证)成绩单学位证
 
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
NO1 Top Pakistani Amil Baba Real Amil baba In Pakistan Najoomi Baba in Pakist...
 
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
Top profile Call Girls In Mau [ 7014168258 ] Call Me For Genuine Models We ar...
 
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
一比一原版(ANU毕业证书)澳大利亚国立大学毕业证原件一模一样
 
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
Top profile Call Girls In Meerut [ 7014168258 ] Call Me For Genuine Models We...
 
ab-initio-training basics and architecture
ab-initio-training basics and architectureab-initio-training basics and architecture
ab-initio-training basics and architecture
 
Eye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docxEye-Catching Web Design Crafting User Interfaces .docx
Eye-Catching Web Design Crafting User Interfaces .docx
 
Furniture & Joinery Details_Designs.pptx
Furniture & Joinery Details_Designs.pptxFurniture & Joinery Details_Designs.pptx
Furniture & Joinery Details_Designs.pptx
 
Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...
Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...
Just Call Vip call girls Fatehpur Escorts ☎️8617370543 Two shot with one girl...
 
The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024The hottest UI and UX Design Trends 2024
The hottest UI and UX Design Trends 2024
 
poliovirus-190801072449. pptx
poliovirus-190801072449.            pptxpoliovirus-190801072449.            pptx
poliovirus-190801072449. pptx
 
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
UI:UX Design and Empowerment Strategies for Underprivileged Transgender Indiv...
 

Evaluating the accessibility of rich internet applications

  • 1. Evaluating the accessibility of Rich Internet Applications Nádia Fernandes, Daniel Costa, Sérgio Neves, Carlos Duarte, Luís Carriço W4A 2012 – Accessible Web 2.0
  • 2. Motivation • The Internet has become an indispensable tool for our everyday life • And it is used by all kind of people – With different physical and/or mental capabilities 2 W4A 2012 – Accessible Web 2.0
  • 3. Problems • The content of Web pages must become accessible to all users • Developers need a way to help them implement an accessible page • Tools should be provided to enable evaluation of the accessibility 3 W4A 2012 – Accessible Web 2.0
  • 4. Solution • The Web Content Accessibility Guidelines (WCAG) – A set of best practices for developing an accessible Web page • Automated accessibility evaluators – QualWeb (Nádia et al) – Achecker – And more… 4 W4A 2012 – Accessible Web 2.0
  • 5. New Challenges • Web pages are no longer static content displayers • With the Web development, Rich Internet Applications are becoming a trend • New elements are introduced on the Dom tree triggered by javascript functions 5 W4A 2012 – Accessible Web 2.0
  • 6. New approach • QualWeb 3.0 – New WCAG techniques evaluated (including CSS techniques) – Added a new module that triggers and observes changes made on the Dom tree 6 W4A 2012 – Accessible Web 2.0
  • 7. Architecture 7 W4A 2012 – Accessible Web 2.0
  • 8. Interaction Simulator • This component is responsible for activating interactive elements in the HTML document – For each interactive element it is attached a function (Crawler) that triggers this element periodically – At the same time there is an Observer which analyses the Dom tree to see if it has changed – A change in the Dom tree is considered a new state of the RIA 8 W4A 2012 – Accessible Web 2.0
  • 9. QualWeb evaluator • The evaluator receives the new state and performs the evaluation • 20 HTML WCAG 2.0 and 6 CSS WCAG 2.0 • Then generates an EARL report 9 W4A 2012 – Accessible Web 2.0
  • 10. Experimental study • 5o inspiring Web applications – http://speckyboy.com/2009/09/02/50-inspiring- web-application-and-service-web-site-designs/ 10 W4A 2012 – Accessible Web 2.0
  • 11. Goal • The goal of this experiment is to validate this new approach • Understand if it is possible to automatically trigger changes on the Web page • Understand if those changes affect the accessibility of the page 11 W4A 2012 – Accessible Web 2.0
  • 12. Results 12 W4A 2012 – Accessible Web 2.0
  • 13. Results • There was an average of 5 different states per page – The number of fails and warnings increased 4% and 10% in comparison with the original state • In this experiment the average of pass results is 28% , fail results represent an average of 12% and 60% for warnings. • 43% of the Warning results come from the CSS evaluation 13 W4A 2012 – Accessible Web 2.0
  • 14. Advantages • The main advantages are: – The evaluation is made on browser environment • VS “Offline” evaluation – Evaluates WCAG 2.0 techniques (HTML and CSS) • VS WCAG 1.0 – Can evaluate parts of the Web page that were otherwise unreachable 14 W4A 2012 – Accessible Web 2.0
  • 15. Conclusions • The results obtained show that it is possible to evaluate automatically states that can be triggered without human intervention • We demonstrated that there are differences when evaluating different states of the Web page • We have developed a more complete evaluation of Web pages 15 W4A 2012 – Accessible Web 2.0
  • 16. Future Work • Implement more WCAG 2.0 techniques • Perform more tests • Remove some limitations we had 16 W4A 2012 – Accessible Web 2.0
  • 17. Questions? • Daniel Costa – dancosta@di.fc.ul.pt • Nádia Fernandes – nadiaf@di.fc.ul.pt 17 W4A 2012 – Accessible Web 2.0