Web Standards

Policies and Guidelines

This document provides guidance and policies for the campus community to ensure consistency in the university’s online and digital communications. Due to the nature of online and digital communications, this document will be updated as needed to reflect significant technological advances and their impact on the university.

Web content authors at Missouri University of Science and Technology are responsible for the content of the pages they publish and are expected to follow the highest standards of quality and responsibility. These standards exist to facilitate professionalism, consistency, usability and standardized branding across Missouri S&T’s official websites.

Purpose of Web Standards

  1. Identity: University branding allows visitors to immediately recognize a website/page affiliation with Missouri S&T.
  2. Usability: Sites must be as usable as possible for the widest audience. They should be easy to use and navigate, easy to understand, and quick to load.
  3. Consistency: Web standards promote consistency. Consistency simplifies navigation of Missouri S&T’s web pages. Missouri S&T is committed to maintaining a high level of consistency across web pages and websites in all areas of the university’s web environment. The web environment includes mobile, tablet and other emerging vehicles for presenting and communicating online.
  4. Accuracy: The content of web pages must be accurate and up-to-date.

Scope

Any website, page or document hosted on Missouri S&T web servers that represents Missouri S&T and/or its academic and non-academic units, programs or departments is expected to comply with university web standards. In addition, all members of the Missouri S&T community – students, faculty and staff – are expected to follow the university’s Acceptable Use Policy regarding computer usage.

Definitions

Official Website/Page – Any website or page of an academic or non-academic department or organization that is a recognized entity within the university organizational chart and/or is funded solely by general revenue or is identified as an official entity by the Office of Sponsored Programs. These sites/pages primarily serve audiences which are external to the institution but may also include internal audiences. These sites must meet specific branding/marketing requirements as defined by this document (see the Required Elements section below).

Content Management System – A computer application used to manage work flow needed to collaboratively create, edit, review, index, search, publish and archive various kinds of digital media and electronic text. 

Terminal Four - Missouri S&T's content management system. Terminal Four is to be used for all official websites/pages (see Official Website/Page definition above and the Required Elements section below).

Google Apps – For collaborative, dynamic and interactive purposes, the use of Google Apps – specifically, Sites, Calendar, and Groups – may be additional web tools. Using Google Apps in such a manner that is an “internal to campus” tool between unit/team members and/or shared between other campus units/teams is an acceptable use as a multi-part solution to meet web informational and web accessible collaboration needs. Google Apps is not intended for official websites. All official websites are to be built and housed in Missouri S&T’s content management system (see Official Website/Page and Terminal Four sections above).

Web Addresses and Subdomains – Web addresses for official departments and offices follow this naming convention: name.mst.edu. Sub-department groups will be provided with a sub-directory of their official site and provided with the URL departmentname.mst.edu/groupname, or may create a site at sites.mst.edu with the URL sites.mst.edu/groupname.

On-site Shortlinks, Forwards, or Redirects - Redirects to on-site pages (within the mst.edu domain) will be considered per request using the pattern go.mst.edu/identifier or identifier.mst.edu. The chosen identifier must be available and unlikely to conflict with other university initiatives. On-site redirects may show a redirection visual. On-site subdomain redirects will only be granted for significant, ongoing university initiatives.

Off-site Shortlinks, Forwards, or Redirects - Redirects to off-site pages (outside of mst.edu domain) will be considered per request using the pattern go.mst.edu/identifier or identifier.mst.edu. The chosen identifier must be available and unlikely to conflict with other university initiatives. Off-site redirects must clearly show a redirection visual, and will not mask the mst.edu domain on their destination. Off-site subdomain redirects will only be granted in exceptional cases when:

  • The redirect points to a complete website for a club, group, organization, or initiative strongly affiliated with Missouri S&T, but that is not an official department or office, and
  • The website requires features or capabilities not offered by university CMSs such as TerminalFour or sites.mst.edu, or requires access by outside entities who will not be provided accounts on S&T's CMSs.
    - or -
  • An external vendor system requires a simple URL, but will not be masked to an mst.edu address

URL Masking - URL masking is the application of an mst.edu URL to a system housed outside of S&T at a different URL. URL masking will only be granted on a case-by-case basis, in collaboration with S&T IT, to internally-developed systems or external vendor systems.

WordPress – A blog environment used by the university to host publicly accessible personal or group journals, typically updated periodically. Blogs can contain commentary, description of events or other material such as graphics or video. Entries are commonly presented in reverse chronological order.

Universal Site Template(s) – The standard, pre-built template(s) for all official pages. This includes the following elements and formatting: the Missouri S&T header, universal and global navigation, CSS for fonts and links and the official university footer.

Content Author – The representative(s) in each department, organization or entity responsible for creating, adding, maintaining and updating website content.

Official version

  1. This online version is the official version of the Missouri S&T Web Standards and Policy. Please refer to this online version as it will be current at all times.
  2. University standards supersede any unit’s internal standards.

Required Elements (all official sites/pages already include these required elements as they are within the provided template)

  1. University Logo – The university logo must always links back to mst.edu. View downloadable logos.
  2. Standard Footer (supplied with the universal site template)
  3. Title tag (supplied on the main index page in Terminal Four, and with the site build within Documentum)
  4. Keywords (a word used by a search engine during its search for relevant web pages) Adding keywords (meta data) to your pages helps search engines find your information. Although the exact science behind the algorithms used by search engines to rank web pages is closely guarded, current best practice suggests that using specific keywords that match both the text content on the page and the page title will result in a higher page rank and more visibility for your website.
  5. Search – Terminal Four sites have the Missouri S&T Google search feature embedded in all templates.
  6. Logical URL – university domain names utilizing the .edu (URLs) are granted to an official Missouri S&T site by web and interactive marketing. All “official” sites are housed in Terminal Four/Documentum or on the Student Council servers for recognized student organizations and will be the only sites utilizing the distinct name.mst.edu address. Request a URL.
  7. Contact information – using generic office or department email, not personal email. 

New websites not created in the campus content management system will be required to obtain prior approval from Web and Interactive Marketing, and are required to comply with the above elements. Sub-branding identities may be granted on a case-by-case basis with approval from Web and Interative Marketing.

Policy

Accessibility
Missouri S&T strives to adhere to Section 508 of the Rehabilitation Act of 1973 and the Americans with Disabilities Act. Compliance with these acts will ensure that all Missouri S&T web pages will be accessible by users with disabilities.

Don't copy and paste content from other websites
Do not copy and paste content posted, owned and maintained by the university or on any of the official divisions, departments or organizations into your own pages. Make a link from your page to the page where this content resides. You can also check for the availability of reusable content in the “content repository” directory in Documentum. It is acceptable and encouraged to pull relevant reusable content into your page from the reusable content repository.

Commercial links
University pages may not link to nor advertise any commercial entities that advertise/sell products or services and may not accept sponsorship from commercial entities in exchange for advertising and/or links to commercial sites.

Credits
Credits related to the creation of or maintenance of a site (created by, powered by, built by) are prohibited. Specific exceptions may be allowed if the commercial link supports the university’s mission or provides an essential service to Missouri University of Science and Technology.

Content
Designated Content Authors for each official website are responsible for the content of their pages. Content must be up to date and follow all University policies, codes, and federal, state and local laws. Departments that do not have a designated Content Author will be asked to provide a single person of responsibility – so that every department has someone who will receive important information regarding their website or web system.

Copyright
Follow all applicable copyright laws. Copyright protects expression. All original expression is eligible for copyright protection as soon as it is fixed in a tangible form. Virtually everything you can upload or download on the web is protected by copyright. List of items not eligible for copyright include: ideas, facts, titles, names, short phrases and blank forms. Most media items (text, graphics, sound, photos, movies) are simple to download and copy into your site, however, you must have permission from the copyright holder to use them on your own pages. Under the Digital Millennium Copyright Act, the university is obligated to take appropriate action if it receives a complaint that a copyrighted material is being published over our network without permission of the copyright holder. By default, templates in the Terminal Four content management environment include a link to the DMCA.

Compliance
Compliance with web standards/guidelines helps to ensure a unified web presence and strong brand identity for the university. A strong and consistent brand identity and visual recognition are integral to the university’s recruitment, retention, fundraising, marketing and overall visibility efforts. Consequently, compliance with web standards/guidelines is critical to the success of the university.

Websites not in compliance with the standards/guidelines contained in this document will be notified by Web and Interactive Marketing or IT Web Support and provided with a list of modifications to ensure compliance. The content author/authors for the site in question will have 10 business days to implement the modifications and/or request assistance with the modifications. If the modifications are not completed within this time period, action may be taken to remove any portion, and/or all, of the site in question.

Contact IT Web Support with questions/concerns regarding compliance. If complications arise which cannot be resolved to everyone’s mutual satisfaction, issues may be escalated to the Executive Director, Marketing and Communications for review and arbitration.

Questions?

Contact: Electronic Marketing
573-341-7060
emarcomm@mst.edu

Printable document

Download a printable PDF version of Missouri S&T's web standards.

Best Practices for the Web
More than just an afterthought

Managing a website takes planning, thought and some basic knowledge of page layout. There's constantly content that needs to be updated, edited or replaced. Placing each piece of content takes strategy in order to provide a consistent user experience.
Your website reflects your organization

Keeping your site up to date and in line with Missouri S&T's branding and best practices is more than just following regulations. It's about creating a professional representation of your organization and the people who work to make the gears turn.
  • Your website will be the first impression that most people have of your organization.
  • A simple, elegant design creates a strong impression, while a cluttered layout can leave users confused and dissatisfied.
  • Photos can tell a story and create an emotional connection.
  • Creating an organized information hierarchy is an important foundation for any site.
Create an outline of your organization and its functions
  • There isn't a magic wand or automated way to redesign your information architecture, but the best place to start is by creating a logical, detailed outline of your organization.
  • Think of what your organization does and start organizing those actions into groups.
  • What questions do you receive the most? This can help you identify site content that is lacking.
  • Use an outline to pace the information. Building a website is like a marathon, not a sprint. If you put all of the content up front, users will get lost.
Identify your audience
  • Once you have an organized outline, identify your audience and structure information so that it is easy for users to navigate.
  • Put yourself into your users' shoes and think of the various tasks they may perform on your site.
Create a chart of how users flow through the site
  • Draw out a web of your pages and how they connect.
  • Experiment with different flows and go with the layout that best fits your audience.
  • In which branch of the chart does the information make the most sense?
  • Go from broad topics to more specific ideas, just as a tree goes from a trunk to its branches.
Examine your site structure
  • All site sections should be examined for misspellings, properly capitalized and spaced page section names and page titles.
  • The site tree should be logical, organized and labeled correctly.
Watch for duplicate pages, redundant folders, and orphaned pages
  • These lead to confusion for you and your users.
  • Redundant content can make it difficult to keep your content up to date.
  • Use a grouping system that becomes more specific the deeper you go in the tree (ex. What to Wear -> Clothes -> Hats -> Bowler Hats).
Eliminate redundancy
  • Look for content redundancy throughout your pages and trim it down to the information needed by your target audience.
  • Tightening down the structure of your content will make it easier for you to maintain.
Users read the web differently from books
  • Generally, users scan or skim websites, reading the shortest or boldest information first.
  • Creating a visual hierarchy of headings and descriptive text will help users flow efficiently through content
Pages are viewed on screens, not paper
  • Design pages as screens, rather than pieces of paper.
  • As users scroll down a page, each screen should guide them along a path of information.
Break info into chunks
  • Think of information as chunks rather than paragraphs (similar to how notecards can be used for studying - a title and description for a concept).
  • If your information gets out of hand, make notecards of the information chunks and pin them out onto a board as a way to show how all of your information connects.
Create a visual hierarchy
  • Put important information at the top, with each piece of content broken up into bullet points, headings, and short bits of text.
  • Use headings, images and bold text effectively. White space is a powerful tool.
  • For example – take of a piece of paper filled with text and compare it with one with a single word on it. Which one makes it more difficult to read all of the content?
Understand the flow
  • Users tend to focus on the top left corner of the page and scan across to the right corner.
  • These "hot spots" will generally be the first the users will see.
An endless path of information
  • After scanning across the page, users scroll down and repeat the process – which is why we use the idea of a screen, as opposed to a page, for content layout.
  • As long as you've followed a strong visual hierarchy, don't be afraid to have a page with a scroll bar.
Colors
  • The use of a lot of colors can be distracting to the user.
  • Missouri S&T has a selection of color palette options to choose from.
  • Use colors to accent and enhance your content. Color can draw attention to something or create a relationship with other content. Try to avoid mixing a lot of colors in a small area.
Image sizes

Making images look good on a website and load quickly involves a few simple steps. First, when you change the size of an image, make sure you don't stretch or squash it unnaturally. Second, use a tool to shrink the file size of the image without making it look blurry or pixelated. Third, adjust the dimensions of the image to fit where it's going on the webpage. Finally, add a short description to the image (called the alt description) so people who can't see it can still understand what it's about. If you want to know more, just click the button below.

Learn more

Stock photos

We offer a large and growing selection of professional photos, available on the Missouri S&T Photoshelter.

Fonts and text styling
  • Fonts are determined by the template, additional fonts should not be used in page designs.
  • If you are using non-standard font colors, this online tool can help to determine whether they meet ADA contrast requirements.
  • Do not underline headings or text. Underlining text or headings that are not links is ambiguous, since by default all links are underlined.
  • Do not use all capital letters (all caps) when typing out headings or paragraphs. All caps is handled by the website style. Normal case should be used so that when text is read by search engines and screen readers, it is treated correctly.
  • Use different headings sizes along with paragraphs to provide a visual hierarchy to your content. (Headings are used to categorize smaller text below them - just like the content on this page.)
Icons
  • Use the same style to provide a consistent look across your site. It is unprofessional to use dissimilar icon styles for related information.
  • Icons should have a specific meaning; do not use an icon to represent multiple meanings.
  • As with any design element, overuse can become tiresome and cause it to lose its original purpose.
Design

Follow the design principles of repetition, contrast, proximity and alignment.

  • Repetition: establish a method of laying out information (especially with tightly related content/pages) and stick with it.
  • Contrast: contrast can be created with whitespace, colored graphics, photos, etc.
  • Proximity: Group similar items together. Scattering them about reduces patterns and causes chaotic organization.
  • Alignment: Aligning content correctly creates simplicity by forming groups, lines and shapes that are easy for users to follow

We want to create a cohesive, visual identity for faculty, staff and student portraits online. The portraits used online represent the S&T brand. While we can’t force you to include professional portraits on your S&T website, we strongly encourage it.

Portraits give the department a personal touch

Most students want to see a portrait of the faculty and staff they will be interacting with. Adding a professional portrait will help you develop better connections with the people you interact with.

Portraits enhance faculty and staff biography pages

The faculty and staff directories and biography pages get a large volume of web traffic; it’s critical to include updated, professional portraits of all faculty and staff. Portraits can help your website look more professional and friendly, allowing your users to connect to a face and not just a name.

Portrait standards

A solid gray background is used for studio portraits. Please dress professionally for photographs. If you prefer to be more casual in your portrait, please do not wear non-department shirts, t-shirts or hats; stick to S&T gear only.

Don't use:

  • Selfies
  • Photos taken with a cell phone
  • Images of people backed up against a wall, horizontal images or images that have been cropped too closely to the subject's head
  • Photos of people outside, sitting at a desk, giving a presentation or in general doing anything other than looking at the camera and posing
  • Photos that haven't been updated in the past two years
Make content for your audience
  • Information, images and other content items are there to be consumed by your site audience.
  • Think about the information that people often ask, or that you provide when guiding someone through solving an issue.
 Avoid linking to pages with no content or pages labeled as “under construction” or “coming soon”
  • Keep pages in draft form until you have content finalized.
  • “Coming soon” is subjective to users.
  • Your site should provide information users want now and not focus on what you don’t have available.
Outdated content is useless
  • Old, time sensitive information can't be used by your audience and clogs up your site.
  • Trim your content and keep it focused so that it is easy to manage updates when they occur.
Organize your content
  • Grouping content by categories, likeness or relevance can help users find content.
  • Remember to group content by subject or action first, not by a user's role (student, teacher, etc.).
Tone of voice
  • When writing, try to use a conversational voice that is semi-formal and concise.
  • Speak to your audience as if you are in their shoes.
Linking emails and telephone numbers

To create a link that will start an email message to an email address, use these formats for the Link URL field:

  • mailto:username@mst.edu
  • To add a subject line use mailto:username@mst.edu?subject=Your Subject

To create a link that will open an app to dial a phone number, use this format for the HREF field:

  • tel:573-341-0000
Avoid ambiguous links
  • Avoid links such as “click here.” Users scan websites quickly for information and these links don’t tell users where they will be going next without reading the content surrounding the link.
  • Screen readers are unable to provide the context to users when reading “click here” making your site less accessible.
  • Good links should be:
    • Descriptive: identify the context for the user.
    • Concise: keep links short and simple and avoid jargon.
    • Action-oriented: provide a call to action to users. (ex. download guide or read more.)
Dead links
  • Periodically check the links on your site for functionality.
  • Ensure that your site links are working or you may end up with a site that users can't navigate.
It is your responsibility
  • When linking to other Missouri S&T sites, we encourage you to use the high level pages or just the home page. This will help to ensure that your external links stay active.
  • It is not the responsibility of other campus sites to host content, and you cannot guarantee that all content will stay in place or be kept up to date.
  • The web changes often. Sites change their audience, and pages may be restructured to fit the site owner's needs - and your links could be broken.