dynamically generated scalable vector graphics (svg) for barrier-free web-applications kerstin...
TRANSCRIPT
![Page 1: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/1.jpg)
Dynamically Generated
Scalable Vector Graphics (SVG) for
Barrier-free Web-Applications
Kerstin Altmanninger
Wolfram Wöß
12.07.2006
![Page 2: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/2.jpg)
07.06.2006
![Page 3: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/3.jpg)
Dynamically Generated Scalable Vector Graphics (SVG) for
Barrier-free Web-Applications
![Page 4: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/4.jpg)
Goal Basics
Web Accessibility Scalable Vector Graphics (SVG)
„Access2Graphcis“ Prototype Supported kinds of graphics User groups and their requirements
Outlook
Overview
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
3/32
![Page 5: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/5.jpg)
Goal
Graphics should be stored once in a database
and dynamically generated for each user-desire.
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
4/32
„Scalable Vector Graphics“ (SVG)
Goal | Basics | „Access2Graphics“ | Outlook
![Page 6: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/6.jpg)
Goal
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
5/32
Goal | Basics | „Access2Graphics“ | Outlook
vector graphics databaseuser
blind
visually handicapped
physical handicapped
deaf
cognitive handicapped
without disabilities
user profile
braille text
voice output
request database query
generation of the context and user
dependent graphic
tactile bitmap
monitor
PDA
mobile phone
world wide web
world wide web
![Page 7: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/7.jpg)
Web Accessibility
WAI Definition:Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web.
From this it follows that … Web accessibility stands for „using the Web without
encountering barriers” Access to the Web by everyone Web accessibility consider all kinds of disabilities including
older people with changing abilities due to aging
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
6/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 8: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/8.jpg)
Web Accessibility
Kinds of disabilities:
Blind
Low vision
Color deficit
Physical handicapped
Cognitive handicapped
Deaf
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
7/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 9: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/9.jpg)
Web Accessibility
Why is Web accessibility an issue? The Web is a key resource for:
News, information, commerce, entertainment, Classroom education, distance learning Job searching, workplace interaction Civic participation and integration, government services
Barriers impact a significant population
Problems: Not only responsibility of the Web developer Web accessibility depends on several components working together
Underlying Web technology Tools to produce Web content Tools to access Web content
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
8/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 10: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/10.jpg)
Web Accessibility
Strategies to improve Web accessibility:
World Wide Web Consortium (W3C) Web Accessibility Initiative (WAI) Legal guidelines
European Union Germany:
BITV (Barrier-free information technology regulation) Austria:
Article 7 of the federal constitutionFederal obstruction equalization law (since 01.01.2006)
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
9/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 11: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/11.jpg)
„Scalable Vector Graphics“ (SVG)
„Scalable“:Graphics can be smoothly scaled without quality losses.
„Vector“:Vector graphic shapes constitutes the most important graphic object in SVG. Alongside pictures and text are also considered as graphic objects.
„Graphics“:SVG displays the graphical part of the XML-family.
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
10/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 12: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/12.jpg)
„Scalable Vector Graphics“ (SVG)
XML-based language for describing two-dimensional vector and mixed vector/raster graphics
W3C Specification Contained information is
structured in the source code Scalable Large SVG graphics save disc space Support of script and stylesheet languages Specifications for mobile devices: SVG Basic & SVG Tiny
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
11/32
Accessibility Features of SVG
W3C Note 7 August 2000
Goal | Basics | „Access2Graphics“ | Outlook
![Page 13: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/13.jpg)
„Scalable Vector Graphics“ (SVG)
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
12/32
Accessibility
Features:
Alternative equivalents
Variable presentation depth
Internationalization
Filter effects
Goal | Basics | „Access2Graphics“ | Outlook
![Page 14: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/14.jpg)
„Access2Graphics“
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
13/32
What is Access2Graphics?
Which kind of graphics are supported by Access2Graphics?
How can graphics be adapted for individual user desire?
Goal | Basics | „Access2Graphics“ | Outlook
![Page 15: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/15.jpg)
What is „Access2Graphics“?
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
14/32
Web-Application Providing an as much as possible barrier-free access
to SVG graphics for users with disabilities
Functional range:
Goal | Basics | „Access2Graphics“ | Outlook
![Page 16: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/16.jpg)
Supported kinds of graphics
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
15/32
Charts Images
Features:
Links to Web page(s) => image map Links to audio files
Goal | Basics | „Access2Graphics“ | Outlook
![Page 17: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/17.jpg)
User profile:
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
16/32
Text Only the title Only the title and description All textual content
Colors Grayscale User-defined
Size Language
Impacts on graphics:
Goal | Basics | „Access2Graphics“ | Outlook
![Page 18: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/18.jpg)
Blind people
Situation:
No perception of images
Alternative text is essential
Making use of screen readers or self-voicing applications
Screen reader:
Software application
Identifies and interprets information on the screen
Presented to visual impaired people via braille displays or as speech (e.g. JAWS)
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
17/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 19: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/19.jpg)
Blind people
Access2Graphics solution:
Charts will be displayed as tables.
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
18/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 20: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/20.jpg)
Blind people
Access2Graphics solution:
Images become accessible through an description of several graphical fragments.
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
19/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 21: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/21.jpg)
Blind people
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
20/32
Access2Graphics solution:
SVG file HTML file
Goal | Basics | „Access2Graphics“ | Outlook
![Page 22: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/22.jpg)
Visual impaired people
Kinds of visual impairments:
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
21/32
Original
Macula-Degeneration Green Star Gray Star Retinitis Pigmentosa Diabetic
Retinopathy
Goal | Basics | „Access2Graphics“ | Outlook
![Page 23: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/23.jpg)
Visual impaired people
Access2Graphics solution:
Scaling of the graphic
Microsoft Internet Explorer
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
22/32
Goal | Basics | „Access2Graphics“ | Outlook
„Access2Graphics“ Application
![Page 24: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/24.jpg)
People with limited color vision
Situation:Identification of colors is limited or not possible.Reason: Defect in one or more of the three cones.
Classification:
Anomalous Trichromacy (Protanomaly, Deuteranomaly, Tritanomaly)
Dichromacy (Protanopia, Deuteranopia, Tritanopia) Monochromacy
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
23/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 25: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/25.jpg)
People with limited color vision
Access2Graphics
solution:
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
24/32
Color (RGB)
Saturation
Brightness (RGB)
Contrast (RGB)
Goal | Basics | „Access2Graphics“ | Outlook
![Page 26: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/26.jpg)
People with limited color vision
Access2Graphics solution:
Original Grayscale presentation
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
25/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 27: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/27.jpg)
Physical handicapped people
Situation:Difficulties in handling with input devices.
Requirements:
Commands reachable with the keyboard Links included in graphics must be reachable with the tabulator button
Button size
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
26/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 28: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/28.jpg)
Physical handicapped people
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
27/32
Link area
Access2Graphics
solution:
Extraction of
navigation elements
Goal | Basics | „Access2Graphics“ | Outlook
![Page 29: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/29.jpg)
Cognitive handicapped people
Situation:
Problems in understanding complex images
Access2Graphics solution:
Verbal graphic description Redundant information (e.g. links of an image map)
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
28/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 30: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/30.jpg)
Deaf people
Situation:
No perception of audio content
Can lead to an leak of information
Alternative text for audio content is essential
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
29/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 31: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/31.jpg)
Deaf people
Access2Graphicssolution:
Alternative text presentation of the audio content.
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
30/32
Goal | Basics | „Access2Graphics“ | Outlook
![Page 32: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/32.jpg)
Access2Graphics: Next steps
Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications
31/32
Goal | Basics | „Access2Graphics“ | Outlook
Access2Graphics
Expansion of the variety of
setting possibilities for people
with color deficits
WWW
Integration in an
existing web application
Analyzing of SVG files for
providing structural
information
Generation of
more complex
and different
kinds of chartsAdaptation for
mobile devices
![Page 33: Dynamically Generated Scalable Vector Graphics (SVG) for Barrier-free Web-Applications Kerstin Altmanninger Wolfram Wöß 12.07.2006](https://reader036.vdocument.in/reader036/viewer/2022070410/56649eea5503460f94bfbd28/html5/thumbnails/33.jpg)
If a window of opportunity appears,
don‘t pull down the shade.
(Thomas J Peters)
Contacts
A.Univ.-Prof. Dr. Wolfram Wöß +43 (0732) 2468/9589 [email protected]
Dipl.-Ing. Kerstin Altmanninger +43 (0732) 2468/9236 [email protected]
Johannes Kepler University LinzAltenberger Str. 694040 Linz, Austria