Web Visuals

Images and graphics help to accent a page and convey information beyond the written word, but you don't want them to detract from your text. Here are a few best practices to remember:

  • As a general rule, one visual per page is acceptable.
  • Choose a visual that compliments your text or reinforces something important.
  • If there is no clear functional need for a visual relating to your specific page, choose something that relates to the main site.
  • Try using it near part of your text that you want visitors to notice.

Visuals can be images/photos but they can also be graphics such as illustrations, charts or even infographics. Make sure to choose your visuals wisely.  read through the sections below for tips to help you find the right visual and make it work on your page.

Please note that the CMS will have pre-approved images you can select, if authorized. The use of other images or custom graphics will go through an approval process prior to page publication.

Resources:
 


Resolution & File Size

Most monitors will only display images at 72dpi. DPI is dots per inch. So if you took out a ruler and held it up to your monitor, each inch would display a maximum of 72 tiny dots of light. If you open a 300dpi image on your screen, your monitor is going to decide which 72 dots best represent the 300 dots that are really there.

It is better to use images set at 72dpi from the beginning so nothing is left to chance. Anything with a resolution higher than 72dpi will only increase file size and cause your page to load more slowly.

Try to keep image and graphic file sizes under 100KB. The areas of our site that would need files larger than that are not accessible to most users. In the event you are asked to provide an image for a large area such as a header or background, those files should be limited to 1MB or less.


Subject Matter & Cropping

The right image choice is critical, but image size and alignment can be equally critical. Most professional photographers will frame their images for a defined use, but most of web developers don't have the option of hiring a professional or buying their images. And even the best image may have to be sized for small or odd-shaped areas.

Most other imahes are likely to have unnecessary or undesirable aspects you will need to deal with on top of size constraints. Make sure to give considerable thought to what you need to show and how you should show it. Here are a few tips:

  • Vary the focal point so the subject isn't in the same place in every image.
  • Try to avoid arranging the subject in the center of the frame altogether.
  • Use proper alignment. Even if your image wasn't captured using the 'rule of thirds', you can still try to crop the image with that in mind.
  • Choose the proper orientation (portrait/landscape) and angle of view for the size of the space you have to fill.
    • For instance, if you have a thin, wide strip to fill, then you will likely need an image with a landscape orientation.
    • A typical telephoto camera lens is designed to bring the subject closer to you, to narrow the angle of view. An image with a narrow angle of view can't be used in small spaces or when you need to show what the subject is doing. Look for images with a normal or wide angle of view so you have more subject matter visible after cropping/sizing. 

Keep in mind that it is much easier to make an image smaller than it is to make it larger. Enlarging an image beyond its' original will lead to pixelation and distortion. If you need assistance, we are here to help.


Photo Use Guidelines

As mentioned above, the CMS will allow access to pre-approved image for authorized users. In the event you have permission to use other images for your page, the following information provides a guide to image usage and release.

Rights

CSN owns the rights to images taken by CSN faculty or staff as well as those taken by a contracted photographer. If you wish to contract with a freelance photographer, please contact us so we can ensure you receive the proper usage rights.

Photo Releases

  • Images of CSN locations and CSN employees do not require release as long as people captured in the image are not clearly recognizable.
  • Images taken in other public places, for editorial purposes, do not require release as long as people captured in the images are not clearly recognizable.
  • Images used for creative/advertising purposes, such as for a web page or brochure, may not require a release for locations, buildings or for general event coverage with a wide angle of view. At the point that any person is recognizable, a release will be required. When there is a doubt about whether a subject is 'recognizable', err on the side of caution and seek a release.
  • Posters with notice of image release are available for specific events in some instances. Please contact us to discuss options.
  • Classroom and student group releases can also be provided in some instances.
  • When taking your own photos, don't capture an image of a person and then ask if they will sign a release. Seek permission beforehand.
  • Marketing, communications or web personnel will evaluate whether images can be used based on content and/or release availability.
  • The individual release link is provided on this page.

If you are unsure about any of the above scenarios, please contact us.

IMPORTANT: CSN educates and hosts events for children and youth under the age of 18. When seeking release from a student, you must ask if they are 18 years of age or older. If they are under the age of 18, a verifiable parent or guardian must sign the release. Do not capture any image without this verification and release. If you know you will be at an event where children under 18 years of age will be present, you must arrange for verification of parent/guardianship before starting your project and then adjust your project to avoid capuring their image if full verification can't be achieved. 


External Image Use

Images from the Web
Most images found on the internet are not free to use. Do not use any image found online unless you can:

  • verify and document the images are royalty-free for commercial/creative purposes without the need for attribution
  • attain explicit, written or electronic permission to use the image
  • afford to purchase commercial/creative license for the image
Use of Stock Images

When at all possible, we prefer that you use images captured and licensed by CSN. We realize that is not always possible. If the subject matter or timeliness of the project requires a stock image, the marketing department will consult with you to approve stock images. You must verify and obey all usage limitations under the terms of the stock purchase. Royalty-free, attribution-free stock is recommended. Rights-protected stock should be avoided as it limits the ability to reuse or share that image.

External Image Requests
External media outlets, businesses or other entities may request permission to use CSN images. Please direct those requests to the marketing department or the communications office.