Skip to main content
Campus Resources

Image Styles

Aerial view of CHHS Cupola, SAC Clocktower and Atkins Library

Banners are great when displayed between paragraphs to break up long instances of text. It's also a wonderful addition to the header of a page to showcase what the page is about in a quick and simple manner.

Sometimes a small image is hard to see, or you want the site visitor to see a large version of the image. Lightbox offers an easy way to display a small thumbnail of the image, which expands to full size when clicked on. This is wonderful when writing up documentation or when you need to show a user an odd image ratio that isn't already managed.

Aerial view of CHHS Cupola, SAC Clocktower and Atkins Library

Profile pictures are great for staff portraits or when an image is taller than wide. They work wonderfully when displayed to the right or left of text to highlight an individual or specific object.

Aerial view of CHHS Cupola, SAC Clocktower and Atkins Library

Many times a square image will do fine to showcase a specific object in an image. This format allows the image to be pleasing to the eye due to it's symmetry.

Aerial view of CHHS Cupola, SAC Clocktower and Atkins Library

Standard images tend to be what is used most on websites. It's simple to create, many cameras are already at this particular ratio and shows most of the image without the need for resizing or cropping.

Aerial view of CHHS Cupola, SAC Clocktower and Atkins Library

Typical wide format image, heavily used on the web to break up paragraphs in a long article or as stand alone images. Most carousels will use this for their image style due to it being wide but not too tall and still looking good on mobile devices.