The VdS corporate website: over 1,000 pages in one structure
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.
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
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 buttons and checkboxes
Dropdown list | Submit button
The header leads, the mega menu organises
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.