The VdS corporate website: over 1,000 pages in one order
The VdS corporate website first had to solve a problem of order. The content existed in many forms and from many sources, grown over years. Only a shared VdS information architecture turned it into a presence that users understand — and that VdS can extend.
Structure
A VdS information architecture for many sources
It began with a joint workshop. The requirements for the new presence were clarified there: how should the content be structured? What do users expect, and where? And what does the screen design have to achieve so that both come together?
Those answers formed the basis for information architecture, UX and interface. They became the checklist against which every later decision was measured.
The foundation of the VdS corporate website
The main task was to cluster content and sources of very different kinds. A concept was developed to bring them into a shared information architecture. With over 1,000 subpages and five languages, this was only possible through an ordered process with safeguards.
TYPO3 serves as the foundation. An intuitive folder structure was created there first. Only that structure made it possible to add thousands of media files and texts in an ordered way. And it continues to hold, because new content follows the same rules. The technical implementation was carried out by Die Medialen.
The rights management was set up just as early. Editors work internationally and in several languages, each with their own permissions. Content can therefore be maintained in every language version without consulting CRENEO, the web agency or a central office at VdS.
Findability
The right information in seconds
The first visible area of the homepage stays uncluttered. A rotating slider leads to changing content. Right beside it sits a search field as a quick route into the certification database.
Over 1,000 publications in one box
VdS publishes more than 1,000 guidelines, safety regulations and information sheets through its own publishing house. So that users do not have to search through them, CRENEO developed a publications box. It bundles the holdings and makes them reachable in a few clicks.
Construction
The VdS corporate website follows a component library
The interface design follows the guidelines of the VdS corporate design. On that basis, a component library was built along atomic design principles. All content is represented through defined organisms and carried into the pages.
Form and input fields | Radio and check button
Dropdown List | Submit Button
The header leads, the mega menu orders
The header stays deliberately reduced. The mega menu shows every first-level menu item. Only from level two does a margin column come in for the remaining subitems.
Explaining is a module too
Corporate security cannot be explained in keywords. The website therefore takes the illustrations and infographics from the corporate design and sets them in motion. The risk management section leads through three steps in this way: identify, assess, minimise.
Mobile first
The site was developed following a mobile-first approach. The complex range of services can therefore be grasped equally well on any device.
Growth
A kit that grows with the brand
The VdS corporate website was designed for scalability from the outset. New modules have been added over the years without the system having to be rebuilt.
The backend structure makes this possible. Editorial workflow and permissions are set up so that new pages can be assembled quickly from existing components.
The result is a VdS corporate website that carries over 1,000 pages in five languages today. Publications are found in seconds, new pages built in little time.