Web Content Guidelines

Creating web content involves a lot more than just writing what you need to say. As only one piece of an interactive web, each page of the website must balance:

• User needs
  • What do people who visit this page want to know? What questions might they have?
  • What did they come to our site to do? Is there a task they’re trying to complete?
• Organizational goals
  • Increase admissions inquiries
  • Increase enrollment
  • Compete with other colleges in the region
• Site priorities
  • Create a distinct online voice
  • Tell the Clarke story
  • Communicate the value of our degree programs
• Brand standards
  • Consistent messaging with print brand guide
• Search engine standards
  • Should this page be optimized for certain search keywords?
  • What metadata text will encourage users to click?
• Design requirements
  • Does this page need photos? What kind, size, and dimensions?
  • Are there graphic elements like callout boxes or pull quotes this layout could use?
• Functional specifications
  • Word counts for structured content areas
  • Relationships between content types in the CMS (from simply linking to pages to complex tagging requirements)

People read web pages very differently from print materials, or even other digital media like email and newsletters. Even the best writing won’t work if it’s not formatted to accommodate online reading behaviors. These guidelines help users scan, comprehend, and retain information:

• A standard mobile screen fits approximately 100 words. Divide text into paragraphs of 50 words or less.
• One-sentence paragraphs are OK.
• Use inverted pyramid style, just like a journalist. Put the most important information right up top, using short, simple sentences.
• Take out greetings, transitions, and framing phrases like “the following information” or “welcome to the department.” Say what you mean in as few words as possible.
• Use lots of headers that summarize what readers will find in the paragraphs below.
• Convert sentences with lists into bullets. It creates visual space that helps readers scan.
• The first 11 characters of a header are about all that users searching for information will read before skipping to the next element on a page. Use short, simple words in subheads, and start with the most important words. (“Degree Requirements” rather than “Information About Requirements for Graduation.”)

Even if you’re just migrating existing pages into a newly responsive website design, you can eliminate some immediate problems that might render your pages poorly on a phone or tablet:

• Convert files that open in desktop-based programs. Recreate Microsoft Word docs and PowerPoint slides in HTML format. Use PDFs if necessary for stand-alone documents like student handbooks, but don’t hide important information in files users have to download.
• Take essential information out of the sidebars. If something needs to display at the top of a page, include it in the main text field. Sidebars often get bumped to the bottom on a vertically stacked mobile screen.
• Avoid using tables for non-comparative information. They get mangled on mobile screens, so consider converting to a simple list, image, or PDF.
• Check pages on a phone if they have graphic elements or structured content areas, and flag any that need a designer or developer’s help. Info graphics and special layout elements can cause disasters for mobile phone viewing.

Users come to your site with specific tasks already in mind, and information buried in long, difficult, or formal text slows them down and gives them the wrong impression of you as an institution. Writing should be conversational, addressing readers as though you were speaking directly to them.

Person

Use the first-person plural (“we”) to refer to the college or department, and speak directly to the user (“you”) so your content will sound approachable instead of detached or impersonal.

Less like

• Students who wish to change a major or minor offered under the Department of Biology must submit a completed Change of Major and/or Minor form.

More like

• Use this form if you want to change a major or minor from our department.

When you’re writing about a person in a feature story, news announcement, faculty bio, or student profile, use third-person voice (“he” or “she”). The only time you should use first-person voice is in a direct quote.

Contractions

Use contractions for common phrases, “we don’t” or “you’ll” or “it’s.” It may seem informal coming from an organization, but this small change makes text seem much more personal, and has become a common practice in web writing.

Things to avoid:

• Internal jargon. Avoid any terms you would need to explain to a new person.
• Overused marketing language. Use specific examples to make your point more meaningful, rather than too-general phrases that could describe any university or department, such as:
  • “our unique, innovative programs”
  • “world-class facilities”
  • “engaged faculty and students”
  • “cutting-edge research”
• Long words. Avoid words like “utilize” or “methodologies” when a simple “use” or “methods” will do.
• Acronyms. Always spell out on first reference, and eliminate altogether when possible.

• Addresses. Use this format, including line breaks so users can scan the page for them:
  Person or Office Name
  1550 Clarke Drive
  Dubuque, IA 52001-3198
• Alumnus, alumni, alumnae…

• alumnus — one male graduate
• alumni — more than one male graduate or a mixture of male and female graduates
• alumna — one female graduate
• alumnae — more than one female graduate
• alum — informal, one graduate
• alums — informal, more than one graduate
• Ampersands. Spell out “and” instead of using “&” including for the official names of departments, programs, or centers.
• Class years. Use this format: “John Smith, History ‘13” or “John Smith ‘13”

• College and department names. Capitalize the official names (e.g., “Clarke University,” “the Department of History”), but use lowercase when referring to them as “the college” or “the department” or “history majors,” “history classes.”
• Commas. Do not use the serial comma before the last item in a list.
• Degree titles. Use lowercase for degree titles (e.g., bachelor’s degree in history, master of arts, certificate). Don’t use periods in the abbreviations PhD, MA, MS, BA, BS, etc. Also use lowercase for names of majors, unless they include a foreign language (e.g., sociology major, major in English).
• Job titles. Capitalize titles that precede a person’s name, but make them lowercase when they come after a name or stand alone. E.g., “President Joanne M. Burrows, SC”; “Sister Joanne Burrows, president of the university”; “send your forms to the president.”
• Numbers.
  • In paragraph text, spell out one through nine; use numerals for 10 and above.
  • Fractions standing alone are spelled out. For fractions with whole numbers, use numerals.
  • If you’re using numbers in a table, graphic, or display text (like a stat bubble or callout box), use numerals to save space and make the number stand out.
  • Always use numerals for ages, weights, measurements, and percentages.
• Phone numbers. Use parentheses for area codes: (555) 555-5555.
• URLs. Leave off both the “http://” and the “www.” before the domain name in the address. In digital publishing formats (website, email newsletters, social media, etc.), make sure the text editor recognizes it as a link and/or add links manually. When a web address ends a sentence, finish with a period.
• Web terms. Use “email” (no hyphen), “internet” (lowercase), and “website” (one word, all lowercase).

It’s important to consider how people will find the pages you publish. An SEO specialist can do keyword research, identify keyword phrases, and map them to strategic pages in your new site architecture so they might appear higher on the list of results in search engines. Once you have those keywords…

Meta Title tags: This should begin with a descriptive page title and end with a consistent branding construct, e.g., “Majors and Minors | Clarke University.” Length should be no more than 65 characters, including spaces.

Meta descriptions: These can convince users to choose you from the list of search results. Descriptions should be unique for each page and contain no more than 265 characters, though only the first 150 (including spaces) will display in results.

Alt tags: Alt tags are descriptions of an image or graphic. If you’re optimizing a page for a particular keyword phrase, include the phrase in the alt tag if possible, as well as in the filename of the image.

Content: Focus on one keyword phrase per page, incorporating it into headers and every 100 words or so. But don’t use it so much that your page sounds like spam (which can turn away readers and hurt search engine rankings). Not all pages are good candidates for optimization; the ideal length is 200-550 words, so you can repeat a keyword phrase three to six times “organically.”

A good web photo should:

• Have adequate lighting that clearly highlights the subject.
• Have a resolution of 72 pixels per inch at the maximum size it will display on the page. Consider keeping a higher resolution version in your library for alternate uses (e.g., print pieces). You can always save a smaller version, but you can’t add quality by scaling up.
• Be saved in the correct color model: RGB (for screen viewing), not CMYK (for printing).
• Be saved in the right format: JPG for most instances and PNG only when you need transparency.
• Be copyright-free, or taken by a staff member or contracted photographer. Avoid stock photos, which users are great at identifying and can harm your site’s credibility.
• Contain ALT text, captions, and a filename with descriptive keywords.