Farfalla: a step towards an Inclusive Web
0 likes560 views
The Farfalla Project aims to enhance web accessibility by creating a framework that assists website developers and users in implementing assistive technologies. It emphasizes that mere compliance with accessibility standards is insufficient for true inclusivity and provides tools for improving website accessibility, including a script that can be integrated into web pages. The project is open-source and encourages participation from the community to further develop its capabilities.
Farfalla: a step towards an Inclusive Web
- 1. 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
- 2. Assistive Technology is traditionally a means of Integration Inclusive?
- 3. Assistive Technology is traditionally a means of Integration Inclusive?
- 4. Assistive Technology is traditionally a means of Integration Inclusive?
- 5. Assistive Technology is traditionally a means of Integration Inclusive?
- 6. Assistive Technology is traditionally a means of Integration Inclusive?
- 7. Assistive Technology is traditionally a means of Integration Inclusive?
- 8. Assistive Technology is traditionally a means of Integration Inclusive?
- 9. Traditionally Web Accessibility works like this...
- 10. Traditionally Web Accessibility works like this...
- 11. Traditionally Web Accessibility works like this...
- 12. Traditionally Web Accessibility works like this...
- 13. Traditionally Web Accessibility works like this...
- 14. Traditionally Web Accessibility works like this... STANDARD
- 15. STANDARD A respectful environment, designed for all, fosters Inclusion
- 16. STANDARD A respectful environment, designed for all, fosters Inclusion Beware! The simple compliance with standards does not guarantee accessibility!
- 17. HTML is a tree Photo: Autumn Trees of Tenterfield, by Matthew Stewart
- 18. Web sites are forests Concept by T.V. Raman
- 19. The problem? Websites developers? Websites users? Content Management Systems users?
- 20. The problem? Websites developers? Websites users? Content Management Systems users? Whatever, it is a matter of Knowledge
- 21. An example? People need to know that images need alternative text...
- 22. Iphiclides podalirius, astriped butterfly ona background offlowers... An example? People need to know that images need alternative text...
- 23. as they need to know many other things in order to make a website really accessible.
- 24. as they need to know many other things in order to make a website really accessible. Try applying the WAI-ARIA literally...
- 25. The idea
- 26. The idea frameworkto create a for deploying AT solutions
- 27. The idea frameworkto create a and...
- 28. The idea frameworkto create a for enhancing accessibility
- 30. How?
- 36. ! creation of new UI elements ! direct CSS improvements ! DOM tree manipulation jQuery
- 37. PHP (cakephp) ! profiles management ! configuration of personal preferences
- 38. MySQL ! storage of: ! personal preferences ! useful resources (dictionaries, wiki-like data...)
- 39. How does it work?
- 40. <!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
- 41. <!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
- 42. once the script is there...
- 43. once the script is there... Imagine a visually impaired user...
- 44. once the script is there... Imagine a visually impaired user...
- 45. once the script is there... Imagine a visually impaired user...
- 46. Activated via...
- 49. or... direct insertion This will be the preferred option, and others can be thought of...
- 50. What works right now http://farfalla-project.org/live-demo/
- 51. What works right now http://farfalla-project.org/live-demo/ virtual keyboard
- 52. What works right now http://farfalla-project.org/live-demo/ virtual keyboard selective magnification
- 53. What works right now http://farfalla-project.org/live-demo/ virtual keyboard selective magnification visual enhancements
- 54. Research ahead - phase 1 ! grounded theory approach: ! longitudinal tests in quasi-experimental settings ! combined use of distinct accessibility tests
- 55. Research ahead - phase 2 ! qualitative study of the social effects: ! semi-structured inteviews with users ! sociometric analysis
- 56. 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