Web content best practices

Good content is valuable, relevant and unique.

Keep it simple

• Be concise and clear
• Less is more - get to the point quickly
• Use simple sentence construction (yes, even though this is academia)

Know your audience

Identify your audience per page. It's ok to have more than one.

• Prospective students
• Current students
• Faculty
• Staff
• Researchers
• Community members
• Potential donors
• Industry partners

What questions or issues does your audience have and how can you solve them? This is a great time to check in with staff members to see if anyone has heard recurring complaints about your website and any confusion around finding certain topics or using the site in general.

"You are not your audience" - don't make assumptions about what your target audience needs.

Goals

Identify the key goals of your page while keeping the audience in mind.

What's the point/take away of your page?

• Is the page informative?
  • What is the audience looking for/what are you providing them with?
• Does it tell a story?
• Is it a marketing or branding page?
• What do you want the user to do?
• Call to action  be clear and concise don't make the user think or guess.

Focus on two or three key points.

• Front-load information
• Put the essential and most interesting information at the beginning. Include additional information in order of diminishing importance.
• Use headings to make content scannable (not everyone will read every word on your page but they will read your headings)
  • The heading should give a clear idea of what content follows - be specific.
  • If you just read your headings would you know what the page was about?

What makes your college/department/program unique?

• Highlight what you do best or what makes you special in a sea of colleges and universities.
  • Use this as a marketing point.
  • What do you offer that no one else does?

Keep an eye on your competition.

• Are they presenting the same info but in a clearer way?
• Do they use similar or different language/terms?
• What's better or worse about their site?
• Use it for inspiration.

Chunk content

Information on the web is consumed in a modular rather than linear style. You probably skim pages on the web. Our audiences do too. Content needs to be separated into easy-to-scan "chunks" to facilitate most visitors' reading style. 

• Use short paragraphs
• Instructive/descriptive headings
• Bullet points

Reviewing your content

• Try to reread your content from a fresh perspective - as if you were a 17/18 year old freshman
• Have someone who is not familiar with your site review it
  • Could they easily find information?
  • Were they confused in any area?
  • Did they have some questions after reading?
• Can you simplify any areas?
• Reinventing the wheel - are you duplicating content from another source that is the owner of that info - why? 
  • Ex: duplicating info that is on the admissions site. If you find that you're doing this, strongly consider using a promo, undermenu button, etc. to provide some context and link to the original, single source of truth.

Content tips and guidelines

Accessibility

A redesign is a great time to brush up on accessibility standards and skills; sessions on PDFs, the SiteImprove dashboard, etc., along with open hours to work on specific issues can be extremely helpful as you update and migrate content. 

• Accessibility trainings

Accordions

Should I use an accordion?

Accordions should be treated as a last resort, if and only if the content meets ALL of these criteria.

1. The list has more than five to eight items on it.
2. The user would be scanning the list for one, at max two, items.
3. Opening the accordion reveals the content of 1-2 paragraphs, no more.
4. The content in the accordions does not need to be linked to (no deep-linking).

If there are more than five to eight headings, consider using a table of contents that anchors/links to each heading.

Having all the content on the screen provides a better user experience, allowing users to:

• reference multiple pieces of information at once
• utilize the CTRL+F find on the page 
• scan headings
• determine if they are on the right page without having to take any action (click).

Calls to action (CTAs)

A call to action button is a prompt on a website that urges the reader to take a specific action - sign up for a newsletter, submit an application, schedule a visit or rsvp to an event. Remember CTA = action, whereas a hyperlink is used to navigate to another section within a page or a completely different page or site.

• Use short, simple language that's easily skimmed
• Action-oriented language (visit, apply, request information)

Capitalization style

Our editorial style is to always use sentence case, unless something is a formal title that requires Title Case. This applies to menu items, page titles, subheadings, button text and links, among other things. 

Be sure to review the Style guide when updating content and especially when overhauling or redesigning your website.

CMS HTML clean-up

Look into the source code to be sure the HTML is clean. Check for broken links and images (SiteImprove). Be sure your images have alt text included.

Helpful tool: html cleaner

Frequently asked question (FAQ) pages

Don't use an FAQ page to mash together a series of questions in place of providing good, clear, concise information on an appropriately named page. 

If your content is well-written and the website is organized so your main audience can find what they're looking for, there should be little need for an FAQ. It doesn't mean you can't have one--just consider carefully whether it is needed.

Headings and subheading

Organizing web pages by headings helps users get a sense of the page's organization and structure. Headings and subheadings are an important usability and accessibility strategy to help readers scan and locate information within a page. (h1-h6) Somestimes site editors choose a subheading level to apply because they think it is more visually appealing than the subheading that would fit the page's content hierarchy. It is important to not skip a heading level when you add content to a page! H2 should follow H1; H3 should indicate that the content is a subset of the H2 topic and so on. Here's an example of how to order subheadings within a page.

H1 - title of page

H2

H2

H2

H3

H3

H4

H2

H3

H2

Links and hypertext

• Short, concise links are less likely to frustrate screen reader users than long, imprecise links.
• Links are more useful when they make sense out of context. Authors should avoid non-informative link phrases such as:
  • click here
  • read more
  • link to [some link destination] info
• In fact, the phrase "click here" is unnecessary, even if it precedes a more meaningful phrase. For example, a link that says "click here to access today's weather" can be shortened to "today's weather." In some cases it may make sense to precede a link phrase with "more" or "read more about," (e.g. "more about global warming"), but if these extra words can be avoided, it is probably best to avoid them (e.g. "global warming" may convey the same meaning as "more about global warming," depending on the context)

PDF files

If your pdf can be made into a web page or form, do it. This helps with accessibility, SEO and makes things responsive on a mobile phone.

When to use a PDF? In instances where your content mandates being printed, if it needs to be submitted and it can't be done digitally (forms.wayne.edu), or when the content is lengthy and would be unmanageable to convert to web pages.

Naming files

• Standardize your file format and don't use any spaces in the filename.

• Use the title of your document or 2-3 keywords for the filename. The filename should convey the purpose of the pdf.
  Ex: i-20-application.pdf
  request-for-approval-additional-service-assignment.pdf
  graduate-assistant-leaves-of-absence.pdf 
• Don't use dates or version control numbers within your filenames.
  • When you use dates or version control numbers within your final published filenames, you will invariably need to change your filenames when those documents are updated on your website. This creates a problem when other sites or pages have links to this file, or when visitors have bookmarked this file. Viewers will either experience a broken link or will be directed to the older version of the file

URLs and page names

• Use sentence case for page titles and menu items.
• Use hyphens to separate words in urls.
  This will signal to Google where the breaks between words are, and make it easier for your visitors to understand URLs than if the words all run together. Drop any common stop words in the title, such as: a, the, and, or, but, an, of, etc.
  • Ex: https://honors.wayne.edu/special-programs
• Page title and url should match or be similar.
• Keep it short and simple.

Resources: writing for the web

• https://www.usability.gov/how-to-and-tools/methods/writing-for-the-web.html
• https://www.nyu.edu/employees/resources-and-services/media-and-communications/styleguide/website/writing-for-the-web.html
• https://www.websitebuilderexpert.com/building-websites/writing-for-the-web/

CMS training course

• Canvas web course

If you have further questions or if there is something content related we didn't cover, please send us an email at web@wayne.edu.

Suggestions or questions?

We are always looking for topics to include in our occasional messages to website editors at WSU. If there are areas where you need help or where we can explain something, please send email to web@wayne.edu to let us know.