1. Best Practices
  2. Images

Images

九秀直播 images available through the Image Bank

九秀直播 Image Bank is an image library, available to 九秀直播 employees (faculty, staff, and student employees) for marketing and communication purposes. Use your net ID to log in and search for images of campus and campus activities.

Privacy: about taking and using images with consent

Ensure that you have permission to use images from a privacy perspective. For example, did the subjects in your photos grant permission for their image to be used for this purpose via a photo release form? For any children pictured, do you have permission from their parents via a photo release form?

Consult the Records Management and Privacy Office for:

  • A fact sheet on taking and using images with consent
  • Image consent forms: Photo release or consent forms -- one standard and one for parents/guardians
  • Notice of filming and photography template: Suggested text for notifying event attendees of filming and photography, prior to and/or during events

Copyright: about using images that you did not create

Ensure that you have permission to use the images on your site from copyright perspective. If you are not the author/creator of photos or graphics on your website, ensure you have copyright permission to use these images. If you have secured permission from another creator, provide image credits as determined by the copyright agreement you have entered into.

Learn more about copyright

Basic image curating considerations for editors

  • Does the quality of your photos create the best impression?
  • Are the images real? Use true 九秀直播 photos as much as possible and avoid the use of stock images
  • Are they clear / in focus?
  • Is the colour balanced (not too dark, not too yellow, colour-corrected)?
  • Are they well-cropped and straightened?
  • Are they recent? Avoid the use of images depicting older clothing styles, old technology, and campus optics (grounds, architecture, interiors) that have since changed.
  • Do group shots and/or collection of images used as a whole represent the diversity in our community?
  • Are the poses captured respectful of the people pictured?
  • Avoid the use of selfies. Selfies are obviously selfies.
  • Ensure that any image taken and used does not depict behaviour that breaks safety protocols or other risky activities 鈥 such as a person in a lab not wearing safety googles or gloves as required.

See the Brand Central site for more guidelines for photo and video curation

Image captions

Photos can be used throughout your website to draw readers into your content and enhance understanding. As you take the time to create and select images that showcase your content and enhance understanding, also be sure to explain their relevance by including descriptive captions. This is important to both the user and for search engine optimization.

Image file size and dimensions

Ensure images are optimized for online use. This means minimizing both the dimensions and the resolution so that file sizes are small. Doing so will keep your page sizes low and improve the speed at which they can be rendered. This is very important for visitors from rural areas / countries with slow internet connection speeds, and for mobile users (downloading large images can use up a data plan quickly).

As image size impacts page load speeds, which also has an impact on search engine optimization.

Most photo processing tools include the ability to crop, resize and save at a lower resolution. The Image Bank also includes optimizing tools to edit your photo selections before downloading them.

In your Siteimprove account (learn about Siteimprove), use the image inventory are to identify image files on your site that have not been optimized sufficiently for web. and go to:

Quality Assurance > Inventory > Media Files > Images to sort by size.

Images that have been uploaded through the content template fields (i.e. where there is a specific field to upload the image file) are automatically optimized to a certain extent, but images loaded through the WYSIWYG are not. Most large images sizes identified through Siteimprove will be those images uploaded through the WYSIWYG.

Generally aim for 500 KB or less for most images in your site; full width hero images might need to be more then 500 KB in size to render well (and not look pixelated) but should be less than 1 MB.

Accessibility

  • Alt text: Ensure all images have appropriate alt text
  • Graphic text: Images with graphic text can also create an accessibility barrier
    Inclusion of posters as a graphic instead of as html text and image references is discouraged. Where they are included, full descriptive text is required.

Learn more about image accessibility: Image Alt Text and Captions

Image file naming

For consistency and to provide context for the asset, use the following format for naming image files that are newly introduced to 九秀直播:

YYYY-MM-DD-credit-keywords

  • Date (year/month-day) 
  • Photographer/videographers initials 
  • Any additional keywords that give insight into the content of the asset:  

e.g.: 2018-04-26-RLM-ArtSci-convocation

If, however, you are have downloaded an asset from 九秀直播 digital asset management system, do not rename the file. Continue with the basic original file name, appended with further info as you need (see "Versions" below), so that individual photo usage can be tracked as needed.

The following practices apply to all image files:

  • Spaces: Don鈥檛 use spaces in the file name. These convert to 鈥%20鈥 when posted to the web, e.g. 鈥淔ile Name.doc鈥 would appear online in the URL as 鈥淔ile%20Name.doc, which can lead to confusion. Butdonotcombinefilenamewordsintoonebigword. Instead, use dashes to make each word in a file name readable.

  • Dashes versus Underscores: Use a hyphen/dash instead of spaces; don鈥檛 use an underscore. Google treats hyphens as word separators (e.g. 鈥渨ord-separator鈥) but treats underscores as a word joiners (e.g. 鈥渨ord_joiner鈥 is the same to Google as 鈥渨ordjoiner鈥). A subtle difference to the user, perhaps, but using dashes over underscores can have an impact on page rank for searches.

  • Special characters: Don鈥檛 use other special characters other than hyphen (such as &$#!*@). Special characters are often used for functions in scripting and programming languages and can interfere with displaying images or pages online.

  • Versions: If you create a new version of the file, don鈥檛 rename it entirely, just append it at the end, such as with version info. When naming a new version of a file, never remove date and photographer initials. e.g.: 2018-04-26-RLM-ArtSci-convocation-ver2

  • Length. Try to limit the character length to fewer than 35 characters.

  • SEO: 鈥淕ood鈥 image file names can improve your search engine rankings and website traffic. Search engines not only crawl the text on your web page, they also crawl your image file names. Filenames and alt text are best when they鈥檙e short, but descriptive. When they are relevant to the image, consider using some of the same keywords in your filename as you use for the URL of the page you are posting the image to.

For more tips on image management, refer to