All images placed on a page must include alt text which describes the content or purpose of the image.
Consider the experience of visually-impaired people who are navigating the page using software that vocalizes the content to them.
- If the image is used as a header, provide alt text that repeats the site or page section name. Alt text (which is required) is not to be confused with other image attributes such as title, caption, or description, which are all optional.
- If the image is a photograph, describe the subject of the photograph in alt text.
- If the image contains text, the alt text should include that text.
- If the image links to a web page, state the topic of that page in the alt text.
- If the image contains a great deal of data, ensure that the information is also available in text.
H30: Providing link text that describes the purpose of a link for anchor elements
H37: Using alt attributes on img elements
F30: Failure of Success Criterion 1.1.1 and 1.2.1 due to using text alternatives that are not alternatives
Learn how imagery can enhance your site in ways that communicate rather than confuse. Also included: copyright issues, image sources, and simple edits.
Watch the following 32:23 video for all the details. It will show you how to create a pleasurable user experience with high-quality, ethical image selection and placement.
You have an event or program, and you need to get the word out. Your choice of images, words, and fonts–and how you put them together–can have a powerful effect on the viewer. Learn the secrets of the graphic designers. They aren’t very difficult but can have a big impact.
Header images have specific size and color requirements, depending on their placement within the SCC website.
Main Home Page
The home page images are to be in full color.
Top Level Pages and Administration Sites
The front page header image of all top level pages and administration sites are to be in full color.
Administration sites (President, VPs, PIO).
Top level pages (About Us, Current Students, etc.).
Home page headers are to be 1440px wide by 400px high (with some exceptions for 300px high).
Home page headers consist of a Meta Slider (plug-in) of 4-6 relevant images. (See below for Meta Slider settings.)
All Other Site Headers
Services, divisions, departments, etc. have gold-tinted images on their front page and red-tinted images on all lower level pages.
Gold-tinted 1440px wide by 400px high on home page.
Red-tinted 1440px wide by 25px high on lower-level pages.
The name of the site in all caps Futura Bold, right aligned with the top navigation bar.
These headers consist of 3-8 images loaded into the WordPress Headers section and set to randomly rotate.
See Color for color adjustment settings.
Some Area and Department template pages pull the Featured Image identified on the page being linked to in the 3 Columns of Links section. Alternatively, you can create and upload images directly to the page you’re working on. Use the same gold or red tint as page headers.