Images

Images help you create a rich visual experience that lets visitors get up close and personal with your content.

Images in your CMS content library only appear in your guide after you attach them to a container, like an Item or Exhibition.

To speed up your image upload process, save all files to a single folder on your desktop or shared drive. You can upload images in bulk by dragging and dropping files from the folder directly into the Images page in the CMS—just remember to crop each image and add alt text.


Image Fields

  • Image: A PNG or JPG file.
  • Alt Text (Alternative Text): Translate an image’s purpose, context, and key visual information into words. Alt text does not appear as text in your guide, but is read out loud by a screen reader to improve or replace the experience of seeing the image in context. For more, see Image Alt Text.
    • Example: A bronze globe covered in carved constellations rests on a blindfolded reclining figure on a marble base.
  • Caption: At a minimum, identify the content of the image and meet your organization’s legal requirements. You can also provide context to draw the connection between this image and other guide content. When you tap an image to make it full-screen, the caption appears below the image. The caption appears everywhere the image is used in your guide. For more, see Image Captions.
    • Example: Paul Manship, Celestial Sphere, 1934
  • Allow Use in Bloomberg Connects Social Media: Indicate whether Bloomberg Connects can use this image on Bloomberg Connects social media channels. Posts will be shared with you for awareness before going live and will be credited, where possible, based on information provided in the CMS. For more, see Social Media.

Image Display Formats

There are three image display formats in the app: hero, thumbnail, and full screen. Consider cropping images to create the best hero and thumbnail display.

  • Hero: The rectangular, landscape image that appears at the top of a content screen.
  • Thumbnail: The square image that appears in the context of the map, an Exhibition or Tour, or in the related content section.
  • Full screen: The uncropped image that appears when a user taps the hero or thumbnail.

Cropping an Image

By default, all new images are resized to fit within the bounds of the display frame. Usually, this results in a smaller image with padding on the sides.

To ensure consistency across guides and to optimize each guide's display, whenever possible, images should be cropped to fill the two display formats: thumbnail and hero. You can adjust how the crop is applied so the image preview highlights the part of the image you want visitors to see first.

Cropping the image in the CMS does not alter the original, uncropped, image. The uncropped image is always available when a visitor taps a cropped image to display it in full screen.

Steps

  1. When adding or editing an image, at the top of the Add Image or Edit Image form, click the More Actions icon, then select the display format you want to edit (e.g., Edit Hero Preview).

    Adjust the selection area, then click Apply to preview the changes in the Image form:

    • Drag the selection area until the desired portion of the image appears in frame.
    • Zoom in by clicking the + button.
    • Zoom out by clicking the - button.
    • Return the image to the last-saved size by clicking the Reset button.
    • Remove all cropping and return the image to the original size by clicking the No Crop button.

      Cropping removes the light gray background that is applied to all images by default. After cropping, your display images should fill the whole frame. For more, see Image Cropping Before and After.

  2. Click Save.

    Your image cropping saves. In your guide, the uncropped, full-size image is accessible when a visitor taps the hero display crop.


Image Cropping Before and After

Before

Before cropping an image, the image fits inside the display areas with padding on either side.

After

After cropping an image, the image fills the display areas.

Content Recommendations

Items, Events, Tours, and Exhibitions always have associated images. The following recommendations will help you use images effectively.

General

  • For artwork and botanical Items, choose quality images that accurately depict a work of art, object, or plant in its entirety. These can be supplemented by additional images that show details or alternate angles. 
  • When possible, add multiple images for three-dimensional objects on view. This helps off-site visitors (or anyone who is not able to move fully around an object, whether because of mobility issues or display location) get a better sense of the items.
  • Though images in your content library can be added to multiple pieces of content, avoid using the same image to illustrate multiple Items. 
  • Alt-text for all images is ideal.

Image Captions

  • Images of artworks should always have captions, and other images should almost always have captions.
  • Remember that images can be attached to multiple pieces of content, so keep in mind the kinds of information necessary when an image is potentially shown without the associated Item fields. For example, artist name, artwork title, and date are included in Item information, but should also be included in an image caption to properly identify an artwork if that image is used to illustrate an Exhibition.
  • Always keep copyright information in mind and consult with your organization’s copyright expert, as available. 
  • When a single artwork or object is shown in an installation photograph, that artwork’s information should be provided in addition to the exhibition name. When multiple artworks or objects are shown, exhibition information may be sufficient, depending on copyright. 

For more suggestions and style guides, see Image Captions.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.