Web Style Guide
This guide provides style rules for AS&E web communications to help foster consistency across AS&E’s web presence.
The AS&E Web Style Guide is updated regularly to match current University Communications guidelines, web best practices, and users' needs. If you have tips or words that you think should be added here, please contact us at firstname.lastname@example.org.
- Always completely spell out an acronym and put the acronym in parentheses next to it before you use the acronym—this needs to be done on every page you use the acronym.
- Avoid abbreviating University of Rochester to "U of R," "UR," or "U of Rochester" on web pages, except where that use has been sanctioned.
- Avoid using informal abbreviations like prof. and info.
- Spell out the names of states when using them in a sentence.
- You can use the abbreviation when listing an address.
|bachelor of arts||BA|
|bachelor of music||BM|
|bachelor of science||BS|
|master of arts||MA|
|master of arts in teaching||MAT|
|master of public health||MPH|
|master of science||MS|
|master of business administration||MBA|
|master of science in nursing||MSN|
|master of music||MM|
|doctor of dental surgery||DDS|
|doctor of philosophy||PhD|
|doctor of musical arts||DMA|
|doctor of education||EdD|
|doctor of pharmacy||DPharm|
Terms designating students’ academic years are lowercased: first-year, sophomore, junior, senior, upper-year, etc.
In the interest of being gender-neutral, please use the term “first-year” instead of “freshman” when possible.
- First-year student (adjective)
- Less commonly: first-year (noun): A group of first-years convened on the quad.
- The phrase “first year” (no hyphen) refers to a year, not a student: First-year students participate in orientation during their first year at Rochester.
In general academic departments and administrative offices should not use ampersands as a part of their formal names.
Do not replace the conjunction “and” with an ampersand in text, unless the ampersand is used in an official name. Ampersands can be used in top and side navigations to save space.
- Lists of anchor links should be listed in alphabetical order.
- FAQ anchor links should be grouped into categories if there are more than six FAQ items. FAQ categories should be listed in alphabetical order.
Always identify the type of attachment when using a link:
- Capitalize the first letter of all bullets.
- Do not include punctuation at the end a bullet if it is not a complete sentence.
- You may, but are not required to, include a period at the end of a bullet with a complete sentence.
- Every bullet in a list should be structured the same way.
- Every bullet should be a sentence fragment or every bullet should be a complete sentence — do not mix and match.
- Bullets should not be longer than two lines on a page.
The University as a whole has adopted a down casing style, which means that we always err on the side of lowercasing words. This is because uppercase letters force readers to take a slight pause, which in turn reduces usability. It also helps to ensure consistency across all our sites in terms of capitalization.
The University follows the Chicago Manual of Style for casing. Please refer to the links below for information regarding specific items:
- Colored text should only be used to indicate a link.
- The link color should be distinct and only used for links.
- Always use the format “course number: course title” when the course number and course title are together.
- AAS 106: The Making of Modern Africa
- AAS 106 The Making of Modern Africa
- AAS 106 – The Making of Modern Africa
- Whenever possible, use both the course number and course title when referencing courses.
- Specific dates should be formatted: month date, year or day, month date, year.
- The events of December 7, 1941, will long live in infamy.
- The applications are due on Friday, January 25, 2019.
- Do not include a comma when only using the month and year.
- She graduated in May 2007.
- Do not write the date as an ordinal number (1st, 2nd, 3rd, 4th etc.).
- December 7, not December 7th
- Always spell out the full name of the month – December not Dec.
- Time should be written as figures except for noon and midnight.
- Do not include ":00" for on-the-hour times, even in ranges (Office hours are between 10 a.m. and 1:30 p.m.).
- Use a colon to separate hours from minutes: 3:30 p.m.
- Write a.m. and p.m. in lowercase, with periods between the letters.
A double major refers to someone having more than one major as part of a single degree (a BA or BS, for example). It can be used as a verb (“Sakhile is double-majoring in economics and political science and will graduate with a BA degree”) but the verb form should be reserved primarily for colloquial uses.
A dual degree refers to someone having more than one kind of degree from the institution at the same time. A student receiving a BA and a BS is a dual degree student, as is someone getting a BA from AS&E and a BM from the Eastman School.
Do not use “dual major,” which is an inaccurate conflation of “double major” and “dual degree.” Not all students who double major receive dual degrees.
- Email addresses should always be spelled out completely.
- Email addresses are always lowercase (email@example.com).
- Always use University of Rochester email addresses for contact information. Never use Gmail, or other personal email addresses.
- When using the WCMS, use heading 3 for content headings and headings 4 for content subheadings. Page headings are automatically formatted for you.
- If you are not using the WCMS, you should still be using proper HTML headings tags. Heading 1 should only ever be used once on a page for the page title, and then heading levels should follow the same stucture you would use in a written outline.
- Always capitalize the first word.
- Capitalize any subsequent words unless they are articles, prepositions, conjunctions or musical modifiers (flat, sharp, etc.).
- Record-Breaking Turnout
- Bed-and-Breakfast Options Near Rochester
- G-flat Major Scale
- If the first word is a prefix or could not stand by itself (anti, pre, etc.), do not capitalize the second word unless it is a proper noun or adjective.
- Pre-medical Students
- Anti-American Movement
- Post-doctorate Position
- Capitalize the second word in spelled-out numbers and fractions.
- Two-Thirds of Students
- Seventy-Fifth Avenue
**These rules are for headings and titles only. When writing in text all hyphenated words should be lowercased unless they are proper nouns or adjectives.
Homepage image sizes:
- Slider images:
- Extra large: 1470 px by 534 px
- Large: 1280 px by 569 px
- Medium: 1024 px by 576 px
- Small: 640 px by 426 px
- Feature image: 700 px wide
People/head shot image sizes:
- 200 px by 240 px
- 300 px by 360 px
- 400 px by 480 px
Sub page image sizes:
- Full width: 900 px wide
- Floated image: 400 px wide or less
Avoid or limit jargon. The best way to test this is to have your content reviewed by someone outside your discipline to see if they understand everything.
- Lowercase titles unless they immediately precede the name.
- George Washington was the president
- President Washington
- When a civil or military title is used before a last name, it should be spelled out. With full names, the title should be abbreviated. Do not use title on second reference, except in quoted material.
- Gen. William Fischer
- General Fischer
External links (links to pages outside of your website) should only be in body content and not in the top or side navigation menus.
We recommend leaving the link target as "None". Most users expect links to open in the same window so it can cause confusion when a new window opens and they can’t use the back button. Savvy users will know that they can control how the link opens if they want it to open in a new window. The only exception to this would be if the user needs to keep their place on the existing page.
"Click Here" Links
Using “click here” makes the documents or webpage you are linking to less useable to readers. Instead try to hyperlink the name of the documents or webpage, or hyperlink the whole phrase.
- Instead of “you can apply to Rochester by clicking here” try:
- Apply to Rochester online!
- Instead of “to see a full description of services click here” try:
- For more information about our services, check out the Complete Service Description (PDF).
- Instead of “click here to register” try:
- Register online through our secure system.
If a link is broken it should be updated or removed. It is never acceptable to use strikethrough to identify a broken link.
- Numbers between one and nine should be spelled in sentences.
- Numbers 10 and above should be figures in sentences.
- If a sentence or paragraph has numbers in the same category they should be treated alike.
- There are 20 graduate students in the biology department, 5 in philosophy, and 17 in mathematics.
- There are twenty graduate students in the biology department, five in philosophy, and nine in mathematics.
- All of the above rules also apply to ordinal numbers.
- This is the third time I've told you.
- The department is celebrating its 40th anniversary.
- At the beginning of a sentence, all numbers are spelled out.
- Five years from now, the project will be complete.
- Two thousand and fifteen was the start of a new area of web writing.
- Include commas in numbers over 999 to make them easier to read (e.g., 10,000).
- The number preceding the word percent or the symbol (%) is always a figure.
- Only use the percent symbol in tables, otherwise spell out the word.
- Of the people in attendance, 3 percent were under the age of 18.
Always put the area code in parentheses and dashes between the numbers: (585) 555-5555.
- Quotation marks should only be used for quotes.
- You should bold words for emphasis and should italicize titles of works.
- Commas and periods always go inside of quotation marks (single or double).
- She said, "Please repeat that."
- Question marks and exclamation points go inside quotation marks when it applies only to the quoted material.
- He asked, "How long have you worked here?"
- “Couldn't she just say, ‘nice job’?”
- Single quotation marks should only be used to enclose quotations within quotations.
- “Don’t be ridiculous,” said Henry. “The song goes ‘eyes and ears and mouth and nose’ not ‘ears and eyes and mouth and nose’.”
- Schedules should be listed from earliest to latest.
- The date(s) should always be the first thing listed, followed by time.
- Dates should always be spelled out unless they are listed in a table
- Always spell out the full name of the building, if listed. (Use Rush Rhees Library, not Rush Rhees or RRL)
Do not double space after periods. The system automatically uses the correct amount of space after a period.
- Tables are particularly useful for “if, then” sentences, comparing numbers, and displaying schedules.
- On the web, the best tables are simple.
- Do not use horizontal scrolling (most users never notice the scroll bar).
- If possible break up large, complicated table, in to smaller, more specific tables. This will be easier for tablet- and phone-sized screens.
- When it comes to formatting tables:
- Don’t center text in a table (centered text is harder to read)—simply flush left, and leave the right ragged.
- Use shading for alternate rows to improve readability.
- Always italicize titles of works.
- Use italics for the titles of art exhibitions.
- The Dimensions in Pop exhibition will run through March.
- Exhibition, not exhibit, is the preferred term for a public showing of art and other creative works.
Underlining should only be used for links so as not to confuse the reader.
For a complete word list see the University Style Guide.
academic degrees - Degrees are always lowercased. (bachelor of arts degree, bachelor's degree)
academic departments - Names of departments are capitalized only when using the full formal name, or when the department name is the proper name of a nationality, people, or race. Do not abbreviate to "dept." or use an ampersand to replace the word "and" (Department of Biology, biology department, Department of Art and Art History)
advisor - use the "advisor" spelling when referring to an advisor at the University
arts and sciences - In text, arts and sciences should be all lowercase. Sciences is plural in arts and sciences.
Arts, Sciences & Engineering - Do not refer to Arts, Sciences & Engineering as “the College of Arts, Sciences & Engineering.” When abbreviating always use AS&E.
buildings - Capitalize building names; can omit "Hall," "Building," etc. on second reference.
campuses - Capitalize campus when using a specific campus name; lowercase otherwise. (River Campus, walking around campus)
center - Capitalize as part of a full official name; lowercase otherwise.
College, the - This term should only be used on administrative pages or when referring to administrative offices. The word "the" before "the College" should always be lowercased unless "the" is the start of a sentence.
courses - Course names are capitalized. Course numbers are all caps with no periods.
email – Lowercase, no hyphen.
faculty – The word faculty is always lowercase. Faculty titles are lowercase unless the title precedes a name.
library, libraries- Capitalize as part of a full official name; lowercase otherwise. When talking about the River Campus Libraries, libraries should always be plural.
office - Capitalize as part of a full official name; lowercase otherwise.
school - Capitalize as part of a full official name or as an abbreviation for the official name; lowercase otherwise.
semester - Semesters are lowercase.
staff – The word staff is always lowercase.
student – The word student is always lowercase.
the - Never capitalize the word the in running text unless it is part of the formal name or at the start of a sentence. (the Institute of Optics, the School of Arts and Sciences, the School)
University of Rochester - When "the" precedes "University of Rochester" or "University" in running text, it is not capitalized. "University," when referring to the University of Rochester, is always capitalized.
upstate – One word, lowercase.
Writing for the Web
- What would I like people to do as a result of the communication?
- Who needs this information?
- When do they need the information?
Determine your “key messages”
- Key messages are the information that drives your audience toward your desired goal.
- Is there a specific time and date that something is occurring?
- Is there a place (physical or virtual) that they need to go?
- Are there one or two elements that will motivate your audience to do what you want?
- Is there something they need to know to complete the task?
When to include additional information
Generally there are three cases when you might need to include information that does not drive your users toward your desired goal.
- Background information—explaining cause/rational
- Contact information
- Answering anticipated or frequently asked questions
Web content is a conversation. Use conversational style, including “you” and “we” in your copy. This draws your reader into the conversation and helps them retain information.
Make it short. Then make it shorter by cutting unnecessary words. Here are some other tactics to fine-tune and tighten up your sentences:
- Write in the active voice (most of the time)
- Use plain language
- Example: “ask” instead of “inquire,” “buy” instead of “purchase,” “use” instead of utilize”
- Use verbs for action instead of nouns
- Example: “He denied” instead of “He issued a denial”
- Remember parallelism (humans like patterns)
- Put key messages first (what journalists call the “inverted pyramid” style)
- Avoid overly long or clever page titles, section headings, etc.
Answer your site visitors’ questions. For every topic on your site, think about what people come wanting to know about that topic. Then think about how to give them that information as clearly and concisely as possible.
You can encourage further use by including clear calls to action. For example:
- Apply now
- Contact our faculty
- Schedule a visit
- Subscribe to our newsletter
- Follow us on Twitter
Think about the questions your site visitors have. Be sure to answer them, while using tone and style to engage your site visitors.
Also, keep in mind how they access your content, from desktop computers to mobile devices.
Remember: Web content is a conversation. When online, people tend to skim and scan in order to find and understand the information they need.
To make your text more scannable:
- Break your text into short sections with clear headings
- Start with key messages (i.e., “front-loading” the content)
- Write short sentences and short paragraphs (a one-sentence paragraph is fine)
- Use lists and tables
- Bulleted lists for items or options (in general: limit to 7+/-3 items per list)
- Numbered lists for instructions
- Write and insert meaningful links
- Illustrate your content (with photos and captions)
- Alphabetize lists of staff names and anchor indexes
Regularly review and update your web pages. Out-of-date or incorrect web content frustrates users and reflects poorly on the University.
For some web pages, a bi-monthly or quarterly review process is enough. Other web pages require more frequent revisions.
Contact our team to learn about updating and maintaining your web pages’ content using content templates and editorial calendars.
As a top-tier research institution, the University strives to maintain a voice that is smart and professional, yet engaging and creative. Your tone will vary slightly depending on the outlet or platform (e.g., administrative web pages versus Facebook posts).
Contact the web content coordinator and web writer to develop an appropriate voice for your department and/or social media platform.
Avoid or limit jargon. The best way to test this is to have your content reviewed by someone outside your discipline to see if they understand everything.
In general, avoid or limit content that moves (e.g., blinks, scrolls, rotates, etc.). Movement on web pages is often distracting. It also decreases readability and accessibility.
Avoid or limit hovering capabilities on your webpages. The hovering feature doesn’t generally work on mobile devices, such as smartphones and tablets.
Our audience is increasingly using mobile devices to access web content. These smartphones and tablets vary in screen size. Responsive web design (RWD) helps address reading on mobile devices, but our content still needs to be direct and efficient to benefit the user first.
Web accessibility means that people with disabilities can use the web. These disabilities can include visual, auditory, physical, speech, cognitive, and neurological ones.
By following the best practices of web writing (outlined above), your content is on its way to being web-accessible.
- Preferred: Lato (https://www.google.com/fonts/specimen/Lato)
- Also acceptable: Myriad Pro and Arial
Primary Pallet – Blue
- Primary color – #0D47A1
- Accent blue light – #90CAF9
- Accent blue medium – #2196F3
Secondary Pallet – Yellow
- Secondary color – #FFD600
- Fallback color – #FFEA00
Text Pallet – Black
- #000000 (icons)
- #48484A (main text)
- #8C8E90 (secondary text)
- #C4C6C8 (rules)
- #E2E3E4 (shading)
- The University of Rochester logo should be on the upper left or right hand side of the screen.
- The University logo should remain in its original dimensions.
- To download the logo visit: http://www.rochester.edu/creativeservices/graphicstandards/logo.html
- To ensure you have the most recent version of the logo, please download it from the creative services site every time.
Alt-texts: The Ultimate Guide—Everything you need to know about alt-texts, including when to use them and how to perfectly craft them.
Eye-tracking research shows that people scan a web page in an F-shaped pattern. This is the dominant reading pattern. That’s why we must front-load our content and use section headings and lists to help our readers find what they need quickly. Read more>>
Nielsen Norman Group's top ten mistakes in web design:
- Bad Search
- PDF Files for Online Reading
- Not Changing the Color of Visited Links
- Non-Scannable Text
- Fixed Font Size
- Page Titles With Low Search Engine Visibility
- Anything That Looks Like an Advertisement
- Violating Design Conventions
- Opening New Browser Windows
- Not Answering Users' Questions
Big, complicated words take longer to read and are harder to understand. You can often find short, simple words that make your content more readable.
This is not “dumbing down” your content. Plain language respects your busy site visitors’ time. It also helps make your site content accessible to readers of all levels.