Ready-to-go elements

As you’d expect they feature our Fira Sans typeface; animations like our logo and visual device; hover actions; and stylings like buttons and navigational elements.

1. The elements in the header are standard for each website. A navigation panel appears automatically along with the optional ‘breadcrumb’ – both providing quick, clear navigation.
2. The key visual(s) or video works as an eye-catcher. The height can differ depending on the level of the page, but there is a minimum (for consistency’s sake). That said, if your text is too long for this minimum height it will simply auto-expand to fit. Our DSM brand promise always features on the key visual(s) or video(s) for each homepage or landing page. Adding and modifying content couldn’t be easier: simply ‘drag-and-drop’ in the content management system.
3. The most important (or current) story goes here. You have various options and layouts to choose from and you also have the option of using various color gradients.
4. This component is designed to feature short stories around our goals and targets – a big part of our courageous, more purpose-driven approach now. Simply choose the most relevant, resonant type of content – along with the color variation of the visual device that works best. We use DSM light grey as a block color to create harmony and to separate blocks of content.
5. You have a small selection of buttons, icons and settings for tabs to choose from; while the overall design is ready-to-go.
6. To make life easier we’ve fixed the dimensions and elements in the footer for each website.