Академический Документы
Профессиональный Документы
Культура Документы
Anke Boeker, Dr. Tanja Schaetz User Experience, Accessibility, SAP AG CSUN, Los Angeles March 14, 2008
Presentation overview
Accessibility@SAP Special Challenge with Business Web Applications UI Design in SAPs Development Lifecycle SAPs approach: Accessibility by Design SAPs Experience about good UI Design: Examples
Introduction to Accessibility@SAP
SAP provides business software solutions for large, mid-size and small
companies world-wide SAPs product portfolio covers applications for financial accounting, enterprise resource planning, product lifecycle management, supply chain management, customer relationship management, specific industry solutions, etc. More than 43,000 companies run SAP software 12 million users in 120+ countries SAP established a global accessibility program to support business professionals with disabilities to participate fully in todays business environment
2001:
Established in Palo Alto, later moved to Walldorf/Germany (2003) Maintains and develops SAPs Accessibility standard Supports the development teams with guidelines and check tools
Supports
the Accessibility Testlab in Bangalore First contact point for customer requests SAPs first book about Accessibility (Developing accessible software with SAP NetWeaver) published
editable table
editable table
editable table
subscreens
tables
graphics
4
Section 508
5
VPAT
UI Design Specifications
Accessibility Report
PIL
Invent Invent
UI Design specs created based on SAPs standard Milestone: begin of and reviewed by development the ACC
Define
Develop
Deploy
Optimize
3
performed by educated experts in SAPs accessibility testlab
Accessibility Test
Accessibility by design: additional development effort: < 1% Provide Accessibility in an early stage of development Maximum coverage of accessibility requirements by frameworks/technologies Easy to fix bugs in software solutions Minimize overall development efforts Fulfill instructions about good UI design in four categories: Identification of UI elements Usage of colors Contrasts Keyboard access and navigation
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 14
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 15
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 16
Dialog title: verb + noun e.g. Change Record Values, Download Update Text: clearest and simplest language
Labels of buttons: Not OK or Yes or No. Instead Save, Send, Print, Disconnect
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 17
Default button: user can choose ENTER to activate even if it does not have the focus Accelerator keys: quick way to navigate the focus to a target. ALT + underlined character key.
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 18
if button only has icon and no text if icon on button contains additional information not included in the text if keyboard command exists such as CTRL + s for a Save button if button is default button e.g. [Enter] if button text includes abbreviations
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 19
like to use the mouse as often as possible use keyboard and mouse like to use the keyboard as often as possible or can only use the keyboard
want to reach all user interface elements via keyboard only want to reach interactive elements via keyboard Sometimes want to reach only interactive elements and sometimes want to reach all user interface elements
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 20
provide additional key combination e.g. CTRL + n to set focus to the next UI element in tab order and e.g. CTRL + b for previous UI element in tab order
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 21
if same character key is used more than one time on the screen than ALT + underlined character key will set the focus to the next field following the tab order with the same accelerator key
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 22
Column header focusable by keyboard to open context menu e.g. for sorting the column or moving the column to right
Avoid abbreviations
Tool tip for every icon. Sometimes it is a good idea to add the same infomation in a textual way in an additional column.
in this column you can sort information and you can search for this information
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 23
Easy to start e.g. CTRL + f or type ahead Immediate feedback Explanation how to search. E.g. Can I use % or * or ??
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 24
HOME, END, CTRL HOME, CTRL END PAGE UP, PAGE DOWN SHIFT + Space to select a row CTRL + Space to select a cloumn Inside the table concerning the customized navigation type. (Either only cells with interactive UI elements are reached via TAB or all cells are reached via tab.) The arrow keys work as well for navigation from cell to cell.
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 25
Despite this, even users without visual impairments can have trouble understanding a picture.
An icon cannot be used to represent different functions on a single screen. Each icon must be associated with one function only.
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 26
Red traffic lights are round when switched on, and also show four beams of light.
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 27
A minimum of two tab strips and a maximum of seven. Most important page is the farthest left.
Do not include any mandatory input fields on tab pages. Place them above the tab page.
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 28
Two to seven steps: implement a wizard More than seven steps: place tha data that governs the rest of the data above the tab strip.
SAP 2008 / PIL Learning Map Accessibility: ABAP Dynpro Basic / Page 29
Thank you!