Page template
Pages built using the Design System should use this template as a starting point.
Sample HTML
<body>
<div class="ds_page">
<div class="ds_page__top">
<!--
Notifications
Site header
Site navigation
-->
</div>
<div class="ds_page__middle">
<!--
Main content
-->
</div>
<div class="ds_page__bottom">
<!--
Footer
Scripts
-->
</div>
</div>
</body>Page top
This area is used for things that are common across a site, such as notifications, main navigation, and the site header.
Page middle
This is where your main content goes. Use the Design System’s layout component to define how the various parts of a page are arranged.
Page bottom
This area is used for the site footer. It is forced to the bottom of the browser window if a page is shorter than the user’s browser.
Feedback, help and support
If you need help or support you can e-mail us at designsystem@gov.scot
There is a problem
Thanks for your feedback