gistfile1.md

Image quality research

Summary:

After looking into the issue of the image quality of Visual Journalism output on the News website we have decided that there are a number of actions we can take:

• Visual Journalism upload larger sized images (976px as a minimum). These will then be down scaled rather than upscaled.

• Increase use of art direction tooling (AI2RWD for example).

• Publish images using the SVG format. Create new functionality (either by CPS or with AWS) to allow SVG files to be uploaded by journalists and used in CPS pages.

Visual Journalism development will provide documentation for editorial and UX to help them decide when which approach is best.

We also propose that we think about using double and triple density pixel images. However this has a knock on effect for the entire site so we want to discuss this option further with the rest of the News delivery team.

Visual Journalism upload larger sized images

We currently upload 624px wide graphics. These are often upscaled by the responsivenews codebase when displayed in the story page column. Unfortunately the width at which they are rendered is variable (because of the nature of responsive web design) and also likely to change many times in the future (as the design of the page is changed by News UX).

Because of this the best strategy is to create as large a graphic as possible so that it is always down scaled. Down scaling rather than up scaling produces slightly better image quality. There are a couple of side effects to this:

• Graphics will need to be created at higher resolutions, changing the workflow slightly of how we make them.

• There is a technical challenge to get font sizing correct. As images will be created at a higher resolution it will be easy to make text that never works at any image resolution.

• This approach would be best for grahpics that don't have much text in them

Increase use of art direction tooling

We currently have two ways of changing the content of the image depending on the size of the device accessing our content:

• AI2RWD (Illustrator tool which needs a better name)
• Art-direction image include

The tooling team will continue iterate over these tools to improve them over the coming months.

Publish images using the SVG format

Publishing images as SVG would allow us to take advantage of the scaling nature of vector graphics.

• Flat, line art styles of graphics (i.e. maps) work best with the SVG format.
• Text in SVG files scale so this format would work best in adaptive layouts (UX are moving News to this style of layout).
• Rasterised images do not work well with the SVG format.

This is the biggest change as it requires work either by the CPS team or the Visual Journalism Tooling (probably via IDT) to make this functionality available.

@tmaslen
Please review my fork.