Heading Examples

Heading Use on URMIA's Main Site

The purpose of this page is to see how the different heading levels are displayed on main-site pages and within URMIA's online communities. Last modified 1/18/22 RP. (Theme by Brightfind)


This Is Heading Level 1 (h1)

This level is reserved for page titles - do not use.


This Is Heading Level 2 (h2)

This is the largest heading to use within content items. Generally, it is used for titles of content items or the different areas of a page.


This Is Heading Level 3 (h3)

This is the next level down and used for subtitles. In the Brightfind theme, h3 is separated with a horizontal line.


This Is Heading Level 4 (h4)


This Is Heading Level 5 (h5)

Usually, Heading Level 5 would be in a smaller font than Heading Level 4. However, that's not that's not the case in our main site's theme.

Use h5 as the top-level heading within URMIA Updates posts, then use h4 for subheadings within the post. This looks more logical to the viewer even though it goes against accessibility and screen reader guidelines. When URMIA redesigns the main site, we will strive to make Heading Level 4 larger than Heading Level 5. Once that new theme is applied, old URMIA Updates posts will look a bit wonky.


This Is Heading Level 6 (h6)

Generally not used.

Hmm, this heading used to be smaller and lighter. I have used it for photo captions.  I need to check if/why it was changed in the main site's theme and ID which pages use H6. 1/15/19 RP

Tips

  • If setting a style for a highlighted line changes the style for the following line, undo, replace the Enter with Shift-Enter to force the editor to start a new paragraph, and reapply the style to the top line. HUG recommends that you always use Shift-Enter instead of Enter.
  • Avoid hyperlinking within a heading.
  • Avoid using a line break within a heading.
  • The Toolbar | Styles | Headings does not display the different levels as they will be seen once the post is published.
  • No matter what the headings look like online, they will be different in e-mail.
  • Headings are responsive so they change based on screen size. Some get smaller to fit while others stay the same size and wrap.