Content Editing Essentials

The purpose of this brief guide is to illustrate and explain proper formatting techniques when designing for the Friedman School's site.

Accessibility Best Practices

Heading tags are used to structure content. It is important to ensure that the tags are used in the proper order.

Helpful Hint: Imagine all of your content as a bulleted list. Each indent represents another heading level.

Example of content with properly structured headings:

• Heading 1: Always reserved for the page title. (Example: "Academics")
  • Heading 2: Content related to Heading 1 (the page title), and the first level of heading that content editors should use. (Example: "Degree Programs")
    • Heading 3: Content related to the Heading 2 closest before (Example: "Agriculture, Food and Environment")

A more concise demonstration of the following example:

• Heading 1: Academics
  • Heading 2: Degree Programs
    • Heading 3: Agriculture, Food and Environment
    • Heading 3: Biochemical and Molecular Nutrition
    • Heading 3: Food and Nutrition Policy and Programs
  • Heading 2: Online Certificate Programs
    • Heading 3: Developing Healthy Communities
    • Heading 3: Sustainable Agriculture & Food Systems
      • Heading 4: Program Faculty

Important: Do not skip the proper ordering of heading tags. Improper ordering of heading tags may cause issues for users with accessibility requirements. Additionally, improper ordering may affect the SEO (Search Engine Optimization) of the site as search engines require on the ordering of tags to understand and index content. 

Practices Applicable to All Content Types

<span> tags are typically not necessary

The use of <span> tags in content is often not necessary and can incidentally cause nuisance display issues on the front end for users. Unfortunately, there are certain circumstances which may require us to use the <span> tag, and thus, we can not eliminate/filter its use automatically. These tags are often automatically generated when copying content into the Editor from e-mail and Microsoft Word. Please view your source code before publishing content to eliminate <span> and </span> tags.

Here are examples of an unnecessary/nuisance <span> tag:

<p>Welcome to <span>Tufts University Friedman</span> School of Nutrition Science and Policy.</p>

<span>Welcome to Tufts University Friedman School of Nutrition Science and Policy</span>

In the examples above, the <span> tag is unnecessary. These lines of text should be wrapped in <p> ("Paragraph") tags only.

&nbsp; indicates a single space

The use of &nbsp; is not required to indicate a single space. Browsers can handle this functionality by simply inserting a space with your "space bar". Please view your source code before publishing content to eliminate &nbsp;. 

 

Line Breaks

It is recommended that you use the Enter key for a line break. This creates a full <p> wrapper. Please do not use [Shift] + [Enter] - this creates a single line break ("<br />") and is often not appropriate.

---

Practices Applicable to: Events

Links

If you need to provide a link to another site and/or page in an Event, use the "Link" field. This will properly format the link for optimal display to the user.