In Title and Text Over Media sections: ensure the image is prepared and cropped with a text area in mind. You can use the Section Options overlay slider to apply a semi-opaque layer above the background media and below the text in order to help your text stand out.

Images will be automatically cropped to the centre on your reader's screens if their browser is a different aspect ratio than the original image. If that's not ideal you can also choose a focus point on the image, as outlined here. Choosing a focus point ensures that if the image needs to be cropped, the section you selected will remain visible. This is especially useful if key parts of your image are close to the edges.

Your uploaded landscape-format image is also used to automatically create a portrait-oriented version for use on tall screens such as phones. The automatically-created portrait image is a centre-crop of your uploaded landscape image. If this is not suitable, you can choose a different focus point on the portrait image to ensure that important parts of the image aren't cropped out, or upload a different image specifically for taller screens.

Please refer to our safe area guides to ensure that there's enough room in your images to handle their display across different aspect-ratio browsers without important image areas being cropped out. We have templates available for download there, too.

Shorthand automatically makes additional smaller and compressed copies of your uploaded images for multiple device sizes. Your readers will automatically be served images close in size to their device ideal so that they aren't unnecessarily downloading larger images than needed.
​
​

Any size up to 2560px wide JPEG or WEBP at 100% quality

You can add images inline only

The widest that inline images will appear is 800px (apart from in tablet portrait view, when they are shown at 110% the width of the text column). To ensure your inline images fill the full width of the column, upload them at at least 800px wide.

2560px wide x 1440px JPEG or WEBP at 100% quality

1080px wide x 1920px JPEG or WEBP at 100% quality

Same as text section above (we recommend at least 800px wide JPEG or WEBP images).

The use of multiple images in a Scrollmation section requires that the section has considerable text. Generally, the more images you wish to display, the more text the section will need to ensure that each image gets time on-screen as the text scrolls. If you have limited text, you may only be able to use one image in Scrollmation sections. Experiment with the number of images until you are happy that they don’t change too rapidly when reading the story. You could also artificially increase the length of the text column by inserting extra space between text blocks.

Shorthand will automatically make additional smaller and compressed copies of your images (without changing file type) for multiple device sizes so that your readers will be served an image close to their device ideal.

Recommended width: 800px

Recommended max. height: 1422px

JPEG or WEBP at 100% quality

1422px wide x 800px high

Portrait: 800px x 1422px

Landscape: 1422px x 800px

The use of multiple images in a Scrollmation section requires that the section has considerable text. Generally, the more images you wish to display, the more text the section will need to ensure that each image gets time on-screen as the text scrolls past. If you have limited text, you may only be able to use one image in Scrollmation sections. Experiment with the number of images until you are happy that they don’t change too rapidly when reading the story. You could also artificially increase the length of the text column by inserting extra space between text blocks.

Shorthand will automatically make additional smaller and compressed copies of your images for multiple device sizes so that your readers will be served an image close to their device ideal.