Web Writing Style Guide

academic degrees

Web attribution for academic degrees follows the AP Style guide. Avoid an abbreviation if possible and use a phrase such as: Mary Smith, who has a doctorate in philosophy. Use an apostrophe in bachelor's degree, a master's, etc., When academic degrees are referred to in general terms such as doctorate, doctoral, bachelor's, or master's, they are not capitalized. When using the initial forms, do not put spaces between the initials.

Examples:

bachelor's degree, a B.A.
a master's degree, an M.A.
doctoral degree
doctoral candidate
a doctorate in history
a B.A., a B.S.
an M.S.
a Ph.D.
an M.F.A. in applied physics
the doctor of philosophy degree

Note: Licenses and associations do not take periods: CPA, LCSW, AAAS, IEEE, ASLA.

acronyms, abbreviations

For a list of commonly used UC San Diego acronyms and abbreviations, see the acronyms and abbreviations list.

ages

Always use figures:

• The department is 9 years old.
• The graduates are in their 20s.

Use hyphens for ages expressed as adjectives:

• She is a 30-year-old graduate student.

See bias-free language, University Communications Editorial Styleguide.

& (ampersand)

• When it's part of the official name of a department, Environment, Health & Safety.
• In CMS Display Names to shorten menu.

Campus CMS automatically converts the keyboard "&" key. If you use the key, make sure it displays correctly across all bowsers.

To add:

• Insert characters into CMS content.
• Code: &

a.m. and p.m.

See times of day.

anchor links

Anchor links help readers jump to the topic they need within the same page. See how to create links in the campus CMS.

Note: By using the "drawer" template, you can often avoid anchor links.

and/or

Avoid the use of "and/or" by writing the sentence in a different way. If you do use it, there is no space after the slash: and/or.

apostrophe (')

For figures or numbers, do not use an apostrophe:

• The 1960s were an interesting time.
• The temperature is in the low 20s.

The CMS does not require this character mark to be converted into code. To add “smart” quotes, which curve towards the word:

• Insert characters into CMS content. 
• Code:
  • Left apostrophe: ‘ (‘)
  • Right apostrophe code: ’  (’)

bias-free language

See the University Communications Editorial Style Guide. 

bold text (strong)

brand guidelines

The UC San Diego brand includes logos, colors and typography. Brand design is already embeded in CMS templates.

See the UC San Diego brand website.

bulleted or ordered lists

Always use a capital letter on the first word in a list item. Use end punctuation only if the list item is a complete sentence.  Make all items within a list parallel in construction; e.g., start each item with a verb, make each item a complete sentence, etc.

• Code: <ul> <li> </li> </ul>
• WYSIWYG icon 
  

• Code: <ol> <li> </li> </ol>
• WYSIWYG icon:
  

 If an introductory sentence precedes the list, end the sentence with a colon.

capitalization

See titles, Communications Editorial Style Guide.

characters

See special characters.

color text

Avoid colored text due to accessibility constraints. See emphasis.

comma (,)

For details on using commas, see the punctuation guide of the AP Stylebook.

contact line

Blink/TritonLink content: All Blink and TritonLink pages should close with contact information. In most templates there is a Contact section in which to add this information.

Example:

• For more information, contact the ITS Service Desk, 858-246-4357.
• Code: email and phone number: <a href="mailto:servicedesk@ucsd.edu"> ITS Service Desk,  858-246-4357.

If Contact lines include a link to 1 or more department or organization pages (not an individual's email) the contact line will be the final bullet point on the page; no period after the phone number.

Examples:

• Contact: Financial Aid and Scholarships Office, 858-534-4480
• Contacts:
  • Your department
  • Your college
  • Registrar's Office, 858-534-3144
• Contact number is the full phone number, no parentheses. See telephone number.

contacts page

Organize the content in:

• Profile listing page template.
• Tables:  List the services in the left column and the employee or unit name, email, phone and fax numbers in the right column.

dash

See em dash, en dash, special characters

dates

Use 1981–82, not 1981/82 or 1981–1982 (use en dash between); in the ’80s or 1980s.

See also en dash, years.

days of the week

Use "weekdays" instead of "Monday through Friday."

When space is an issue (e.g., navigation, tables, graphics), abbreviate the days. Do not use a period after an abbreviation, and separate the days with an en dash.

Examples:

• M–Th
• Mon–Thu

degrees

See academic degrees.

disabled, disability

See bias-free language, Communications Editorial Style Guide.

disclaimer (Blink/TritonLink)

The disclaimer on a Blink or TritonLink page points out that the content has been derived from university or UC San Diego policies and procedures, which take precedence over Blink or TritonLink content in any case of dispute. The disclaimer (if used) appears at the bottom of the page.

dollar amounts ($)

• Use the symbol and numerals for exact amounts: $75.
• Spell out proximate amounts or casual references: a million dollars.
• Do not include decimal or zeros in round dollar amounts: $50 (not $50.00) For amounts over $1 million, use the $ symbol and numerals up to two decimal points.

Examples:

• The building was appraised at $4.25 million.
• The department has a $3.2 billion budget.

ellipsis (…)

Use an ellipsis to indicate the deletion of 1 or more words when condensing quotes, texts and documents. Avoid deletions that would distort the meaning. Leave 1 space before and after an ellipsis.

• I ... tried to do what was best.

If the words preceding an ellipsis constitute a complete sentence, place a period at the end of the last word before the ellipsis, and follow it with a regular space before the ellipsis:

• I no longer have a strong political base. ...

Use an ellipsis with sentences ending in other punctuation marks (question mark, exclamation point, comma or colon) in the same manner:

• Will you come? ...

Do not use an ellipsis at the beginning and end of direct quotes. Do not use an ellipsis to indicate a pause in speech—use a dash, unless it is in a context where words have been deleted, in which case an ellipsis would be appropriate.

To add:

An ellipsis requires code to ensure screen reader users understand truncated text. Rather than three periods, which may be read incorrectly as "period, period, period":

• Insert characters into CMS content.
• Code: … or  &hellip;

email

Use the person's name — not the email address — as the name of the link. Follow the name with a comma and the phone number:

• Mary Smith, 858-555-5555.

HTML code: <a href="mailto:sdonahoe@ucsd.edu"> Mary Smith</a> 858-555-5555.

Use a hyphen with other e-terms, such as: e-book, e-business and e-commerce.

em dash (—)

Use an em dash to indicate a break in thought, an abrupt change, or emphasis within a sentence:

• Topics include — but are not limited to — the items on the list.

Use an em dash to set off a series of words separated by commas:

• Several kinds of interview questions — open-ended, behavioral, follow-up — should be included.

Always use a space before and after an em dash.

To add:

• Insert Characters into CMS content.
• Code: —

See also en dash.

en dash (–)

An en dash is half the length of an em dash and longer than a hyphen. An en dash connects numbers in dates, times, and references. When an en dash connects letters or numbers, do not add a space before or after it.

Examples

• Letters A–D
• 1–2 p.m.
• Pages 12–14
• 2006–07

When an en dash connects words or a word and a number, add 1 space before and after it:

• May – June
• 10:30 a.m. – 1:30 p.m.

To add:

• Insert characters into CMS content
• Code: –

See also em dash, hyphen, times of day.

emphasis

• Use bold text sparingly when you need to emphasize important words or phrases.
  • Bold any punctuation that immediately follows your bolded text.
  • Do not apply bold text to title tags in the CMS, such as h1, h2, h3 as their style is automatically set in the templates.
• We recommend against using italics because it can make the text more difficult to read when scanning.
• Do not use red or other colored text as it may not be accessible for those who are color-blind (red-green deficiency) and those using screen readers. 

Callout Boxes

If a section of text needs to be emphasized, consider using a message or alert box or a module.

To add:

• WYSIWYG: B icon
• Code: <strong>  </strong>

ethnic groups, nationalities

See Race, Ethnicity, Communications Editorial Style Guide

extension/ Ext.

See telephone number.

FAQ

FAQ is an acronym for "frequently asked questions." Use the acronym primarily in titles and headers, not in body text. Use the spelled-out version of "frequently asked questions" in body text, at least in the first usage. When referring to 1 document that contains frequently asked questions, refer to the document as an "FAQ" (not "FAQs"). When referring to more than 1 document that contain frequently asked questions, refer to the documents as "FAQs." Refer to specific questions within an FAQ as "questions," not as "FAQs." When writing an FAQ page, if you have more than 10 questions, try grouping them into categories.

figures

See numbers.

font colors

Don't use colored fonts in websites without prior approval. If you need to emphasize text, see emphasis.  

gender

See University Communications editorial style guide.

graphics, images

Learn about adding images in the CMS. Alt text is mandatory for accessibility purposes. Learn about image accessibility on UC San Diego's Images and Graphics Accessibility Checklist.

• For images that are decorative only, use an empty alt tag: alt=""
• HTML example:
  <img alt="" src="/Blink/_images/homepage/blue-background.jpg">

In cases where the image carries meaning, follow these guidelines for alt text:

• Keep it short.
• Accurately describe the graphic.
• Use an initial cap on the first word, then lowercase subsequent words unless they are proper nouns.
• HTML example: <img src="/Blink/Images/Gallery/5811hp.jpg" alt="Bar graph showing diversity statistics">

headers

Readers should be able to scan the headers on a page for an overview of the main ideas.

The title of the page should always be an <h1> tag. See Using Headers in the CMS. Use no more than 2 levels of headers (<h2> and <h3>) below the page title.

Blink/Tritonlink: The page title <h1> is added in page metadata. Headers that users add will begin with <h2> and <h3>.

 See also titles.

hyphen (-)

Use a hyphen to link compound modifiers:

• It was a good-faith attempt.

Use a hyphen for clarity:

• She recovered the data.
• They re-covered the damaged roof.

Capitalize hyphenated words in titles and headers only if the hyphen connects 2 separate words:

• How-To
• Sign-On

Hyphen does not require a special character.

See also em dash (—), en dash (–), special characters, Communications Editorial Style Guide

Internet

Always capitalize. 

italics

See emphasis.

job titles (UC San Diego)

Lowercase job titles when they appear in body copy:

• Human Resources has several recruiting specialists.

Lowercase job titles when they refer to a particular person but do not appear as part of the person's official title:

• Steve Relyea is one of UC San Diego's vice chancellors.

Uppercase job titles when they appear as part of an individual's official title:

• Steve Relyea, Vice Chancellor, Business Affairs.

Uppercase job titles when they refer to a position:

• We have an opening for a Senior Writer.

If you must abbreviate a job title, look for an entry in Acronyms and Abbreviations.

See also titles.

lectures, lecturers, lectureships

The title of a lecture should, in all cases, be written in quotes but not italicized. Lectures can be held, presented or given. The title "lecturer" should be treated as an occupational title rather than a formal title, and thus always be lowercased, even before a name.

Example:

• Nutrition lecturer Mary Smith.

Lectureships, often endowed or underwritten, enable the university to invite distinguished scholars to campus for a period of a few days to participate in seminars and to give one or more talks:

• The 19th annual Shell Biochemistry Foundation lectureship is funded by a grant from the Shell Oil Corp.

If you must abbreviate, see the entry in Acronyms and Abbreviations.

letter spacing

Use 1 space after a period in website copy.

Link Family (soon to be deprecated)

Use initial cap on both "Link" and "Family." "Link products" is also acceptable. Avoid using the lengthier "Link Family of products." The Link family is an integrated Web-based environment that provides authorized UC San Diego students, faculty, and staff with consistent and easy-to-use access to administrative information. See LinkFamily for more information.

links

Links in the CMS are indicated by underline and different color (automated through the stylesheets) and with a different color. They point users to additional information including:

• Websites
• Online documents
• Applications
• Email addresses

See CMS general guidelines for text links.

When you link to a document in one of these file formats, put the name of the application or format in parentheses at the end of the link:

• Link text (Excel)
• Link text (PDF)
• Link text (PPT)
• Link Text (Word file)
• Link Text (Zip)
• Link Text (map)

Listserv, list server

Use "mailing list" or "electronic mailing list" instead of the trademarked word Listserv to refer to an electronic discussion group that uses a mailing list program to distribute messages to all members' emails. UC San Diego uses Google to administer its electronic mailing lists.

log in (v.), log out (v.), login (n. or adj.), logout (n. or adj.)

Log in and log out are the preferred terms for entering/ exiting an application. Log in/ log out are used as verbs; login/logout may be either a noun or an adjective. Log in/ log out (verb).

Examples:

• Did you log in?
• When finished, don't forget to log out.

Login/logout (noun or adjective):

• If you forget your login ID, you can request it by email.
• And don't forget to click the logout button to exit the program.

Note: If your use of log in is followed by the word "to," then use "into":

• You can log into your email from home.

map links

Include the named location and a lowercase "map" enclosed in parentheses. Link the whole listing to the map location:

• Thursday, Oct. 10 in the Price Center, Ballroom A (map).

To find the map URL:  

1. Go to maps.ucsd.edu.
2. Use the Search box or browse categories to find the location.
3. Select the correct pin or location.
4. Click the small greater than symbol (>) at the top of the new window. This will open up location options.
5. Copy the location URL and paste it into your website.

money

See dollar amounts ($).

months

Spell out when using alone, or with a year alone:

• I was born in December.
• They emigrated in April 1943.

Exceptions can be made for calendar and event listings.

See Communications Editorial Style Guide.

nationalities

See race/ethnic groups, Communications Editorial Style Guide.

noon

Write "noon", not "12 p.m." or "12 noon".

numbers

In general, use numerals in web writing, since usability tests show they are easier to scan.

• If a number occurs at the beginning of a sentence, spell out the number.
• Spell out 1 – 9 in text, except when you want to draw attention to the number or when using a numeral makes the text easier to scan.
• With measurements (percentages, hours, etc.), use numerals.

• We only have a 4% return on investment.
• Jack slept for 4 hours.

In all cases, use judgment based on context. You wouldn't write "4 score and 7 years ago." 

See apostrophe.

offline

1 word, no hyphen. 

online

1 word, no hyphen. 

ordered lists

See bulleted or ordered lists.

PAC/PID

• PAC: Use "personal access code (PAC)" (lowercase except for acronym) on first reference, then use "PAC" in subsequent references.
• PID: Use "personal ID number (PID)" (lowercase except for acronym) on first reference, then use "PID" in subsequent references.

parentheses ()

Use sparingly or try to rewrite the sentence to avoid them.

• Use commas or dashes to set off incidental material within a sentence whenever possible.
• Place a period outside a closing parenthesis if the material inside is not a sentence (such as this fragment). (An independent parenthetical sentence such as this one takes a period before the closing parenthesis.)
• When a phrase placed in parentheses (this is an example) might normally qualify as a complete sentence but is dependent on the surrounding material, do not capitalize the first word or end with a period.

percent (%)

Use the symbol % when writing for the Web. The % character generally does not require a code in the CMS. Spell out "percent" in formal, literary, or non-technical writing.

• The professor said 40% is a failing grade.
• About 60% of the association's membership was there.

period (.)

• Use a period at the end of a declarative sentence: The book is finished.
• Use a period with initials: John F. Kennedy, T.S. Eliot. But, people referred to by their initials only do not take periods: JFK, LBJ.
• Periods always go inside quotation marks: She said, "Let's head for the pub."
• Use one space after a period.
• Place the period outside of a link.

phone number/ extension

See telephone number/ extension.

PID/PAC

p.m.

See times of day.

policy

In general, lowercase when you are not using a specific policy's official name:

• UC San Diego Professional Development policy
• UC policy
• Relocation policy

When refering to a policy summarize, don't restate. If you need readers to see word-for-word policy, link to its location in the online Policy & Procedure Manual (PPM) using the policy number and proper name:

• For more details, see PPM 395-9 Vacation Accrual and Usage Accounting

pronouns

See bias-free language University of Communications Editorial Style Guide.

punctuation

See apostrophe, colon, comma, ellipsis, em dash, en dash, hyphen, parentheses, period, quotation marks, semi-colon, special characters. See also the Punctuation Guide of the AP Stylebook.

quotation marks (" ")

Quotation marks do not require a code to display properly, however you can use “smart quotes,” which curve towards the word.

To add:

• Insert characters into CMS content.
• Code:
  • Left quote code (“): &ldquo;  
  • Right quote code (”): &rdquo;

Use quotation marks around the title of a book or other major literary or artistic work.

Use quotation marks to refer to a word as a word, or to indicate foreign words:

• The word "mediation" has several meanings.

Put colons and semicolons outside quotation marks unless they are part of the quotation.

Do not put quotation marks around page or form names in text when it is a link.

racial groups, ethnic groups

See race/ethnic groups, Communications Editorial Style Guide.

ratios

Use figures and hyphens: 2-to-1, a 2-1 ratio.

School of Medicine

The acronym is SOM.

See Also box, content related to department

Blink/TritonLink: available only in Blink/TritonLink, this left side See Also box allows the content editor to provide contextually related links to other websites, documents, applications, or Blink or TritonLink pages. 

• Use no more than 5 links.
• Do not use links that are siblings to the page in question (siblings show up in the left-hand nav already).
• Give the link the same name as the document or website it links to. If the name is too long, give the link a shorter, logical name, using an initial cap on the first word only.

semi-colon (;)

The semi-colon is often used to separate lengthy sentences. In online writing, it's best to simply write shorter sentences and use a bulleted list:

• He teaches:
  • "Your Autobiography," a UC San Diego writing class.
  • "Paragraphs 101," a composition class at Grossmont College.
  • Basic writing at Mesa College.

sexual orientation

See race/ethnic groups, Communications Editorial Style Guide.

Single Sign-On

Capitalize all 3 words and use a hyphen between "sign" and "on" when referring to the UC San Diego system. Spell with all lowercase letters when using "single sign-on" as a generic term for systems that require only 1 password.

slash (/)

Add one space after the slash:

• Payroll/ Personnel
• receipt/ invoice

Exception: If the words are short, don't space after the slash:

• in/out
• and/or

Social Security number

Use initial caps on "Social Security" only:

• Social Security number
• Social Security card

The acronym for Social Security number is SSN.

software titles

Capitalize but do not use quotations marks around titles such as MS Word or Windows. Use quotation marks for computer game titles: "The Sims."

Special Characters

The CMS allows you to insert special characters into your text with the appropriate character code. In the WYSIWYG menu:

Choose Insert > Special Character > and the character.

See character links for code.

• Ampersand
• Apostrophe (generic, left, and right)
• Ellipsis 
• em dash
• en dash
• Quotation Marks (generic, left, and right)

spelling

For word spelling and grammar, consult these references:

• AP Stylebook.
• Merriam-Webster online dictionary.

When the dictionary lists multiple choices for word spellings (e.g., "canceled" and "cancelled"), use the first-listed spelling. If Webster's provides different spellings in different listings, (e.g., "tee shirt" and "T-shirt"), use the spelling that appears with the full definition ("T-shirt").

The spell-checker in Microsoft Word uses a different dictionary, so double-check with the Merriam-Webster online dictionary if you aren't sure.

strong text

See emphasis.

tables

CMS users: When creating a table follow the guidelines on the "Kitchen Sink" page.

telephone number/ extension

General style:

858-555-1111
858-555-1111, Ext. 45555
800-888-8888, not 1-800-888-888
Ext. 45555 (not X45555, x45555, or extension 45555)

times of day

Always use numerals, except for noon and midnight. Use lowercase type and periods, but no spaces, with a.m. and p.m. Use an en dash for ranges. Examples:

• a.m., p.m.
• midnight (not 12 a.m.)
• noon (not 12 p.m.)
• 7:30 p.m.
• 7 a.m.
• 1–2 p.m. (See en dash for spacing.)
• 10:30 a.m. – 1:30 p.m. (See en dash for spacing.)

See also en dash.

titles, page titles, headers (H1, H2, H3)

General guidelines, including UC San Diego web page titles, capitalize:

• The first and last word
• Principal words
• Prepositions and conjunctions of 4 or more letters: With, From, Before, Toward, After, Although
  • Examples:
    • Questions to Ask During an Interview
    • Personnel Policies for Staff Members
    • How to Declare or Change a Major

Capitalize the first letter of each word in a hyphenated compound word, but only the first letter of the first word in a hyphenated prefix:

• Job-Seeker
• Non-employee

Capitalize words in parentheses after a title:

• How to File for Your Degree (Undergraduates)

Learn about using headings in the CMS.

tools

For pages that are overviews or instructions on how to use a tool (e.g., WebReg, Ecotime), add a link to the tool as high on the page as possible and alert the user if login is required.

Examples:

• See details below, or go directly to the MyDirectory tool.
• See details below, or go directly to the Class Lists tool (login).
• UC San Diego Job Bulletin: Overview.

underline

See emphasis.

URL

A Uniform Resource Locator (URL) is an Internet address. Plural: URLs. If a Web address falls at the end of a sentence, use a period after it.

user ID

Capitalize "ID."

username

1 word, no hyphen.

voice mail

2 words, no hyphen.

web, website

Lowercase web, website, webserver, webcam, webcast, webinar, webmaster. 

web page titles

See titles.

weekdays

See days of the week.

-wide

Do not use a hyphen in campuswide, systemwide, nationwide, worldwide. Do use a hyphen in these cases:

• UC-wide
• CSU-wide

years

• Use numbers, without commas: 1975.
• To indicate decades, use an "s" without apostrophe: 1990s. It was back in the '80s or 1980s.
• To indicate a range of years, use an en dash and this format: 2004–06 (not 1981/82 or 1981–1982).