Brand Center

• Image alignment
• Image size
• Image shape
• Alt description

Whenever an image is uploaded into a blog post, an image properties window will appear. There are a few properties to take into consideration whenever applying an image to a post:

Image Alignment:

An alignment should always be selected when including images in your blog post. Setting the alignment on an image affects where it is positioned and how text flows around the image. It also creates a margin in between the text and the image:

Image Alignment Left:

Align left pushes an image to the left and allows the text to wrap around the image:

Image Alignment Right:

Align right pushes an image to the right and allows the text to wrap around the image:

Image Center Alignment:

Center alignment centers the image and does not allow for text to wrap around the image. Especially, in this case, it is important to place the image between two paragraphs:

Image Size:

You can set the size of an image to thumbnail, medium, large, and full size. Generally, the best options are either medium or thumbnail. Only choose large size if the width dimensions are 500px or less, otherwise, the image will be too wide to fit on the page.

For larger images, use fullwidth, which is done by setting the width of the image to 100% instead of a set pixel value. This will expand the image to fill the window and scale accordingly.

Image Shape:

The Allegheny style guide supports the standard rectangular image shape as well as a circle class shape.

In order to use this feature, use the following code:

Alt Description:

An alt image is a simple description of an image similar to a title and should be included with every image. If an image, for whatever reason, is unable to load, the alt description text will display in its place.

Alt descriptions are also important for accessibility reasons. For example, alt tags assist visually impaired individuals with understanding the contents of a website.