Web Guidelines & Standards

The header and footer of each website throughout the OTC system will be standardized and managed by The Office of Web Services. The header and footer navigation and standards are governed by three factors: website analytics, the college mission statement and web services best practices, all while maintaining a student-centered focus.

Ozarks Tech’s website has three standardized page layouts so that visitors have a consistent experience on each major page through the website. These key pages are:

1. Front pages (departments, key college pages, etc)
2. Team pages
3. Contact Us pages

Front Pages

• Each front page should follow the same content order: Image/video (if used), title, intro paragraph, icon buttons, social, bottom contact
• Each page should have between 4-6 icon bar links.

Team Pages

• Our Team pages are designed to display team images in two, three, or four column layouts.
• Pages should only list names, titles and phone numbers.
• If the individual does have a bio, a separate page should be created with the biography information on it.

Contact Us Pages

• Contact Us pages should follow the same content order: Title, map (if used), contact info, and contact form.
• Accordions for contact pages should only be used when encompassing more than one contact. 

Content managers should only use styles that are the default settings on all websites.

Black or other color backgrounds can hinder type legibility and present an accessibility obstacle for those with vision difficulties. The optimum background color for a page is white (#FFFFFF). The use of background textures by designers will often reduce page load speed as well as conflict with the visual appeal of the site.

Please review the Ozarks Tech Brand Guide for more information on wordmarks, brand colors, fonts, and image assets available.

The Ozarks Tech Digital Asset Manager features an extensive library of approved images for use by Ozarks Tech employees.

Browse Image Library

Additional image, photograph, or graphic requests must be submitted to MarComm using their request form. 

MarComm and the Office of Web Services have the authority, based on college policy, to remove any image, photograph, or graphic that does conform to brand standards, website publishing policy, or website guidelines. 

In some cases, an executed OTC College Media Release form should accompany photographs containing identifiable individuals destined for official college web pages.

Updates

Web Services can assist in the update of images on your website once you have requested and received them. Please note that if you plan to mass update images across your website or system-wide, please use the spreadsheet below to assist in the process. Once completed, it can be mailed to web@otc.edu and cc helpdesk@otc.edu.

Download Mass Image Update

The OTC website is built on a responsive platform. When you insert an image, it will adjust to the surroundings. However, ideal image sizes make the presentation and loading time more enjoyable for the visitor. If OTC Web Services designs the site on your behalf, please provide the full image. We will convert it to the proper size. 

Any images sent to us from a department or the college’s creative services department should be the full image. 

However, if you are placing the image on your page, use the general guidance below: 

• Slider Image: 1920px x 800px. The focus of this image should be on the absolute center of the image.
• Group image, banner image, announcement image (with right menu column): 650px X 450px(ideal) 700px X 550px (max)
• Banner Image (without right menu column): 980px X 450px (Ideal) 980px X 550px (max)
• BioImage: These are typically at an aspect ratio of a standard 5″ x 7″ photo. When sized down, ideally, they appear on the website as 300px X 400px images based on the responsive website display.

Below is a chart to help find the right image size. All image sizes are in pixels using width by height format.

When in doubt, send the full quality image to Web Services and we can edit it down to fit the page correctly.

If the college is marketing your area or department. The following are display ad sizes we may use. 

AdRoll
300×250*, 320×50*, 728×90, 300×600, 970×250, 160×600,

Google

300×250*, 320×50*, 320×100, 336×280, 728×90, 300×600

Geofencing

320×50*, 300×250*, 320×480, 728×90, 600×300, 720×240, 640×213, 640×160, 640×320, 480×320, 768×1024, 1024×768, 640×960, 640×360 and 160×600.

Facebook & Instagram

See: https://www.facebook.com/business/ads-guide?

• Minimum ad sizes. 

Internal Links

Internal site links can provide users with an opportunity to obtain additional information without overburdening the web pages. If the link appears in the very beginning of a paragraph, the visitor may leave in mid-sentence without reading the intended content.

Links should be used when needed and designers should avoid the use of “click here” terminology.

Third-Party Links

The college does not recommend linking to third-party websites from OTC unless they are directly related to another agency, institution, or service that benefits our students, faculty, or staff. No images should be used unless they are directly related to accreditation. The college will not authorize links to specific companies for advertising or marketing purposes to the college community.

Web services must approve all third-party links.

Visit detailed writing for the web guide

Like our college, our users are diverse. Site content needs to be accessible and useful to all of those users. OTC is committed to delivering accessible web sites and requires that sites comply with requirements outlined in section 508 of the United States Government’s Rehabilitation Act.

The OTC website has been developed in accordance with web conventions for accessibility. The following represent basic accessibility standards for the public websites:

• Add ALT tags for all images.
• If an image is a link, add a caption that also serves as a text link.
• Provide text transcripts for slideshows and videos with academic or instructional content.
• Include file size, type, and download times for large files.
• Keep pages light and fast-loading (under ~200KB).
• Optimize images and include their height/width attributes.
• Avoid GIF animations; use JavaScript sliders
• Offer alternative formats or contact info for online forms, and limit forms to ~12 fields.
• For charts/graphs, provide a text summary on the page or link to a summary.
• Make links descriptive, not “click here.”
• Keep content timely, accurate, concise, and easy to scan.

Follow OTC policies and the standards set by Web Services. The Office of Web Services provides ongoing support for the development of official college websites. Members of the Ozarks Tech community skilled in web design are always encouraged to work with the web team in blending their creative ideas into the existing format and standards.

An institution of higher learning has endless video opportunities. Events, guest lectures, concerts and interviews make up the fabric of web video content.

While the use of video on the college’s websites is encouraged, we require producers to follow a visual branding protocol that identifies them as products of Ozarks Tech (see below). No matter how wonderful the video may look and sound, it is the content that matters to the viewer. With that in mind, those producing videos must follow the college’s content protocols (see below).

Video of Non-OTC Individuals

Video recording of non-OTC individuals will require an executed Media Release form by those appearing in the video if it is to be used by the college.

High-Definition

All video should be shot in high definition (1280 x 720) to meet evolving web convention. Audio is an important component of a video and clear, crisp audio is essential (AAC codec).

Time Limits

Web videos are most effective when limited to no more than three minutes in length. Please consider editing the video content into several smaller segments to avoid longer videos.

Visual, Branding and Content Protocols

• The college logo must appear in the first frame.
• The HD logo currently being used must appear in the next frame.
• The title of the video or identification of who is appearing in the video must appear in the next frame.
• All individuals being interviewed must be identified (a narrow name bar at the bottom of their first frame is essential).
• The last frame must contain the college logo and web address. In some cases, a prior frame may contain web links to information about an event or website.
• The individual(s) appearing in the video should be engaged with the camera. They should be looking at the camera at all times unless they are being interviewed where interaction is required.
• The limited use of copyrighted material (video/audio) may be subject to limitations. The use of such material should be discussed with the Director of Web Services.

Note: All videos placed on any OTC website must either be hosted on an OTC web server or reside on an OTC social media account or video channel where the college has direct control to add, edit or remove them from the web.

OTC deploys various forms across its websites. All content managers are expected to use the internal forms system offered by Web Services. If another form system is necessary for a particular function, the department must obtain prior approval from Web Services before deploying it on the website.

Keeping sites fresh and accurate requires consistent updates, revisions and modifications. Sites should be built for simple, efficient management and evolution. Web management tools should be chosen based on the needs of the sites’ managers and contributors, not simply the web developers or programmers.