Headings

Headings

A hierarchy of information separated by heading levels has been developed to provide clarity and focus across communications.

Heading levels should abide by the semantic markup principles. Semantic HTML is the use of HTML markup to reinforce the semantics, or meaning, of the information in webpages and web applications rather than merely to define its presentation or look. Semantic HTML is processed by traditional web browsers as well as by many other user agents.

When building/editing a page, heading levels need to make logical sense. Information needs to be separated according to importance and heading level and should appear in chronological order. ie. heading 1, followed up heading 2, then heading 3.

Below are some examples of the heading styles used across the Macquarie University website, along with where they have been applied.

Heading 1

In mollis mi ut gravida mollis. Quisque eu placerat dolor, nec auctor neque. Nullam accumsan aliquet semper. Curabitur odio nisi, dictum a egestas eu, volutpat non erat. Integer fermentum lacus metus, sit amet vehicula tortor malesuada sit amet.

<h1>
   Heading 1
</h1>
<p>
   In mollis mi ut gravida mollis. Quisque eu placerat dolor, nec auctor neque. Nullam accumsan aliquet semper. Curabitur odio nisi, dictum a egestas eu, volutpat non erat. <a href="#">Integer fermentum lacus metus, sit amet vehicula tortor malesuada sit amet</a>.
</p>

Heading 2

Sed commodo, libero eget placerat consectetur, ligula massa tincidunt est, cursus egestas tortor felis in enim. Phasellus vehicula id est vel euismod. Phasellus vestibulum, massa adipiscing pharetra sollicitudin, enim sem imperdiet nulla, ac facilisis ante magna vitae augue.

<h2>
   Heading 2
</h2>
<p>
   Sed commodo, libero eget placerat consectetur, ligula massa tincidunt est, cursus egestas tortor felis in enim. Phasellus <a href="http://www.google.com">vehicula id est</a> vel euismod. Phasellus vestibulum, massa adipiscing pharetra sollicitudin, enim sem imperdiet nulla, ac facilisis ante magna vitae augue.
</p>

Heading 3

Aenean purus purus, elementum et porttitor eget, dapibus ac est. Nam sagittis massa eget elit condimentum tempor ac quis nulla. Pellentesque nec lacus imperdiet, fermentum orci vitae, dignissim nulla.

<h3>
   Heading 3
</h3>
<p>
   Aenean purus purus, elementum et porttitor eget, dapibus ac est. Nam sagittis massa eget elit condimentum tempor ac quis nulla. Pellentesque nec lacus imperdiet, fermentum orci vitae, dignissim nulla.
</p>

Heading 4

Vivamus vitae nisl vitae enim aliquam bibendum. Vivamus a neque semper, tristique lorem eu, egestas risus. Suspendisse et volutpat turpis, quis porttitor dolor. Curabitur placerat, est sagittis pretium hendrerit, ligula lectus scelerisque lacus, at facilisis lacus lacus cursus ipsum.

<h4>
   Heading 4
</h4>
<p>
   Vivamus vitae nisl vitae enim aliquam bibendum. Vivamus a neque semper, tristique lorem eu, egestas risus. Suspendisse et volutpat turpis, quis porttitor dolor. Curabitur placerat, est sagittis pretium hendrerit, ligula lectus scelerisque lacus, at facilisis lacus lacus cursus ipsum.
</p>
Heading 5

Phasellus pulvinar at lorem eget facilisis. Aenean tempor, mi eget convallis tincidunt, quam erat ullamcorper ipsum, eget aliquam mauris velit et neque. Fusce fermentum sem at accumsan fermentum. Proin bibendum placerat aliquam.

<h5>
   Heading 5
</h5>
<p>
   Phasellus pulvinar at lorem eget facilisis. Aenean tempor, mi eget convallis tincidunt, quam erat ullamcorper ipsum, eget aliquam mauris velit et neque. Fusce fermentum sem at accumsan fermentum. Proin bibendum placerat aliquam.
</p>
Heading 6

Phasellus pulvinar at lorem eget facilisis. Aenean tempor, mi eget convallis tincidunt, quam erat ullamcorper ipsum, eget aliquam mauris velit et neque. Fusce fermentum sem at accumsan fermentum. Proin bibendum placerat aliquam.

<h6>
   Heading 6
</h6>
<p>
   Phasellus pulvinar at lorem eget facilisis. Aenean tempor, mi eget convallis tincidunt, quam erat ullamcorper ipsum, eget aliquam mauris velit et neque. Fusce fermentum sem at accumsan fermentum. Proin bibendum placerat aliquam.
</p>

Other heading styles

Sed ut perspiciatis unde om nis iste quis nostrum

This is currently used as the Heading 1 styles across all Faculty pages:

Sed ut perspiciatis unde om nis iste quis nostrum

This is currently used across all Department websites eg.:

Back to the top of this page