2. Mobile and Web Accessibility

What is the World Wide Web Consortium (W3C)?

An organisation who establishes rules for enhancing accessibility of websites

What are the Web Content Accessibility Guidelines (WCAG)?

A set of principles established by W3C for standardising website design.

Give an example of some Assistive Technologies for VISUAL impairments.

1. Screen readers

2. Colour contrast

3. Screen magnifier

4. Braille displays

Give an example of some Assistive Technologies for HEARING impairments.

1. Subtitles

Give an example of some Assistive Technologies for MOTOR impairments.

1. Voice recognition software e.g. Google Assistant

2. Speech to text

3. Keyboard/Mouse Options

4. Brain-Computer Interfaces

5. Adaptive Controllers

What are common features on Desktop Applications?

- larger screen

- horizontal display

- uses keyboard and mouse

What are common features on Mobile Applications?

- smaller screen

- vertical display

- uses a small, touch-based keyboard

What are the 11 MOBILE APP DESIGN PRINCIPLES?

1. Simplicity and Visibility

2. Input Methods

3. Menus

4. Screen Size

5. Screen Orientation

6. Touch Gestures

7. The Thumb Zone

8. Target Size

9. Colour Contrast

10. Onboarding Process

11. Inside App

What does Simplicity and Visibility in Mobile Designs detail?

identify the single, most important functions to your app; make this feature simple and visible.

What does Input Methods detail?

offer appropriate keyboards based on input type

What does Screen Size detail?

use an adaptive design approach to smooth transition from one device to another

What does Screen Orientation detail?

Portrait mode is better for tasks that involve reading and scrolling

Landscape mode is better for tasks that involve watching videos or playing games

What are the four categories of orientation design? Explain each of them and give an example.

1. Fluid Design: same content in both orientations

2. Extended Design: elements are added or subtracted according to orientation

3. Complementary Design: can only access added content in a certain orientation e.g. iPhone Calculator

4. Continuous Design: different orientations = different interfaces with different content

What does Touch Gestures detail?

apps should allow users to perform gestures such as scrolling, sliding, pulling down, and tapping.

What does Thumb Zone detail?

important actions/components should be placed in the thumb zone

What does Target Size detail?

Describes the size and spacing between areas of interaction, with a rule that areas shouldn't be smaller than 48 pixels.

What does Colour Contrast detail?

1. Design your app with high-contrast colours to ensure that users can read everything, even if the sun is shining on their smartphone.

2. Providing light and dark mode for different times of the day

What does Onboarding Process detail?

programs must familiarise users with the app and keep it simple for novice users

What does Inside App detail?

Keep users inside the app to give them a more secure and supported feeling

What are the 3 MOBILE WEBSITE DESIGN PRINCIPLES?

1. Minimise Content: Essential elements need to be legible on a smaller resolution

2. Simply Navigation:

3. Restrict User Inputs

What does Minimise Content detail?

Essential elements need to be legible on a smaller resolution, with text at least 11 points or larger, and reduced clutter.

What does Simplify Navigation detail?

Use progressive disclosure to sequence information and actions across several screens.

What does Restrict User Inputs detail?

Design to offer maximum effect for minimum interaction/effort

How can user engagement with apps be increased?

1. Gamification

2. User Gradient Graphics

3. Add Parallax Scrolling

4. Add Icons

5. Integrate Mobile Phone hardware into the design.