Content Style Guide

Headings

  • Titles and headings should all be in capitalize format (capitalize first letters of each word, except stop words). Occasionally they should be in all capital letters. Be consistent. If you make H1s in all capital letters on one page, do the same for other pages.
  • There should only be one H1.
  • They should be hierarchical when possible. H2s should only be used after H1s, H3s should only be used after H2s, etc.
  • H1s should always be larger than H2s, H2s should always be larger than H3s, etc. The size difference should be noticeable. Usually by at least 0.8rem or 8px, until you get below H3s.
  • When using headings in your website content, you should not use the “Font size” and “Select text color” drop-down buttons whenever possible. Instead, use the drop-down button labeled paragraph and select the appropriate heading level. For example, Heading 1 is usually reserved for the biggest headings, such as the first instance of the page title on each page. Note: In the Visual Editor, the headings will not look the same as on your website. You will need to use the Preview / Preview Changes button to see what the headings look like on the page. You can style the headings universally with your theme’s design options or with custom CSS.

Other Styling

  • Links to internal pages (on the same website) should almost always open in the same window/tab. Occasionally an exception might be made for a special landing page. Links to external pages (on other websites) should always open in a new window/tab.
  • Paste as text, or check the Text/HTML view to make sure you’re not copying in spans with styles to override color, font size, font family, etc. or divs. Use Command + Shift + V on a Mac to paste as text.
  • When inserting images, don’t link to the media file. Usually link to “None,” unless you’re linking to another page/site, or to a larger version of the image.
  • If you need extra whitespace, use the spacer in Shortcodes Ultimate. The syntax is [su_spacer size=”40″]. Don’t use extra line breaks as they could be removed by auto-formatting.
  • Use Shift + Enter for single spacing line breaks.
  • Don’t use divs in Text/HTML view, as they could inadvertently be removed by auto-formatting. Use sections or panels in Shortcodes Ultimate instead.
  • Use the Visual Editor’s bullets and numbering. Manual bullets and numbers (i.e. pasted from another source) won’t indent and line up properly with longer entries.