Best practices for formatting the content of webpages, folders and news.

Using appropriate formatting provides structure for your page, which makes it easier for users to scan your content, and allows search engines to better understand your content.

The Text Toolbar

The toolbar in Plone 5 is different than the previous version. All the text styling can be found under "Formats". The toolbar below shows (from left to right) Formats tab, Bold, Italics, Bulleted list, Numbered list, remove link (the broken chain), add link (chain links), and add an image.

text-toolbar.jpg

Headers: Headings and Subheadings

text-toolbar-headings.jpg

Header 1 (h2) is your Heading

Header 2 (h3) is your Subheading

  • Use Headings and Subheadings to create sections of a page. Do not just insert bold text as a heading.
  • Always start with Headings. If no subheadings are used, plone will downsize the Heading font size automatically to subheading font size. Be sure to select "Header 1" from the drop-down menu.
  • Subheadings should only be used under a pre-existing Heading.

Block: Paragraph, Callout and Discreet

text-toolbar-block.jpg

Paragraph is the default style of text

Callout is a highlighted block of text

Discreet is smaller text that is used as a caption for tables or images. It can be used at the end of a page to reference related material that is not linked.

New Format options: subscript and superscript

text-toolbar-format.jpg

Subscript - characters below the text line (for example: H2O)

Superscript - characters above the text line (for example: ft2)

Lists

In the Text tool bar, select either numbered list or bulleted list. Note: always hit the return/enter key to get the next list item. This keeps the list as one entity instead of creating a separate list for each item (bad web practice)

Numbered Lists

  • Avoid numbered lists unless the order/sequence of the items is important.

Bulleted Lists

  • Great for web writing! Use bulleted lists instead of "inline" comma/semicolon delimited lists.
  • Use to make text stand out and easier to scan.

Linking: Internal link, Upload, External link, Email link

Linking to an Email address

add-email-link.jpg

  • If presenting an email address, be sure to make it an active link.
  • Highlight the text that should be the link, choose the chain icon button (add link) in the text tool bar.
  • In the pop-up window, select the "Email" tab, then add email address to text box and click insert. The email link will look like: abc123@psu.edu.

Linking to an Internal (within your website) page 

adding-link.jpg

Use descriptive text for hyperlinks (for example How to Access Plone and Log In) and avoid "click here"

Use the "Search for item on site..." box to find what you want to link to.

Linking to an External Resource

add-external-link.jpg

Use descriptive text for hyperlinks. Highlight the words you would like linked, click the chain icon and select External.  Paste the complete URL in the text box provided (make sure to include http:// or https://)

Upload

For uploading a file and linking to it

add-link-upload.jpg

Other Text Best Practices

  • When using abbreviations or acronyms, always use the full title first, followed by the abbreviation in parenthesis. Then, use the abbreviation for all following instances. For example, "The United States Department of Agriculture (USDA) ..."
  • Never use ALL CAPS to highlight text. This is harder for sighted users to read, and screen readers will S-P-E-L-L out the word rather than reading it. Instead, use bold font or "Call-out" from the drop-down box if you need to highlight body text. But, don't overuse.
  • Avoid blank lines between paragraphs or at the end of pages.
  • Use one space after a period. Additional spaces are read as "&nsbp" by screen readers.
  • Spell out words. Examples: Use "County" and not "Co"; use September and not "Sept"
  • Be consistent with time. Preferred method is p.m. and a.m., but pm and PM are acceptable if the method is consistent throughout the webpage.
  • Never use "PSU" to refer to the university. Instead, use "Penn State" as a shorter version of "The Pennsylvania State University."
  • Don't use spaces to format content (e.g., trying to center text on the page). It will look different on all devices.
  • Tables are only used for tabular data, and not formatting. If you are trying to create a table for tabular data - use the table creator button in the tool bar. For moving existing tabular data from Excel or Word, use Table-maker (please ask us about this tool)
  • Do not add a Discrimination Statement. Links to legal policies are already included in the footer.