Maintaining heading structure in the panel template

Advisory

The information on this page is only applicable if you're editing the University webpages using T4. It presumes that you have already completed the beginners and advanced level of the T4 training (a link for staff only - opens in new window).

If your website doesn't use the Panel template, you do not need to read this tutorial.

Introduction

Some technical terms

Device

Here 'device' is used as an umbrella term for any technological means of viewing the web, for example:

Desktop computers
Laptops
Tablets
Mobile phones

Orientation

'Orientation' refers to the position of the device when it's used to view web content.

Portrait orientation means the narrow side of the screen is at the top.
Landscape orientation means the long side of screen is at the top.

Therefore:

Desktop and laptop computers are always used in landscape orientation.
Tablets and mobile phones may be used in portrait or landscape orientation.

The panel template and display width

The panel template is designed to change its layout depending on the display width of the device being used to look at it. This tutorial explains:

how panels behave for different display widths
why you need to bear this behaviour in mind when creating headings for panels.