Assistive Technology Training. INDOEDU4ALL project.

18-19 September, 2019. University of Alicante.

Pepi Parreño - José María Fernández Gil

Copyright 2019. All rights reserved.

Contents index

  • Presentation
  • Agenda
  • How to follow the training

UA Digital Accessibility Program

Promotion, awareness and training initiative

In terms of digital accessibility and accessibility technologies

What are our goals

  • Break digital barriers
  • Create guidelines for the development of accessible digital content
  • Advise and train the university community in the use of accessible technologies.
  • Detect entrepreneurship opportunities through accessibility research,
  • And the creation of communication channels for its dissemination.

https://web.ua.es/accesibilidad

How to follow the training

https://web.ua.es/en/accesibilidad

Assistive Technology for visual difficulties

  • Knowing the assistive technology for Windows 10
  • Use of screen readers (NVDA)
  • Braille display
  • Use of screen magnifier

Knowing the assistive technology for Windows 10

  • Windows 10 has main accessible elements (characteristics) for different profiles of people with disabilities.
  • For see them, please click on start bottom (windows logo key) and then, click on setting item. Finally, click on ease of access.

Windows settings -> Ease of Access

1. Vision

  • Now, in the left panel, we can see all he characteristics.
  • The first option is Display, we can configure the text size of all Windows elements and software.
  • Also we can configure the visual effects like as show / hide animations and transparecys.

1.1 Display

1.2. Cursosr and pointer size

  • In the next tap, we can configure the cursor and pointer size. We can change he size of the pointer doing click on one of the three options (small medium, big). And we can change the pointer colour: white, black and black/white (in this if the background is in black colour the pointer is in white colour and vice versa).

Cursor and pointer size

1.4. Colour filters

Filtros de colores como sólo mostrar escala de grises. Útil para personas daltónicas.

1.5. High contrast

  • Next tap is High Contrast, we can click and turn on, then the high contrast is selected. The higher contrast is the background in black colour and the text in white colour.

High contrast

2. Hearing

  • The next tab is hearing. This option is for people that only can hear by one ear.
  • Also we can turn on and configure show audio alerts visually.

Audio mono and visual alerts

3. Interaction

  • In the speech tab we can turn on speech recognition.
  • In this moment, we press Windows logo key + h and we can speech and the computer write the text. It is, the test is transcript automatically.
  • If we press Windows logo key + S we can dictate text and control the computer using only our voice. For example: Open Word, File, Edit, etc.

Speech recognition

Keyboard

  • In the keyboard tab we can configure the use of the on-screen keyboard, and the keyboard appears in the screen.
  • We also configure slow press keys for people with motor dificulties.

Keyboard options

Use of screen readers (NVDA)

  • NVDA is a open source and free screen reader software for Windows.
  • We are going to download, run and use NVDA 2019
  • Please, enter www.google.com in an web browser and type NVDA download
  • Press en the first result. Official website download

Braille display

  • Braille display have a braille keyboard. This has two possibilities: the use of 6 keys, it is the Universal Braille, of the use of 8 keys, Computerized Braille.

Braille display

  • The Computerized braille is specially designed for scientific subject, for example mathematic subject. Because it allows more combinations of symbols. For example, in the Universal braille the number must be “a” and extra symbol. With Computerizes braille we need less space. However, Computerized braille is only for digital, it not can use for print.

Braille display

  • Can connect with computers and smpartphones. In the braille line, we can touch the text that appears in the computer/smartphone screen.

Use of screen magnifier

  • Click on the windows logo key/settings/ease of access/vision section/magnifier and turn on. Or pressing windows logo key + "+" key.
  • We can increase magnification with windows logo key + (plus) key or decrease the magnification with Windows logo key + (minus) key.
  • We can close the magnifier with Windows logo key + ESC key.

Windows magnifier

Use of screen magnifier

  • We can configure the Screen Magnifier when windows start or before.
  • Mouse cursor and keyboard focus are options very important. It is very important click in “text insertion point” because, for example if we open “notepad” when we are typing, the screen is moving at the same time that the text appears.

Windows magnifier

Assistive Technology for hearing difficulties

  • FM Transmitter and receiver
  • Macnetic loop
  • Ability Connect App
  • ListenAll

Other Assistive Technology

  • ZOOM
  • Team Viewer

Assistive Technology on Smartphone/Tablet

  • Prizmo go / Lookput
  • Super Vision
  • Cash Reader
  • Microsof Lens
  • Navilens

How to create digital accessible documents for everyone?

What is accessibility?

  • Accessibility is the degree to which everyone can perceive, understand and navigate the information contained in a digital document regardless of their technical, cognitive or physical capabilities .

And how does a person with a disability access the content?

  • If I can not see, I use a screen reader.
  • If my vision is limited, I use a screen magnifier.
  • If I can not listen to a movie, I read the subtitles.
  • If I do not have mobility in my hands I can dictate and give orders.
  • If I have trouble understanding what I read, I can configure the text to my needs.

Who uses accessible technologies?

The answer may surprise ...!

It's not just people without vision or hearing, it also includes:

  • People with dyslexia (10% of the population)
  • People with temporary visual problems or those related to age (9M higher in Spain)
  • People who read subtitles of a video so as not to disturb their co-workers
  • People who surf through the keyboard because they find it more efficient
  • And more

Universal Design

  • Paradigm shift.
  • It is not about adapting content for groups of people with disabilities or others.
  • It is about designing contents taking into account from the beginning that they can be perceived, understood and navigable by as many people as possible.
  • Digital barriers are difficult to perceive

How to create accessible content? 👨🏻💻

We are going to prepare ourselves to work ...

Download document 1 (DOCX 251KB)

Download document 2 (DOCX 266KB)

Clear text

  • Create simple texts with simple language
  • Use font sizes of at least 12 points
  • Use Sans Serif type fonts such as Arial or Verdana
    Microsoft Word capture of the font toolbar where the Arial type font is selected and size 12 points

Text format

  • Use a sufficient line spacing; at least 1.5 lines
  • Space between paraghraphs of 6 points
  • Do not abuse the text centered or in CAPITAL LETTERS
  • Do not justify the text on both sides . It hinders their reading and, therefore, their understanding 👿, especially to people with dyslexia or low vision.

Language

  • Specifies the main language of the document and the language changes present in the text
  • Otherwise, the pronunciation will not be correct and we will lose information.

Set default language:
File -> Options -> Language

Screenshot set Microsoft Word language.  Go to File - Options - Language - Default

Set language of a piece of text:
Select text -> language bar

Word language selection window, which is accessed from the language bar or from File - options - language to set the default language

Titles and structure

  • Structure content in sections , improves understanding and facilitates navigation .
  • Do not simulate titles by changing the appearance of the text, use styles .
Section of styles in the toolbar.  Título1 and Titulo2 are selected to demonstrate the importance of using titles to prioritize documents

Navigation panel

View -> Navigation panel. It has double function:

  1. We get an idea of ​​what the document is about
  2. We navigate through it easily
Word navigation panel where we can scroll through the different sections of the document.  It is enabled from Vista -> Navigation panel

Images and non-text elements

  • Includes a textual description in images and non- text elements.
  • The description should not be superficial and should answer these questions:
    1. What is it?
    2. What's its purpose?
    3. What does it transmit?

What elements should we describe?

  • Images
  • Mathematical formulas
  • Graphics
  • Schemes
  • Tables

This is not just for blind people:

  • Other vision problems
  • Cognitive problems

Enter the alternative text

Photo of penguins playing in the sand, it looks like it is clicked with the right button of the mouse and in the contextual menu it is clicked in image format to specify alternative text
Image format panel is shown, after having clicked on design and properties and altering text, the description is shown: Three penguins play animatedly in the sand.

Demonstration of descriptions

Forms and SmartArt

  • They are not textual elements, although they look like it and we enter text, at the end they are images without alternative text .
Schematic of SmartArt: From a rectangle with the text of the study, an arrow comes out to the rectangle, and from this, another arrow to the rectangle.

Describing a scheme

Include alternative text to a form or SmartAart, right click on the element and click on object format, follow the same steps as to include description to an image

Tables

Table not accessible, has no title and has two cells combined.  The table is the distribution of practical notes, theory and final of a series of students

Well structured tables

  • Simple tables without many groupings
  • Use them only to show content, not to layout content
  • Uniform tables: neither combine nor divide cells
  • Do not leave empty cells: put empty text

Inserting title to tables (and illustrations) facilitates the understanding and purpose of the data.

Instructions to insert a title into a table, select it and with the right button select insert title
Insert title dialog window.  It is indicated that in tables, the title should appear above it and in images below

Mark header rows

On the table layout tab, select the Table Headers check box for headers

Clear design

In table design, the different styles of tables are shown to use a combination of colors and appropriate structure

Repeat header on each page

Tabal properties window, it shows how to activate the repeat header box on each new page

Yeah now is accessible!

Accessible table with the title: Table 1: final notes of the accessibility course.  It is a well structured table, with a good color contrast

Charts

Graph of tart type is shown with the distribution of students by gender, Women: 63% and men 53%.  It is not accessible because it only transmits information through color

Describing graphs

  • As a non-textual element, we must include a description.
  • It does not matter if it is a graphic in image or made from Word / Excel; the resulting object is not accessible.
The graphic area panel is shown in word, click on design and properties and then alternative text to include the description.  In this case the description says: distribution of students by gender: Mujerse 63%, men 37%

Accessible design

  • We should not transmit information only with color.
  • We must choose an accessible style
Toolbar of the design tab when a graph has been selected, the different possibilities are shown to give a design style to a graph

Yes now!

The graph of student distribution by gender is now accessible since not only the values ​​with color are included.

Do not transmit information only with color

Overview

Line graph, in red and green, frames are used for one line and another object for the other line progression

Colorblind person

Line graph showing the two lines with the same gray color, simulating how a person with color blindness would see the graph

Use of color

Use sufficient contrast between text color and background color

There are different texts with low contrast between text color and background color to show how difficult it is to read them.

Contrast calculator

Do not transmit information only with color

A corrected test question is displayed, the correct answer is marked with an X in addition to the green color.

Links

  • The text of a link must clearly convey its purpose, even outside the context of the surrounding text.
  • Prohibited: Click here 🙁, On this link 🙄, etc.
  • There are users browse through lists of links 🤓

All information is valuable

  • Indicate the format and size in the link
  • We can use on-screen info tool for + info
A piece of text that contains a link is displayed.  There is the cursor located on the link and information appears on screen about what will happen when you click on that link.

How to check the accessibility of a document? 👨🏻💻

Check accessibility in Word or PowerPoint

Check the accessibility in Word and power point, we execute it from File - Information -> check if there are problems -> check accessibility
The accessibility copmrobador is displayed once executed.  Several errors are shown as missing alternative text, or no header row is specified.

How do I create a PDF in an accessible way? 👨🏻💻

PDF documents

  • If we have taken into account aspects of universal design, when we save our Word document or PowerPoint to PDF, it will preserve accessibility options and be accessible. Otherwise, no.
  • We should not save as PDF with the typical 'PDF Printer' type programs since they cause the resulting PDF to lose accessibility features.

Save as PDF

Save a PDF from Word or PowerPoint, click on File, Save as
In the file save window, we select type of PDF file and we have to click on the options button, continue on the next diaposita

Options save PDF

  • Mark Create bookmarks using ➡️ Titles.
  • Mark Tags of the structure of the document for accessibility.
  • Document properties
  • Uncheck Bitmap text when fonts are not embedded.
Window of options to save as PDF.  The boxes to be activated are shown, read on this same slide these options.

Final task

Download document (DOCX 466KB)

References

web.ua.es/en/acesibilidad

Thank you!

josema.fernandez@ua.es - pepi@ua.es

Twitter @jmfdz

https://josemariafernandez.es ">