Images can be added to all section types in various forms, as outlined below.

TITLE / TEXT OVER MEDIA / REVEAL SECTION

Full-screen landscape image:
2560px wide x 1440px tall JPEG at 100% quality

Full­-screen portrait image:
1080px wide  x 1920px tall JPEG at 100% quality

Additional tips:

  • 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 help your text stand out.
  • Images will be automatically cropped to the centre on portrait screens. If that's not ideal you can choose to upload a different image to be shown on portrait screens
  • Please refer to our safe area guides (as the images will get cropped across different aspect ratio browsers).
  • Shorthand will automatically make additional smaller and compressed copies of your uploaded JPEG images for multiple device sizes so that your readers will be served an image close to their device ideal. We don't change file type.


MEDIA SECTION 

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


TEXT SECTION

  • 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.


BACKGROUND SCROLLMATION SECTION

Full-­screen landscape Scrollmation image:

  • 2560px wide x 1440px JPEG at 100% quality

Full-screen portrait Scrollmation image:

  • 1080px wide x 1920px JPEG at 100% quality

Inline image:

  • Same as text section above.

Additional tips:

  • 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.
  • Shorthand will automatically make additional smaller and compressed copies of your JPEG images (without changing file type) for multiple device sizes so that your readers will be served an image close to their device ideal.


SCROLLMATION SECTION

Image for two-column view (portrait-orientation images work best):

  • Recommended width: 800px
  • Recommended max. height: 1422px
  • JPEG at 100% quality


Image for two-row view (landscape-orientation images work best) :

  • 1422px wide x 800px high

Inline image maximum dimensions:

  • Portrait: 800px x 1422px
  • Landscape: 1422px x 800px

Additional tips:

  • 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, and that they correspond to the nearby text as necessary. Also consider how this will work across screen sizes.
  • Shorthand will automatically make additional smaller and compressed copies of your JPEG images for multiple device sizes so that your readers will be served an image close to their device ideal.
NB: We recommend JPEGs across Shorthand stories. Except where you may have an image with data or text, where fidelity is paramount, we would suggest a PNG which often helps with crisper areas of solid colour such as text as we don't run compression on them. It's important to test the story on different devices and check load time and image clarity. If you find that the images still aren't as clear as you were expecting, please let us know.

Please make sure all images have a sRGB colour profile. If this is not the case, you may experience color or saturation loss (i.e. they may look gray or faded). This issue is not confined to Shorthand and will also affect services like Wordpress. 
More info can be found here