JSU Web Brand Guide and Best Practices

The purpose of this guide is to ensure quality and consistency across the jsu.edu domain in accordance with the JSU Web Policy

General Guidelines

JSU uses the Cascade Content Management System (CMS) to manage its web pages. All JSU web editors should have a working knowledge of web browsers and site structure. They will receive training in the use of Cascade CMS before page editing is allowed.

All JSU web editors must participate in annual training and (re)certification for Americans With Disabilities Act (ADA) web compliance. This is required by the U.S. Department of Education Office of Civil Rights.

The use of proper grammar and correct spelling are expected on the jsu.edu domain. Proofreading of all site content is required before a page goes live. Ongoing inattention to website quality that results in repeated spelling and grammar errors and broken links is grounds for revocation of Cascade credentials.

JSU’s Web Team is happy to assist web editors with content editing and technical issues. To ensure faster response, web editors must use the Web Help Request form on the JSU Web Services web site. Requests are processed on a first-come, first-served basis. No web work will be performed until the request form has been filled out. No exceptions.

Site Structure

A departmental website is not a catch all for internal documents. It should be designed for the audience – the prospective student—first.  Sites should be lean, clean and easy to skim. Less is more.

Because our data tells us that more than half of our site traffic comes from mobile, JSU web sites should be designed for mobile first. Sites need to be easily navigable on mobile, and content should be minimal. Think bulleted lists, not dissertations.

Careful attention to site organization from the beginning can save a lot of work and headaches later. Think of the website as a streamlined filing cabinet. Make a place for things, and put everything in its place. Curtail clutter. Create folders that are logical. Remember that any name assigned to folders and files will be reflected in the URLs for the site.

Within the CMS, each page must be given a display name, title, description, and keywords. (Consult with Web Services staff about keywords)

Navigation should be streamlined. Ideally, a site’s left navigation should have no more than six “parent” folders.

Example:

Department of Emergency Management
Academic Programs
Student Resources
Frequently Asked Questions
Scholarship Opportunities
About the Department

Links

Never use “click here” or “this link” (or similar phrases) to indicate links. Instead, use text within the copy that defines the destination and use that text as the link text.

Example:

We offer eleven different degrees with twenty-nine majors at the master's level, the post-master's Educational Specialist degree with five majors, four graduate certificates, and a Doctor of Science degree in Emergency Management and a Doctor of Nursing Practice.

Page Content

Web content should be written in second person and at an eighth grade Flesch-Kincaid reading level.  Writing in second person tense makes the copy more appealing to the target audience. Writing at an eighth grade reading level makes it easier for our target audience to digest the content quickly.

Prospective students don’t come to your page in search of your mission statement. They seek specific information about attending JSU, quickly. If they don’t find that information immediately, they move on. School/department home pages should never be a regurgitation of mission, vision, values, and goals of the school/department, although this information can be included on an “about” page. The home page should quickly command attention from the user, help them to connect the dots to reach their educational goal, and end with a call to action.  

Examples of good calls to action:

  • Ready to Apply to JSU?
  • Have questions? Contact us!
  • Sign up for a mailing list/ enroll in CRM
  • “Downloadables” like JSU branded or authored eBooks or white papers that offer added value to the audience (good topics--  how to succeed in school, what careers are there in this field?)

To make our site ADA compliant and SEO friendly, we should strive to have most content in web page (html) format. PDFs should only be used when official, exact copies of official documents are required. PDFs are not easily read by screen readers; therefore, they negatively impact our ADA web compliance.

Duplication of content on multiple pages can result in JSU’s entire website being dropped from Google Search results. No two web pages on the jsu.edu domain should contain the same content. Instead, links should be placed where needed to offer content from another area of the jsu.edu domain to site visitors. There should never be two copies of the same file on our web servers. Violations will result in revocation of Cascade credentials.

Example:

Link to the Registrar’s site for graduation information instead of duplicating graduation information on multiple department websites; link to the Student Financial Services site for financial aid and scholarship information.

Naming Conventions

Files should never have spaces in their title. Place a dash or hyphen between words in a document title. Again, keep in mind that file names will be displayed in the URL.

Images

The right image can bring a web page to life. A poorly chosen or improperly sized or placed image can make a visitor flee a web site! Stylistically, JSU strives to use quality web images that tell our unique story. Photo selections should be people-based and reflect our diverse campus community. Images of our beautiful campus are also acceptable.  JSU has a great resource in our university photographer, who maintains online galleries. Schools/departments are strongly encouraged to work with the university photographer to plan and shoot engaging images for web sites, including professional head shots for faculty and staff pages.

To incorporate photos into JSU’s web pages, images must be uploaded to the content management system and linked to them from within the system. Never copy and paste an image into the CMS from another source, such as an email. This will result in a page load stall, and the web visitor will likely be forced to quit his/her browser to leave the site.

Ideally, images should be sized prior to uploading to the CMS. If no photo editing software is available offline, images may be sized within Cascade. Do not embed high-resolution images at full size. Image size requirements are visible within Cascade.

All photos must have alternative text. This should be a phrase that describes what is in the photo. Do not use the decorative image checkbox unless it is truly a decorative image (graphic element such as a border)

When creating graphics and/or images for your site, avoid overlaying photos with text or combining photos with text blocks in a single graphic whenever possible. This is not ADA compliant. Use graphics with text sparingly.

When resizing images, make certain that the image is resized proportionally. This prevents the travesty known as “Bert and Ernie” head.  Resizing proportionally is easy to do by clicking the “chain link” icon when resizing in the image editor within the CMS. 

Video

Content developed for JSU web distribution is copyright JSU and should state such.

Content to be embedded on pages within the jsu.edu domain must be approved by Web Services and Marketing and Communication prior to display.

No video will be embedded on the JSU.edu domain until it is properly captioned to ADA standards. Non-compliant content is subject to removal without notification.

For more information about ADA video captioning, visit the CaptioningKey website.

Compatibility

Content must be presented using standardized methods to ensure functionality across all devices and platforms (operating systems, browsers, desktops, phones, tablets).  Technologies that require additional players/software (Flash, Quicktimeetc) may not be used as they are not fully accessible on all platforms.  

Colors, Fonts, Headers

Do not use colored text in your body copy or choose any font other than the one expressed in the “font style” selection in your dropdown menu. Fonts are already set in our site’s style sheets. 

Do not change headers using the WYSIWYG font editor. Use the predetermined header and body styles (in the dropdowns)!

If you apply a header style to your text using the dropdown menu, do not also make your font bold or italicized.

Headers should be used as  way to rank sections of your page in order of importance. Never place a larger header farther down the page than a smaller one, as this is confusing for screen readers used by the visually impaired. 

Headers should be in title Case. Never all caps.

To maintain ADA compliance and consistency in page appearance, do not add links to headers.

There is rarely a need for a colon at the end of a header. 

Do not use all caps in your text or headers, as caps are harder to read.

Do not underline text in your body copy for emphasis. Underlining is reserved for links, which are formatted by our site-wide style sheet. If you need to emphasize a phrase in your body copy, italicize it. Bold text may also be used, but do so sparingly.

Doing It Right

The JSU Department of Emergency Management is a good example of a JSU web site done right. Its left parent navigation is clear and clean, and its main content is presented in short, easy-to-digest sections that are helped by the use of bullets and numbered lists. Links to the program information-- the most important information on the page-- are easily seen. Content is also written to and for the prospective student. There is no “fluff” on the page, making the entire page visible in two scrolls on a mobile device! There are three calls to action on the page, one in each section.

Content on the JSU website should adhere to the Jacksonville State University Manual of Style and Usage.