View
44
Download
0
Category
Tags:
Preview:
DESCRIPTION
Accessibility of the eZoomBook platform for visually impaired people. Ouattara Ibrahima Tournoux Félix. Plan. State of the art of assisting technologies Diagnosis Internationalization Situation & Conclusion. 1. Screen Readers. 1. Screen Readers. 1. Screen R eaders. 1. Screen Readers. - PowerPoint PPT Presentation
Citation preview
Accessibility of the eZoomBook platform for visually impaired people
Ouattara IbrahimaTournoux Félix
PlanI. State of the art of assisting technologiesII. DiagnosisIII.InternationalizationIV. Situation & Conclusion
1. Screen Readers
JAWS Window- Eyes
VoiceOver NVDA System Acces Zoom text Chrome vox Other0
10
20
30
40
50
60
Use of screen readers
lecteurs d'écrans
Use
in %
1. Screen Readers
1. Screen Readers
Ordinateur bureau Ordinateur portable Appareil mobile0
10
20
30
40
50
60
70
80
90
Devices used with screen readers
Uti
lisat
ion
en %
1. Screen Readers
1. Dedicated stylesheets•Set a visual profile in your browser•Forces the CSS render•OrdiVision stylesheet :
▫White on black for text▫Yellow for links▫Border for tables
•Other colors•High contrast
1. Dedicated stylesheets
II. Diagnosis
2. Diagnosis•The Web Accessibility Initiative
▫Perceivable▫Usable▫Understandable▫Robust
2. Tools•User experience•Total Validator•Color contrast Analyzer
2. Diagnosis ++
Alternative textKeyboard functionalityLinear content
2. Diagnosis --
Css in linePresentation and information are not separeted Hn tag sometime are not well usedSome functions don’t work
Hn tag • <h4>@Messages("parameters.modifylanguage.header")</h4>• • @helper.form(routes.Workspace.changeLang){• @select(langForm("locale"), options = Seq("fr" -> "French", "en" -> "English"), '_label -> "")• <div>• <input type="submit" value='@Messages("parameters.modifylanguage.submit")• <a><h5>@Messages("parameters.unsubscribenewsletter.link")</h5></a>• • @defining(MD5Util.md5Hex(context.user.map(u => u.email).getOrElse("ezoomwiki.com"))){icon =>• <img src="https://www.gravatar.com/avatar/@icon?s=40&d=identicon">• } <a href="http://en.gravatar.com/emails/">@Messages("parameters.modifyimage.link")<a>• • ……………………………………………………………………………………..• …………………………………………………………………………………………………..;• <div class="alert alert-info">• <button type="button" class="close" data-dismiss="alert">x</button>• @error• </div>• }else{}• • <h4>@Messages("parameters.modifyinfo.header")</h4>
Css in line• <style>• • .rightpannel{• position: absolute;• top: 170px;• left: 60%;• right:15%• }• • .midlepannel{• position: absolute;• top: 170px;• right: 60%;• left: 35%;• • }• • .leftpannel{• position: absolute;• top: 170px;• right: 65%;• left: 10%;• }• </style>
What we did…
III. Internationalization
Step 1 : conversion of views content
Step 1 : conversion of views content
Step 2 : messages glossary
Step 3 :French messages glossary
Step 3 : french messages glossary
Is it working ?•Already approximately worked•We added messages•We added all the translations•Branch of the project to be committed by
Mayleen
IV. Current Situation &
Conclusion
1. Play Bug•Sudden lauching error last month
[info] Resolving ezb-dal-play#ezb-dal-play_2.10;2.0-SNAPSHOT ...[error] Server access Error: handshake alert: unrecognized_name url=https://github.com/ezoombook/ezb-mvn/raw/master/ezb-dal-play/ezb-dal-play_2.10/2.0-SNAPSHOT/maven-metadata.xml[error] Server access Error: handshake alert: unrecognized_name url=https://github.com/ezoombook/ezb-mvn/raw/master/ezb-dal-play/ezb-dal-play_2.10/2.0-SNAPSHOT/ezb-dal-play_2.10-2.0-SNAPSHOT.pom
1. Play Bug•url not exact•Edit the path in Build.scala•Dependencies issue: Maven•Github.com: file signature : sha1 error
2. Structure•Report : List of errors from Total Validator
•Structure is good thanks to Play•Send a version to the tester team at AVH, Fernando Pinto’s association.
3. Internationalization•Currently a branch on Github•Test and commit•Complete french glossary•Easy to make other languages
Thank you for your attention !
Recommended