Graphics & Imagery
When telling the PBSC story, simplify web pages using fewer images where each image has a purpose and adds impact.
All imagery, whether in-house or stock photography, must be approved by the PBSC Web Team.
Best Practices
- Images must be saved as either a .jpg (preferred) or .png with a resolution of 72 dpi and image size should not exceed 2MB. Image width should not exceed 2500px (See Optimizing Images for Web)
- Do not use clip art or animated images.
- Images should be representational of our College’s diverse student, staff and faculty community.
- Avoid, when possible, adding images with copy or text (examples: flyers, infographics). This text will not show up on screen readers or translators for people who have visual impairments.
- Alt tag descriptions should be used for all photos and graphics. It should describe what is happening in the image. (Example: "Photo of PBSC students working in the chemistry lab")
Copyright Information
A photo model release form is required for photos that feature identifiable faces. The person in the image must sign the release form, granting permission to use the photo. (This includes teachers, students, etc.)
It is the responsibility of the website content owner to secure the necessary rights and licenses.
The Office of Communications & Public Affairs (OCPA) has a subscription to Dreamstime, as well as a number of in-house photography. Photo shoots may also be scheduled to assist with photography needs. You may request either of these services by submitting an "Image/Photography Request" ticket to OCPA.
Optimizing Images for Web
Large image files increase the load time for the page.
The goal is to have the highest quality images with the smallest file size (which will load more quickly, offering your users a better user experience and make a positive impact on search engine optimization).
- JPGs or JPEGs are preferred for photographs or complex images containing lots of colors, shadows, or details. It is also the preferred file format for the homepage banners and images.
- PNGs can handle transparency and are the preferred file format for logos.
There are two quick things you can do to properly optimize your images:
Save Images for Web
This can be accomplished by opening the image in Photoshop and using the “Save for Web” feature. (File > Export > Save for Web – You can then adjust the quality setting to achieve optimal image resolution and level of compression.)
Save Image Using the Right Dimensions
If you open an image in Photoshop and view it at 100%, you’ll be able to see the exact size it will be displayed. Reduce the image to its appropriate size for the purpose it’s being used.