Harper College

Headings

On the web, headings are used to structure the content of a page. Headings should be short, and they should not be used to style paragraphs or callouts.

Headings should always be nested in order, from largest (Heading 1) to smallest (Heading 6). Using Headings in the correct order helps search engines like Google prioritize our content correctly, and makes it easier for users with screen readers to navigate a page.

At Harper, Heading 1 is always used by the page's title at the top of a page. When adding content below the page title in Modern Campus CMS, start with Heading 2. When using headings, try to think of them as the outline for a page, the same way a student might outline a paper.

Capitalization

  • Heading 1 should be capitalized using title case, where each major word is capitalized.
  • Headings 2-6 should use sentence case, where the first word should be capitalized. The other words in the heading should only be capitalized if they are proper nouns or acronyms. 

Examples


The Main Title is Heading 1

The page's main title is capitalized using title case where the first word and all major words are capitalized. To update the page title, go into the Properties menu.

A section using Heading 2

Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel. Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel.

A sub-section using Heading 3

Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel.

A sub-sub-section using Heading 4

Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel.

A sub-sub-sub-section using Heading 5

Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel.

A sub-sub-sub-sub section using Heading 6

Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel.

Another section using Heading 2

Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel. Lorem ipsum dolor sit amet, an quo zril argumentum, ancillae accommodare an qui. Eu idque lucilius vel, augue facilis pri id. Cu mel nemore necessitatibus. Sed sale discere consetetur et. Nam stet viderer suscipiantur an, vocent diceret ut vel.

Last Updated: 12/19/25