Before an image is uploaded for inclusion in digital media, it should be optimized for use on the web and with mobile devices using an image editing application, such as Adobe Photoshop or Pixlr (a free, web-based image editor); and meet the requirements provided below.

Requirements

• RGB Color Space
• 72 DPI Resolution
• JPG (quality set to 80) or PNG-24 File Type
• Maximum Width: 1,200 Pixels
• Contain Alt Text

Full-Width Scaling

By default, any image inserted into the content area (body field) will display at 100% of the width of the column in which the content area appears, regardless of how wide the image actually is. The maximum width for a page's content area varies depending on the page layout:

Content Area Maximum Widths

• 3-Column Layout = 600 px
• 2-Column Layout = 900 px
• 1-Column Layout = 1200 px

Size and Position Options

An image's size and positional behavior can be controlled by adding CSS classes to the image tag (<img>) in the HTML.

• Percentage Width: proportionately scales an image relative to its container's width.
• Float: allows text to wrap next to an image. By default, text starts on a new line below an image.
• No Scale: disables scaling/resizing behavior of images so that they display at their native size.

Page Image Field

If an image is added to a item's Page Image field, it will appear below the headline and above the body content surrounded by a gray border. Images used in this manner should be 570 x 300 pixels. A caption may be added using the Page Image Caption field.