19.05.2024

TYPO3 facelift for Aktion Deutschland Hilft e.V.

Alliance of aid organisations

Screenshot of the Aktion Deutschland Hilft e.V. website.

Aktion Deutschland Hilft e.V. (ADH) is an alliance of leading German aid organisations such as CARE Germany, Malteser Germany and World Vision Germany, which has been providing coordinated disaster relief worldwide since 2001. By pooling resources and expertise, ADH can provide rapid and efficient assistance and use a large proportion of donations directly for emergency aid. Donations are distributed according to a formula that takes into account the capacity and profile of the participating organisations.

Logo: Aktion Deutschland Hilft e.V.

­

Our to-do list

Development, communication, agile solutions, consulting, responsive design, mobile, accessibility, project management

Challenge

Two years after upgrading TYPO3 to version 11.5, a comprehensive visual and structural facelift was initiated for the website www.aktion-deutschland-hilft.de.
We had a number of key objectives in mind for the TYPO3 web project: first and foremost, we wanted to modernise the TYPO3 website visually and give it a fresh, contemporary look. We placed particular emphasis on significantly improving user-friendliness – both for editors and website visitors. At the same time, it was important to consistently adapt the platform to the new brand identity in order to reflect the digital brand experience consistently at all levels. Our approach was rounded off by a comprehensive technical update of the TYPO3 website, which not only increases performance and efficiency, but also creates a sustainable basis for future developments.
 

Implementation

Visual optimisation

The three-level navigation (meta, main and partner navigation) has been fundamentally redesigned and now offers expanded editorial options. In addition, the main navigation now features sticky behaviour with an automatic logo change when scrolling. Partner logos are now displayed in greyscale and show their original colours when the mouse hovers over them. A compact two-line logo display has been developed for mobile views.

Technical development

But it wasn't just the user experience that was the focus of attention – the technical foundation was also thoroughly revamped. The consistent use of modern HTML5 tags gives the website a clearer, semantically structured basis.

Contemporary CSS techniques ensure faster loading times and noticeably improved code maintainability. Thanks to its fully responsive design, the site looks perfect on all devices and screen sizes. And by using SVG graphics, all logos appear razor sharp at all times – regardless of resolution or device.

 

Initial situation

  • outdated appearance
  • limited user-friendliness
  • outdated technical basis

Nerdy stuff

  • Sticky-Navigation
  • Development of two-line logo display (mobile)
  • 12,800 lines of code added
  • 2,700 lines of code removed
  • 160 files adjusted

Technical highlights

  • barrier-friendly basis thanks to modern HTML5 tags
  • Better performance through modern CSS techniques
  • Sharp display thanks to SVG graphics

Project scope in figures

1650

Projects

925

Customers

60

Employees

An all-round impressive result

The comprehensive facelift gives the TYPO3 website a fresh, contemporary user interface and ensures a consistent, appealing look on all devices. Thanks to generous white space and a clear visual hierarchy, the most important content is brought into sharper focus, while overall readability is noticeably improved. The editorial team also benefits: new design options and expanded editorial possibilities make content maintenance and development significantly easier and more flexible.

Technically, the site is currently based on TYPO3 11.5 and uses modern HTML5 and CSS3 standards throughout, as well as scalable SVG graphics for all logos. A fully responsive design with well-thought-out breakpoints guarantees optimal usability – whether on a smartphone, tablet or desktop.
The next technological update is already planned: the upgrade to TYPO3 version 13 is already in the works and will soon make the platform even more future-proof.


Screenshot of the ADH navigation menu
Screenshot of the ADH website
Screenshot of the ADH team page
Screenshot of the ADH application page
Screenshot of the ADH news page
Screenshot of the ADH donation form

Reality check? 
Gladly.

You may also be interested in:


Graphic in green with man

Book your TYPO3 upgrade now

To keep your TYPO3 content management system secure, it needs regular TYPO3 updates and TYPO3 upgrades. It's worth it!

Green graphic with image of a hacker wearing a hoodie from behind

Starfruit AI

With Starfruit AI, you get a business AI solution that allows you to access various LLMs via a single AI interface. Request a demo version now and learn more!

Graphic in green and pink showing a man and woman doing analytical workGraphic in green and pink showing a man and woman doing analytical work

SEO consulting from Frankfurt

With a comprehensive SEO audit, we analyse your entire TYPO3 website and show you specific areas for optimisation.

Enquire now.

Write comment

* These fields are required

Comments

No Comments

Categories

Tags