Web Requirements

As a state entity, our content must be accessible to visitors using assistive technologies. Compliance with federal Section 508 standards and A&M System Policies is necessary for web-based intranet and internet information and applications.

Our sites must adhere to the following web coding best practices:

• Use semantic HTML to structure web pages
• Alternate text should be used for all images
• Caption all videos
• Do not use images or colors as sole conveyors of information
• Use tables for data presentation only

As you design, build and add content to your website familiarize yourself with website accessibility standards, best practices and code standards using the resources below:

• Web Content Accessibility Guidelines (WCAG) 2.0
• Web Accessibility Tutorials
• WebAIM (Web Accessibility in Mind)
• WAI-ARIA Overview
• Notes on Using ARIA in HTML

The following are baseline requirements for branding OIT websites or pages:

• The Texas A&M University System primary logo must be used and should link back to www.tamus.edu
• The OIT Color palette should be used unless alternative branding and/or colors have been created or approved by the Communications Department

Required footer links must be used; reference the www.tamus.edu footer to see which links are required

The typefaces are Open Sans and Arial.

The web font Open sans is available via Google Fonts. If the web font cannot be used, it may be substituted with Arial.

Ensure Body Copy is no less than 16px to ensure good readability.

Headings structure your content and help readers understand the document structure. It is important that the headings follow a logical order.

• Heading 1 headings should be used for the page title
• Heading 2  will be the main headings in a page
• Any subtopics of a Heading 2 would be a Heading 3 and so on

Note: Use HTML headings for headings only. Don’t use headings to make text BIG or bold.

Page Content

DO:

• Use real text rather than text within graphics or logos
• Use brand approved web fonts
• Use 4.5:1 contrast ratio between the text and the background

DON’T:

• Rely only on the appearance of the font (color, shape, font variation, placement, etc.) to convey meaning
• Use blinking or moving text
• Use an image to present text, if the same visual presentation can be made using text alone

Links

DO:

• Tell where the link is going using the page title and ensure the link makes sense out of context
• Use the same descriptive text for the same destination
• Check links often to ensure they are not broken; additionally, this can be viewed in your weekly Siteimprove report

DON’T:

• Use phrases such as “Click here”, “Read more”, “Continued” or “Visit our Contact Us webpage”
• Open a new window when linking within our site

Alternative Text

DO:

• Provide text alternatives for any non-text content
• Be accurate and equivalent in presenting the same content and function of the image
• Limit alternative text to about 125 characters

DON’T:

• Be redundant or provide the same information as text within the context of the image
• Use the phrases “image of …” or “graphic of …” to describe the image

Icons

When using icons, stay within the OIT color palette. The contrast ratio between icon and background should be no less than 4.5:1 if the icon communicates content and is not used for style or décor purposes. Additionally, refrain from effects like texturing or gradients. The icons should appear in one solid color and have a simple, visually concise appearance, like the examples below:

For brand consistency with images, please contact the Communications Department at TAMUS-OIT@tamus.edu for your specific needs.