SlideShare a Scribd company logo
1 of 56
Download to read offline
Farfalla Project
a step toward an inclusive web
Test
o
Andrea Mangiatordi, University of Milano Bicocca, Italy
Riccardo Dondi, University of Bergamo, Italy
DSAI 2010 - SAE Institute, Oxford - 25th-26th November, 2010
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Assistive Technology is
traditionally a means of
Integration
Inclusive?
Traditionally
Web Accessibility works like this...
Traditionally
Web Accessibility works like this...
Traditionally
Web Accessibility works like this...
Traditionally
Web Accessibility works like this...
Traditionally
Web Accessibility works like this...
Traditionally
Web Accessibility works like this...
STANDARD
STANDARD
A respectful environment,
designed for all, fosters
Inclusion
STANDARD
A respectful environment,
designed for all, fosters
Inclusion
Beware!
The simple compliance with
standards does not
guarantee accessibility!
HTML is a tree
Photo: Autumn Trees of Tenterfield, by Matthew Stewart
Web sites are forests
Concept by T.V. Raman
The problem?
Websites developers?
Websites users?
Content Management Systems
users?
The problem?
Websites developers?
Websites users?
Content Management Systems
users?
Whatever, it is a matter of
Knowledge
An example?
People need to know that images need
alternative text...
Iphiclides podalirius, astriped butterfly ona background offlowers...
An example?
People need to know that images need
alternative text...
as they need to know many other things
in order to make a website really
accessible.
as they need to know many other things
in order to make a website really
accessible.
Try applying the
WAI-ARIA literally...
The idea
The idea
frameworkto create a
for deploying
AT solutions
The idea
frameworkto create a
and...
The idea
frameworkto create a
for enhancing
accessibility
Automatically.
(Almost.)
How?
Architecture and technologies
Architecture and technologies
jQuery
PHP
(cakephp)
Architecture and technologies
jQuery
PHP
(cakephp)
Architecture and technologies
jQuery
MySQL
PHP
(cakephp)
Architecture and technologies
jQuery
MySQL
JSON
! creation of new UI elements
! direct CSS improvements
! DOM tree manipulation
jQuery
PHP
(cakephp)
! profiles management
! configuration of personal
preferences
MySQL
! storage of:
! personal preferences
! useful resources (dictionaries,
wiki-like data...)
How does it work?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/
TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it-it" lang="it-it" >
<head>
<title>Any content!</title>
<script type="text/javascript" src="http://code.farfalla-project.org/farfalla.js" />
</head>
<body>
<h1>Any content!</h1>
<p> Really! </p>
</body>
</html>
by including a script
in any HTML header
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/
TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="it-it" lang="it-it" >
<head>
<title>Any content!</title>
<script type="text/javascript" src="http://code.farfalla-project.org/farfalla.js" />
</head>
<body>
<h1>Any content!</h1>
<p> Really! </p>
</body>
</html>
by including a script
in any HTML header
once the script is there...
once the script is there...
Imagine a visually
impaired user...
once the script is there...
Imagine a visually
impaired user...
once the script is there...
Imagine a visually
impaired user...
Activated via...
Activated via...
bookmarklet
Activated via...
bookmarklet
browser plugin
or...
direct insertion
This will be the preferred option, and
others can be thought of...
What works right now
http://farfalla-project.org/live-demo/
What works right now
http://farfalla-project.org/live-demo/
virtual keyboard
What works right now
http://farfalla-project.org/live-demo/
virtual keyboard
selective magnification
What works right now
http://farfalla-project.org/live-demo/
virtual keyboard
selective magnification
visual enhancements
Research ahead - phase 1
! grounded theory approach:
! longitudinal tests in
quasi-experimental settings
! combined use of distinct
accessibility tests
Research ahead - phase 2
! qualitative study of the social
effects:
! semi-structured inteviews with
users
! sociometric analysis
Thank you!
Do you want to join?
It is free and open source!
• http://farfalla-project.org
• info@farfalla-project.org
• a.mangiatordi@campus.unimib.it

More Related Content

Similar to Farfalla: a step towards an Inclusive Web

Integrating universal design, best practices, & accessibility atia 2013
Integrating universal design, best practices, & accessibility   atia 2013Integrating universal design, best practices, & accessibility   atia 2013
Integrating universal design, best practices, & accessibility atia 2013
Howard Kramer
 
A web standards & ud approach for access (bps public)
A web standards & ud approach for access (bps   public)A web standards & ud approach for access (bps   public)
A web standards & ud approach for access (bps public)
Howard Kramer
 
jQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPagesjQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPages
Mark Roden
 
Introduction to Semantic Web for GIS Practitioners
Introduction to Semantic Web for GIS PractitionersIntroduction to Semantic Web for GIS Practitioners
Introduction to Semantic Web for GIS Practitioners
Emanuele Della Valle
 

Similar to Farfalla: a step towards an Inclusive Web (20)

Busy Architects Guide to Modern Web Architecture in 2014
Busy Architects Guide to  Modern Web Architecture in 2014Busy Architects Guide to  Modern Web Architecture in 2014
Busy Architects Guide to Modern Web Architecture in 2014
 
Interoperability Requirements for a Sustainable Component to Support Manageme...
Interoperability Requirements for a Sustainable Component to Support Manageme...Interoperability Requirements for a Sustainable Component to Support Manageme...
Interoperability Requirements for a Sustainable Component to Support Manageme...
 
Atlanta Drupal Users Group - October 2015 - Success of the GT Redesign
Atlanta Drupal Users Group - October 2015 - Success of the GT RedesignAtlanta Drupal Users Group - October 2015 - Success of the GT Redesign
Atlanta Drupal Users Group - October 2015 - Success of the GT Redesign
 
Business of Front-end Web Development
Business of Front-end Web DevelopmentBusiness of Front-end Web Development
Business of Front-end Web Development
 
Instructional Design for the Semantic Web
Instructional Design for the Semantic WebInstructional Design for the Semantic Web
Instructional Design for the Semantic Web
 
Social Media and Web 2.0
Social Media and Web 2.0Social Media and Web 2.0
Social Media and Web 2.0
 
Accessibility for beginners
Accessibility for beginnersAccessibility for beginners
Accessibility for beginners
 
Semantic Web, an introduction
Semantic Web, an introductionSemantic Web, an introduction
Semantic Web, an introduction
 
Semantic Representation of Provenance in Wikipedia
Semantic Representation of Provenance in WikipediaSemantic Representation of Provenance in Wikipedia
Semantic Representation of Provenance in Wikipedia
 
[drupalday2017] - Speed-up your Drupal instance!
[drupalday2017] - Speed-up your Drupal instance![drupalday2017] - Speed-up your Drupal instance!
[drupalday2017] - Speed-up your Drupal instance!
 
Speed up your Drupal instance!!
Speed up your Drupal instance!!Speed up your Drupal instance!!
Speed up your Drupal instance!!
 
The real value of open source: ROI and beyond
The real value of open source: ROI and beyondThe real value of open source: ROI and beyond
The real value of open source: ROI and beyond
 
Accessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoAccessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_Toronto
 
Integrating universal design, best practices, & accessibility atia 2013
Integrating universal design, best practices, & accessibility   atia 2013Integrating universal design, best practices, & accessibility   atia 2013
Integrating universal design, best practices, & accessibility atia 2013
 
A web standards & ud approach for access (bps public)
A web standards & ud approach for access (bps   public)A web standards & ud approach for access (bps   public)
A web standards & ud approach for access (bps public)
 
Conference DotJS 2015 Paris review
Conference DotJS 2015 Paris reviewConference DotJS 2015 Paris review
Conference DotJS 2015 Paris review
 
jQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPagesjQuery - the world's most popular java script library comes to XPages
jQuery - the world's most popular java script library comes to XPages
 
21stcenturye learningslideshare
21stcenturye learningslideshare21stcenturye learningslideshare
21stcenturye learningslideshare
 
Introduction to Semantic Web for GIS Practitioners
Introduction to Semantic Web for GIS PractitionersIntroduction to Semantic Web for GIS Practitioners
Introduction to Semantic Web for GIS Practitioners
 
Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"Stefan Judis "Did we(b development) lose the right direction?"
Stefan Judis "Did we(b development) lose the right direction?"
 

Recently uploaded

Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Victor Rentea
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Victor Rentea
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
WSO2
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Safe Software
 

Recently uploaded (20)

AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
AI+A11Y 11MAY2024 HYDERBAD GAAD 2024 - HelloA11Y (11 May 2024)
 
Artificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : UncertaintyArtificial Intelligence Chap.5 : Uncertainty
Artificial Intelligence Chap.5 : Uncertainty
 
AWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of TerraformAWS Community Day CPH - Three problems of Terraform
AWS Community Day CPH - Three problems of Terraform
 
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ..."I see eyes in my soup": How Delivery Hero implemented the safety system for ...
"I see eyes in my soup": How Delivery Hero implemented the safety system for ...
 
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024Finding Java's Hidden Performance Traps @ DevoxxUK 2024
Finding Java's Hidden Performance Traps @ DevoxxUK 2024
 
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost SavingRepurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
Repurposing LNG terminals for Hydrogen Ammonia: Feasibility and Cost Saving
 
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
Modular Monolith - a Practical Alternative to Microservices @ Devoxx UK 2024
 
How to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected WorkerHow to Troubleshoot Apps for the Modern Connected Worker
How to Troubleshoot Apps for the Modern Connected Worker
 
Exploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with MilvusExploring Multimodal Embeddings with Milvus
Exploring Multimodal Embeddings with Milvus
 
Introduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDMIntroduction to use of FHIR Documents in ABDM
Introduction to use of FHIR Documents in ABDM
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
Strategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a FresherStrategies for Landing an Oracle DBA Job as a Fresher
Strategies for Landing an Oracle DBA Job as a Fresher
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
ICT role in 21st century education and its challenges
ICT role in 21st century education and its challengesICT role in 21st century education and its challenges
ICT role in 21st century education and its challenges
 
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers:  A Deep Dive into Serverless Spatial Data and FMECloud Frontiers:  A Deep Dive into Serverless Spatial Data and FME
Cloud Frontiers: A Deep Dive into Serverless Spatial Data and FME
 
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot TakeoffStrategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
Strategize a Smooth Tenant-to-tenant Migration and Copilot Takeoff
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWEREMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
EMPOWERMENT TECHNOLOGY GRADE 11 QUARTER 2 REVIEWER
 
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdfRising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
Rising Above_ Dubai Floods and the Fortitude of Dubai International Airport.pdf
 
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
Connector Corner: Accelerate revenue generation using UiPath API-centric busi...
 

Farfalla: a step towards an Inclusive Web