pretty accessible | design by pxlgirl

  • View
    354

  • Download
    1

  • Category

    Design

Preview:

Citation preview

design by pxlgirl

pretty accessible | by pxlgirl

http://www.designbypxlgirl.com | designbypxlgirl@gmail.com

design by pxlgirl

the basics |

perception allows our brains to identify and interpret sensory information in order to understand the environment around us. We take it all for granted,unless one of our senses drastically decreases or loses its function. Such impairments can be caused by injuries, yet as we get older, our senses keeplosing their abilities over time.

design by pxlgirl

the basics |

as for accessibility, the following techniques are commonly used by individuals with special needs:

● visual: screen readers, magnification, braille terminals ● motor/mobility: speech recognition, keyboard overlays● auditory: subtitles or sign language

design by pxlgirl

in depth |

a growing number of countries (such as Australia, USA, UK) legally require accessibility guidelines in order for people with disabilities not to be discriminated against. There are different components with a set of guidelines each. The most common addressing the access to digital information are:

● Web Content Accessibility Guidelines (WCAG)● User Agent Accessibility Guidelines (UAAG)

design by pxlgirl

in depth |

accessibility guidelines certainly have good intentions, yet they unfortunately it often overshoots the mark. Meeting them all on the technical end might go along by the rules, yet it would limit on other ends such as design. The main problem is, that in many cases, those guidelines ignore real needs a user with disability might face in everyday life.

another issue is the fact that the guidelines themselves contain of hundreds of pages using advanced tech jargon, that cannot be grasped by an average reader. As a result, there are many misconceptions about the issue, leaving people overwhelmed or unwilling to take the matter seriously.

design by pxlgirl

the status |

examples of web sites relating to support visually impaired, yet not visually appealing, which is a result of the misconception, that partially sighted would not (entirely) “see” the content, hence design is seen as irrelevant.

design by pxlgirl

the status |

a slightly better example design-wise, yet the well meant icons to increase text are too small to be found, and gets very messy when the internal browser zoom function is used.

design by pxlgirl

the facts |

the symptoms and how each individual perceives the world depends on many factors. It is impossible to consider every single condition, so the trick is to find a common ground scale which allows to satisfy the needs of a larger population.

normal eye

http://www.1steyecarearlington.com/ http://www.eyelines.co.uk/

retinal detachment

design by pxlgirl

the facts |

apart from the huge number of different eye diseases, there are a few symptoms that occur:

● myopia/hyperopia (short/farsightedness) ● blurred vision● color blindness● visual field defects

design by pxlgirl

perspectives |

the two images show in comparison seen normally and perceived when colorblind. It can mostly be easily compensated through experience and knowledge, so that those individuals can even drive, unless their vision is not affected.

normal color vision colorblind vision

design by pxlgirl

perspectives |

another comparison of an image as seen with full eye sight, another with low vision of 20% eyesight, from a distance of about 30 cm

normal vision (100%) low vision (20%)

design by pxlgirl

on the web |

screenshot: Apple website | normal view screenshot: Apple website | internal browser zoom

design by pxlgirl

on the web |

screenshot: Apple website | 20% eyesight | distance: 20 cm screenshot: Apple website | 5% eyesight | distance: 10 cm

design by pxlgirl

mobile devices |

20% eyesight | 20 cm distance | visual field disorder 20% eyesight | 5 cm distance | visual field disorder

design by pxlgirl

mobile devices |

5% eyesight | 10 cm distance | visual field disorder 5% eyesight | 3 cm distance | visual field disorder

design by pxlgirl

showcase |

case study: pretty accessible design | audience: visually impaired & supporters

design by pxlgirl

showcase |

project: HITAP Thailand | audience: women between 40 – 60 years of age

design by pxlgirl

conclusion |

in order to assure an accessible approach, there are a few key points that have to be takenunder consideration when realizing a project:

● logic and understandable ALT-tags for images● flexible font sizes to be resized by users● accurate contrasts between background and content● simple and easy navigation (not to be done in flash)● accurate highlighting of active elements (color, font weight etc...)● Prioritize your graphical elements following some logic in your design concept.

design by pxlgirl

conclusion |

on a final note, accessibility affects everybody and should not be treated as a separate unit for a particular group of people. We all have the right to access well designed information without decreasing of quality.

thank you.

www.designbypxlgirl.com | designbypxlgirl@gmail.com | www.facebook.com/designbypxlgirl

design by pxlgirl

Recommended