Headings are important aspects of webpages. They help users see the imporant organization and hierarchy of the content on a page. They are also used by search engines to rank your site in search results (Search Engine Optimization, or SEO), and they assist users with disabilities who may use e-readers to scan a page for the content that they're looking for. But headings must be used properly or they can cause issues on your page.

In order to use headings properly on your site, you must understand their rank or level.  There are a possibility of 6 heading levels, from H1 to H6 (with each level down getting smaller in font size). For proper page construction, there can only be one H1, typically the title of the actual page. After that you can have H2s, and under H2s you can have H3s, etc., all the way down to H6s.  The important thing to note is that you cannot skip any heading levels as you go.

For example, you cannot go from an H2 to an H4, you need to have an H3 follow an H2.

Here is an example of how headings should be used on a page:

• H1
  • H2
    • H3
    • H3
      • H4
    • H3
  • H2
  • H2
    • H3

If your page's layout requires a smaller font for an H3, feel free to go into the H3's Typography section and change the size of its FONT SIZE and LINE HEIGHT, making sure that the line height for each responsive-screen's font size is around 4px higher.

In order to add a heading to your page, you will typically use the "Headings" element. It's an orange square icon that can be found by searching for "heading" in the search field.

Add this element to your page, fill out the title field, select which level of heading it needs to be (choose from H2 - H6), and then go to the "Typography" tab and make sure that "Font Family" is set to "Lato" and that the "Font Style" is set to "Default."  Only change the Font Sizes and Line Height for Lato headings if you need them in a smaller size for your page. For the most part, you should not need to change the heading size.

There will be times that you need to use the Oswald Font for your title (like when you have a Flex2 Marquee on your page).

There are a few things you will need to do differently when adding an Oswald font heading.

Number one, the title will need to be in ALL CAPS.

Number two, you will need to change the responsive font sizes and line heights (under the "Typography" tab), making sure to populate every screen size with whatever size you need it to be, while making sure that the mobile screen sizes aren't too large.