Accessibility in TYPO3
The Hamburg drinking water supplier and wastewater disposal company wanted a relaunch of its web presence.
Concept and design of the new HAMBURG WASSER appearance were technically implemented on the latest TYPO3 version. First and foremost, we focused on the barrier-free design of the frontend during the development of various wireframes. Thus, a clean HTML markup was on the agenda at the beginning in order to pay attention to the technical aspects of accessibility during the implementation.
Tools such as persona and user journey development were used to review the target group environment, the strengths and weaknesses of the previous presence, the target group selection and the UX and UI design and integrate them into the new accessibility requirements.
Do you have a similar challenge for us? Then please feel free to contact us!
The target group
Optimal information coverage for everyone
What expectations do citizens have of the website as the first point of contact for questions and concerns about water supply in their region? How can the increasing information needs of citizens be optimally met?
In addition to answering these questions, the target group is a special feature: As a water provider for the federal state of Hamburg and the surrounding area, HAMBURG WASSER counts all citizens* among its customers. It was therefore not possible to outline a clearly defined user group, but rather to address everyone – across all age groups, B2B as well as B2C.
The target groups were divided into workshops: Citizens who, for example, collect meter reading data from their water levels or are looking for information on drinking water quality or tips on saving water, or potential new employees who want to address HAMBURG WASSER as a modern company with challenging job offers.
Multilingualism as the key to accessibility
Overall, it is important that a website is readable in all languages of the world in order to appeal to the company’s broad user base and to promote Hamburg’s cultural diversity. Finally, a multilingual website is also an important step towards accessibility.
People with different language backgrounds and reading abilities should have equal access to information that is relevant to them. A multilingual website helps ensure that everyone has an equal opportunity to access important information, regardless of their language or culture.
For the implementation, Google Translate was connected to the website, translating the website content in seconds. The translation of a website is fully automatic, with text fragments being analyzed with the help of Google Translate and then re-integrated into the website in the desired target language. Nothing changes in the basic structure, so the website can still be used natively.
Corporate identity and efficient page design for strong online presence
In several workshops, the structure of the individual page areas was developed and built up accordingly into relevant page types. In parallel, the design was developed: HAMBURG WASSER’s new corporate identity had previously only been used for print products. We now extended this for digital use on websites and smartphones, so that HAMBURG WASSER can be better perceived as a brand.
To do this, the style guide for print products with colors, fonts and imagery was adapted and further developed for digital applications, fonts and sizes were optimized for digital devices, for example, and it was ensured that the contrasts were large enough. All page types such as start, service, magazine and press were conceived and designed and thus prepared for development. A component library was used to ensure an efficient structure in TYPO3.
Further agile development: Optimizations and requirements in the ongoing project with HAMBURG WASSER
The project is currently in its second phase and is being further developed in an agile manner. One example is the option to download videos in the press area. In addition, topics can now be filtered with a keyword search in the magazine area. There are always new requirements, such as updating TYPO3 or closing security gaps. The success so far, since the relaunch, could already be measured by the improved accesses to the online service, which especially relieves the customer service. We are looking forward to the further cooperation with HAMBURG WASSER and are excited about upcoming tasks and challenges that will accompany us in this project.
„Innovative technologies open up new potential, but they often become tomorrow’s standard. Digital brand experiences, on the other hand, are unique and can also guarantee your success in the competitive digital environment in the long term. Do you want the best of both worlds? My team and I will be happy to advise you.“
HENDRIK VAN LAATEN
Tel: +49 40 / 31 77 99-0