Human Practices
According to the World Health organization (WHO) 253 million people worldwide live with vision impairments. 217 million have a moderate to severe visual impairment and 36 million are blind. 1.2 million blind people lived in Germany in 2002. There are around 600 blind people living in Marburg, 150 of them are students of the Philipps University. A third of blind students in Germany attended the Philipps University.
You can find talking bus stops and elevators, shopping aids in nearly every supermarket in
Marburg and special rooms in the library of the Philipps University.
One of the reasons why Marburg has become “the capital of blind people” is the
“Bundesweite Kompetenzzentrum für Menschen mit Blindheit und Sehbehinderung”, short
BLISTA. It is a nationwide competence center for the blind and visually impaired. The
BLISTA was the first high school for visually impaired students worldwide. Nowadays, it is the
only high school in Europe that prepares blind students for higher education.
Despite these opportunities, visually impaired people can only rarely be found in fields like biology
or chemistry. We chose to work with the BLISTA for our Human Practices project in
order to help change this.
In the past years globalization and digitalization have shaped the world as we know it. Globalization is accelerated by digitalization and the internet is more important than ever before. The web has the ability to work for all people regardless of language, location, gender, age, income or ability. It removes barriers in communication and interaction that many people with disabilities face in the physical world. Yet, badly designed websites and applications can create barriers which lead to the exclusion of possible users. Barrier-free web design provides accessibility to all people regardless of ability or interface. At this point in time a lot people with vision impairment need to adjust web pages to make them accessible to them.
As a part of our Human Practices project we would like to ask you to design the wiki of your iGEM team so that it is accessible to people with disabilities. Through this, we aim to make the results of the iGEM competition accessible to everyone.
How to design an accessible Wiki
Navigation
All elements of your wiki should be accessible when using only a keyboard as the navigation device.Color contrast
A high contrast between background and e.g. text should be used. This is especially important for buttons and symbols since they can’t be modified by the user.Additionally, red and green should not be used as contrasting colours since people with colour blindness can’t distinguish between those two colours.
Scalability
Font sizes, distances, areas etc. should be set relatively. This can be achieved by using % or em as units instead of e.g. pt.Distances should not be created using transparent pictures. Instead, distances should be formatted using HTML or CSS.
Headings
Headings should be defined as headings instead of defining them as <strong>.Heading should be descriptive. Instead of “Welcome”, your heading should contain important search keys.
Lists
List should be formatted as lists instead of using wordwraps and hyphens.Text
Color or font style should not be used as the sole distinctive feature.Animated text can also cause problems and should be described by an alternative text in the source code.
Frames
Information that belongs together like navigation and content should always be shown in one frame. Otherwise, users have to switch between those frames.Frames should be named with titles like “navigation” or “content” for better orientation.
Figures
To better accomodate people using a screen reader, it is possible to add an alternative text to the source code of figures. This is crucial for obtaining information about the graphic. It is possible to check for accessibility of your wiki. In the settings of most browsers, graphics can be turned off.Image Maps should not be used, as they are only accessible using a computer mouse.
Tables
Tables should be arranged, so that they can be read row for row from left to right.Additionally, a description containing a summary that is not shown but can be read using a screen reader is helpful for understanding the content.
Links
Links to other sites should be in form of a descriptive text instead of non-descriptive links, such as “click here”. If a graphic is used as a link symbol, the alternative text in the source code should point to the information the link leads to.External links should be labeled.