Grid and columns Our grid system consists of three flexible main columns with an inner space. The flexibility of the columns is limited. The default width is 408px (left column), 412px (center column with 20px space in between) and 360px (right column). The total maximum width of all columns is 840px for the content area. The header could scale up to 1280px . Desktop The layout grid for the biggest screen width consists of three main columns. The default maximum screen width is 1280px....
Basic page types The basic page types represent the fundamental appearance of the Intranet platform and satisfy the needs of Continental employees. There are two different kinds of page types. Static pages with predefined modules and arrangements (e.g. location page) and dynamic pages on which content can be arranged flexibly (e.g. topic page). Homepage You can download the full size screenshot of the page type. Icons/20x20/Download Fullscreen in new tab Article/News You can download...
Interaction Icons Interaction icons help users to navigate through the content. Iconography complies with the common standard symbols, as familiar from other web pages. The background gradient is the same as for buttons, as they have the same functional behavior. Interaction icons are also 40x40 px . Add to newsfeed Icons/20x20/Download Download (svg) Add to newsfeed hover Icons/20x20/Download Download (svg) Add to newsfeed selected Icons/20x20/Download Download (svg) Add to newsfeed...
General page setup The Intranet Platform was built on a flexible grid system in an adaptive design that enables a tailored experience based on employee intent and context. The Header and Footer are designed both to transport brand messages and enclose the content optically. Adaptive design Icons/20x20/Arrow right Adaptive design Grid and columns Icons/20x20/Arrow right Grid and columns Frame Icons/20x20/Arrow right Frame Header Icons/20x20/Arrow right Header Main Navigation...
Teaser Teasers play an important role on the Intranet Platform. They provide a visual insight into different, user-relevant content. Teasers ensure that content remains up to date and encourage users to further explore the site. Single teasers consist of a headline, subline and copy. The order of these elements is not changeable. The image ratio is 16:9 and its width is variable between 1-3 columns. Headline and copy are limited to a maximum character size. Classic Teaser element This...
Accordion An Accordion is a module for displaying information in a collapsible section. The accordion header will always be visible, while the accordions copy text can be toggled to be visible or hidden. People Accordion with business cards Accordion with Teaser List Accordion on sidebars Locations list in content section Calendar module within Accordion layout collection Job openings within the "service" accordion list
Sidebar Content pages can have a several contnt elements linked on the marginal column. Besided link lists, single documents and other teaser variants, the sidebar is used for the personal bookmarks (visible on all content pages) and for basic information as seen on the location pages. Teaser List Wide on sidebar Link list with text links Accordion List on sidebars
Basic Icons Basic icons are used for elemental with no interaction. As they are offered on every page they stay visibly in the background in order not to distract from the content. The default size of a basic icon is limited to 40x40px. The icons set covers all currently available functions. If a new icon is needed, please keep the following in mind: Imagery should be simple and iconic Details in elements should be minimal Use 2-dimensional perspective to avoid complexity Audio...