Farfalla: a step towards an Inclusive Web
56
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
-
Upload
andrea-mangiatordi -
Category
Technology
-
view
1.121 -
download
0
description
Presented on 25th November 2010 in Oxford at DSAI2010 conference (http://dsai2010.utad.pt/). The project website is available at http://farfalla-project.org/
Transcript of Farfalla: a step towards an Inclusive Web
Farfalla Projecta step toward an inclusive web
Testo
Andrea Mangiatordi, University of Milano Bicocca, ItalyRiccardo 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?
TraditionallyWeb Accessibility works like this...
TraditionallyWeb Accessibility works like this...
TraditionallyWeb Accessibility works like this...
TraditionallyWeb Accessibility works like this...
TraditionallyWeb Accessibility works like this...
TraditionallyWeb Accessibility works like this...
STANDARD
STANDARD
A respectful environment, designed for all, fosters
Inclusion
STANDARD
A respectful environment, designed for all, fosters
InclusionBeware!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, a striped butterfly on a background of flowers...
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 ideaframeworkto create a
for deploying AT solutions
The ideaframeworkto create a
and...
The ideaframeworkto 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...
bookmarkletbrowser plugin
or...
direct insertionThis will be the preferred option, and
others can be thought of...
What works right nowhttp://farfalla-project.org/live-demo/
What works right nowhttp://farfalla-project.org/live-demo/
virtual keyboard
What works right nowhttp://farfalla-project.org/live-demo/
virtual keyboardselective magnification
What works right nowhttp://farfalla-project.org/live-demo/
virtual keyboardselective 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
