Image band on front page

Quick reference: Banner images are only displayed on the home page and are editable with YSM or ITS-WS assistance. Up to 15 images can be used by rotating each image with a browser refresh; only one image can viewed at a time (no collages or montages). This gives the organization space for spectacular images.

image editable with assistance by YSM-IPC

The banner image is the focal point of your website's homepage and should visually represent your day-to-day activities. We recommend using high quality, professional images to best showcase your organization. The image must be a single photograph (or result of medical imaging or microscopy). This excludes collages, illustrations, and photographs with text overlay. An optional “about” link can be placed on the image, which takes users to a page with the full image (not horizontally cropped) and more information about the image. This is especially helpful when using abstract or slide imagery.

Selecting the best imagery — visually appealing at the correct aspect ratio — can be a difficult task. To help facilitate the process, YSM-IPC partners with template users to discuss options and assist in selecting or acquiring the best imagery.

YSM-IPC can help with setting up professional photo shoots to develop content for your image banner. Read more here.

 

design specs
The image band is 130 pixels high by 768 pixels wide on the front page of an entity or subsection site. The banner does not appear on internal pages. The banner image cannot be separated into multiple images (collage), but must always be one image. To provide variety, up to 15 images can rotate in the space by clicking refresh on the browser.

“About the image” page

The banner image provides space for spectacular photos that represent your organization. Some of the most interesting images are abstract or similar to the example above from the Department of Immunobiology — microscopy photos. However, the image content is not typically apparent. To provide site visitors with an explanation of the image, an “about” link is available on the banner image, which links to an “About the image” page. This page contains explanation text, the uncropped image and arrows to navigate to other banner image explanations.

The explanation text should be written so that both lay visitors and experts can understand the content of the image. In addition, the navigation arrows at the bottom of the “About the image” page are in a fixed location and the explanation text should never extend over or past the arrow space. However, you can link the explanation over to a more detailed article. Refer to the style guide for more information.