¶¶ÒõÂÃÐÐÉä

Overview of The Brand Guidelines

The following guideline provides an overview of updates to the ¶¶ÒõÂÃÐÐÉä Boulder web brand identity standards. The new web identity standards for ¶¶ÒõÂÃÐÐÉä Boulder are part of an overarching refresh to ¶¶ÒõÂÃÐÐÉä system brand standards for each campus. It is important to note:

• The update to the web identity standards in no way affects the use of print-specific, unit-based campus logos used for printed materials and communications.
• All print-based brand standards remain and can be reviewed on the Brand website.

The web brand identity standards must be used on all official university websites.ÌýThese include the following types of sites/organizations:

• ¶¶ÒõÂÃÐÐÉä Boulder colleges and schools
• Campus departments, units, labs
• Campus-recognized affiliates conducting official university business
• ¶¶ÒõÂÃÐÐÉä Boulder faculty research and/or professional websites
• Officially sanctioned ¶¶ÒõÂÃÐÐÉä Boulder student groups who want to use the ¶¶ÒõÂÃÐÐÉä Boulder brand (student groups approved by the Center for Student Involvement).

The ¶¶ÒõÂÃÐÐÉä Boulder web brand identity may not be used on personal websites.

Outline of the Web Brand Identity Standards

The web brand identity standards comprise four key areas:

• Header elements
• Footer elements
• Web font
• Color paletteÌý

The following provides more details of each:

Elements of the Updated Web Brand Header

• Campus header: This is where the interlocking ¶¶ÒõÂÃÐÐÉä logo will display alongside the campus-specific wordmark.
• Site name header: This is where your site name will display along with the affiliated major unit the site falls under (e.g., College of Arts and Sciences). The following shows an example:

¶¶ÒõÂÃÐÐÉä the Affiliated Major Units

A new element of the brand web header is the inclusion of the website’s affiliation to a ¶¶ÒõÂÃÐÐÉä Boulder major unit organization. Affiliated major units will be applied to the following types of websites:

• Department/unit (academic, program, certificate, residential)
• Academic support
• Faculty (professional)
• Research group/lab
• Support services
• Center
• Institute
• Service/resource/support department
• Events (college/department specific)
• Museum
• Publication
• Official student groups
• Official club sports

The following is the list of what is considered a ¶¶ÒõÂÃÐÐÉä Boulder major unit. Major units will not have a senior executive level affiliation applied to their site:

• Chancellor (executive level)
  • Advancement (major unit)
• Academic Affairs (senior executive level—Russ Moore)
  • Colleges
    • Arts & Sciences, College of (major unit)
    • Engineering & Applied Science, College of (major unit)
    • Media, Communication and Information, College of (major unit)
    • Music, College of (major unit)
  • Schools
    • Business, Leeds School of (major unit)
    • Education, School of (major unit)
    • Law, School ofÌý (major unit)
    • Graduate School (major unit)
  • Academic Support Units
    • Continuing Education, Division of (major unit)
    • University Libraries (major unit)Ìý
  • Academic Resource Management (major unit)
  • Academic Planning & Assessment (major unit)
  • Diversity, Equity & Community Engagement (ODECE) (major unit)
  • Faculty Affairs (major unit)
  • Research & Innovation (major unit)
  • Strategic Initiatives (major unit)
  • Student Affairs (major unit)
  • Undergraduate Education (major unit)
• Strategic Resources and Support (senior executive level—Kelly Fox)
  • Enrollment Management (major unit)
  • Finance & Business Strategy (major unit)
  • Human Resources (major unit)
  • Information Technology (major unit)
  • Infrastructure & Sustainability (major unit)
  • Institutional Equity and Compliance (major unit)
  • Integrity, Safety & Compliance (major unit)
  • Strategic Relations and Communications (major unit)

Elements of the Web Brand FooterÌý

• Link to your unit contact page, email address, phone number and/or address
• Be Boulder image
• University name: University of Colorado Boulder
• Copyright statement:Ìý© ¶¶ÒõÂÃÐÐÉä
• Privacy andÌýtrademark links:ÌýLegal & Trademarks | Privacy

Brand Font

The official brand font is Helvetica Neue.Ìý

Only the campus-supported Web Express platform has a web font license to use Helvetica Neue on all sites under colorado.edu. Subdomain sites can purchase their own web font license of Helvetica Neue or use the secondary (free) font.

The secondary approved brand web font is (website use only).

Subdomain sites are encourage, but not required, to implement Roboto for their web font. Roboto is a free font maintained by Google and you can add the font to your site with the code below:

Ìý

Brand Colors

As part of the web brand identity standards, we have outlined a suite of approved web colors. An important part of the color selection was the proper color contrast for accessibility and general readability. The combination of background, text and link colors have all been thoroughly tested and are in compliance with color contrast requirements outlined in our accessibility policy. It is important to follow the color guidelines exactly as they are outlined to meet the required color contrast.

Details of these colors can be found on the .

Co-branding

Units or organizations that have previously been eligible for co-branding exemptions are not exempt from following the above guidelines. These units are encouraged to use their logos in other ways on the site.

Other Considerations

Portals/Web Applications

Web applications, such as the campus portals, may add additional navigation or interactive elements to the local header to take advantage of design systems such as Google’s Material Design and create a cleaner user interface.

Examples of additional elements include hamburger menus, search, notifications and user account information.

We encourage you to reach out to the ¶¶ÒõÂÃÐÐÉä Boulder Brand team if you are implementing a campus web application.

Third-party Web Applications

In most cases, units that need to use a third-party web application for student-facing transactions must comply with brand standards. We recognize that most third-party applications have limitations on how to apply brand. TO

• Option one (preferred): Work with the third-party vendor to comply with guidelines as stated.
• Option two: If the third-party platform isn’t capable of following the guidelines as stated, you should reach out to the ¶¶ÒõÂÃÐÐÉä Boulder Brand team to help determine alternative solutions.

Note: In addition to complying with the guidelines above, all websites and web applications should clearly describe the name of the site/application and its purpose, following web content and search engine optimization best practices.

Procurement of third-party platforms is subject to brand review (including naming) to ensure compliance and a cohesive overall user experience across university sites and web-based applications.

Web Reading Habits

Keep in mind the ways in which web documents differ from printed ones:

• When people read copy on a computer screen, especially if they are browsing the web, they tend to skim rather than read more carefully, line for line and word for word, as they might if reading a printed piece.
• Readers tend to skip from one webpage to another, from one link to another, rather than reading a page from top to bottom.

Writing for the Web

Copy written for the web is most effective if it follows these general guidelines:

• Visitors to your site should know exactly whose site it is and what its purpose is when they view your homepage.
• Outline, organize, subordinate: Use links to take readers into deeper levels of a topic. Think of upper-level pages as summaries or abstracts to whet the reader’s appetite. Then use your links as a map of where they can go from there.
• Use subheads when your copy runs more than one screen in length, or break copy into more pages.
• Write short paragraphs and sentences (avoid complex sentence structures and jargon).
• Speak directly to the reader, where appropriate (the web is more personal and informal than a book or printed magazine).
• Spell out abbreviations and acronyms the first time you use them on each page, even if you’ve spelled them out on the home page. Think of each page as self-contained. Does it make sense if this is the one and only page on your website that someone reads?
• Use bold subheads, illustrations, listsÌýand other (quick-loading) visual elements to help communicate your main points.

• Because of the increasing familiarity people have with the web, it is now acceptable to use more informal language when referring to your website. Instead ofÌývisit our website atÌýÌýorÌývisit us on the webÌýatÌý, tryÌývisit us atÌý.
  Ìý

  ---

Capitalization in Websites

We use title case in all headings that function as headlines. If it’s styled as a heading, it’s in title case. These examples are from the Strategic Relations & Communications website:

• Events Calendar
• Social Media Guidelines
• Notes on AP Style

If the heading functions as a sentence, use sentence case, as in this example from Admissions:

• Come to ¶¶ÒõÂÃÐÐÉä Boulder and discover what you can be.

Use title case with words in the top and sidebar navigation menus, and call-to-action and information buttons:

• Campus Life
• Learn More
• Apply Now
• Next Steps

Style notes: Always capitalize the first and last words of a heading, and capitalize all words of four letters or more:

• Be Buffs With Us

Electronic World Names

E-world lexicon continues to change rapidly. For those of us in the editorial world, this fluidity of terms and the styling of those terms present a constant headache. The following words should be styled as you see here:

• email
• homepage
• internet
• login (noun), log in (verb)
• log off
• smartphone
• web
• webpage
• website
• Wi-Fi
• World Wide Web
• The University of Colorado Law School homepage and the law alumni page are used frequently.
• Since its inception in 1989, the web has spawned a revolution in communications, commerce and worldwide research capabilities.

Copyright on the Web

Just because something appears on the web doesn’t necessarily mean that it’s part of the public domain. Assume, therefore, that anything and everything is copyrighted by someone. Since 1989, published material—printed matter or web-based, including photographs—is considered copyrighted whether it has a copyright notice or not. A copyright is, simply put, the legal right of authors, photographers, etc., to control the use of their own creative works.

For more information, see the ¶¶ÒõÂÃÐÐÉäÌýBoulder web publishing policy.

URLs and Email Addresses

Although some confusion is possible when a URL ends a sentence and the writer adds the necessary period, most people who use the web will not be confused by this because web addresses are not allowed to end with a period or comma. Follow these guidelines for presenting URLs:

• Do not add punctuation to an email or internet address. If an email or web address won’t fit on one line, we recommend breaking the address after a forward slash, @, or a dot that is part of the address, without inserting a hyphen.
  • You can begin your exploration of ¶¶ÒõÂÃÐÐÉäÌýBoulder atÌý.
  • To select Wardenburg's Campus Care Plan or waive coverage, go toÌý
    .
• Avoid URLs that are particularly lengthy and complicated.
• Unless your website URL is case-sensitive, always use lowercase.
  • Not:Ìý
• It usually is not necessary to use boldface or italic type for URLs (although these are acceptable options). Treat them as you would phone numbers.
• If the URL seems awkwardly stuck in the middle of a sentence, try rewriting the sentence to allow for placement at the end.
• It is not necessary to include theÌýhttp://Ìýat the beginning of URLs or the forward slashes at the end. Most browsers automatically insert these for you. For URLs that start with something other thanÌýwww, use your judgment as to whether your audience will understand the absence ofÌýhttp://.