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

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 2014Particular Software
 
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...Martin Memmel
 
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 RedesignEric Sembrat
 
Business of Front-end Web Development
Business of Front-end Web DevelopmentBusiness of Front-end Web Development
Business of Front-end Web DevelopmentRachel Andrew
 
Instructional Design for the Semantic Web
Instructional Design for the Semantic WebInstructional Design for the Semantic Web
Instructional Design for the Semantic Webguest649a93
 
Semantic Representation of Provenance in Wikipedia
Semantic Representation of Provenance in WikipediaSemantic Representation of Provenance in Wikipedia
Semantic Representation of Provenance in WikipediaFabrizio Orlandi
 
[drupalday2017] - Speed-up your Drupal instance!
[drupalday2017] - Speed-up your Drupal instance![drupalday2017] - Speed-up your Drupal instance!
[drupalday2017] - Speed-up your Drupal instance!DrupalDay
 
Speed up your Drupal instance!!
Speed up your Drupal instance!!Speed up your Drupal instance!!
Speed up your Drupal instance!!bmeme
 
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 beyondJeffrey McGuire
 
Accessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoAccessibility and Web Technologies @HTML5_Toronto
Accessibility and Web Technologies @HTML5_TorontoGeorge Zamfir
 
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 2013Howard 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
 
Conference DotJS 2015 Paris review
Conference DotJS 2015 Paris reviewConference DotJS 2015 Paris review
Conference DotJS 2015 Paris reviewOleksii Prohonnyi
 
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 XPagesMark Roden
 
21stcenturye learningslideshare
21stcenturye learningslideshare21stcenturye learningslideshare
21stcenturye learningslidesharetsimatsima
 
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 PractitionersEmanuele Della Valle
 
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?"Fwdays
 

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

Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfsudhanshuwaghmare1
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...apidays
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonAnna Loughnan Colquhoun
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)wesley chun
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...Martijn de Jong
 
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 SavingEdi Saputra
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?Igalia
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native ApplicationsWSO2
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Jeffrey Haguewood
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024The Digital Insurer
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MIND CTI
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsNanddeep Nachan
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelDeepika Singh
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDropbox
 
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 FMESafe Software
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...apidays
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Miguel Araújo
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobeapidays
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...apidays
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...apidays
 

Recently uploaded (20)

Boost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdfBoost Fertility New Invention Ups Success Rates.pdf
Boost Fertility New Invention Ups Success Rates.pdf
 
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
Apidays Singapore 2024 - Building Digital Trust in a Digital Economy by Veron...
 
Data Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt RobisonData Cloud, More than a CDP by Matt Robison
Data Cloud, More than a CDP by Matt Robison
 
Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)Powerful Google developer tools for immediate impact! (2023-24 C)
Powerful Google developer tools for immediate impact! (2023-24 C)
 
2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...2024: Domino Containers - The Next Step. News from the Domino Container commu...
2024: Domino Containers - The Next Step. News from the Domino Container commu...
 
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
 
A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?A Year of the Servo Reboot: Where Are We Now?
A Year of the Servo Reboot: Where Are We Now?
 
Architecting Cloud Native Applications
Architecting Cloud Native ApplicationsArchitecting Cloud Native Applications
Architecting Cloud Native Applications
 
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
Web Form Automation for Bonterra Impact Management (fka Social Solutions Apri...
 
Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024Manulife - Insurer Transformation Award 2024
Manulife - Insurer Transformation Award 2024
 
MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024MINDCTI Revenue Release Quarter One 2024
MINDCTI Revenue Release Quarter One 2024
 
MS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectorsMS Copilot expands with MS Graph connectors
MS Copilot expands with MS Graph connectors
 
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot ModelNavi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
Navi Mumbai Call Girls 🥰 8617370543 Service Offer VIP Hot Model
 
DBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor PresentationDBX First Quarter 2024 Investor Presentation
DBX First Quarter 2024 Investor Presentation
 
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
 
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
Apidays New York 2024 - Accelerating FinTech Innovation by Vasa Krishnan, Fin...
 
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
Mastering MySQL Database Architecture: Deep Dive into MySQL Shell and MySQL R...
 
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, AdobeApidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
Apidays New York 2024 - Scaling API-first by Ian Reasor and Radu Cotescu, Adobe
 
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
Apidays Singapore 2024 - Scalable LLM APIs for AI and Generative AI Applicati...
 
Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...Apidays New York 2024 - The value of a flexible API Management solution for O...
Apidays New York 2024 - The value of a flexible API Management solution for O...
 

Farfalla: a step towards an Inclusive Web