Editorial design

Editorial design

08 / Digital & Production

08 / DIGITAL & PRODUCTION

|

Key question

How do you publish a publication efficiently and accessibly in print and online?

An issue is created under time pressure and with many stakeholders. Style sheets, a clear proofreading process and clean data ensure that print and online editions are published on time and error-free. Accessibility is an integral part of this from the very beginning.

Learning objective: You will be able to plan and create style sheets, organise a proofreading process, adapt an article for screens, and design accessible publications.

Good production starts with the concept.

8.1 / From layout to production

Systems save time and prevent errors.

To ensure an issue is published safely and on time, four foundations are needed:

01

Style templates

Paragraph and character styles define each text level definitively once and for all.

02

Correction process

Clear rounds, clear responsibilities, and always just one current version.

03

Responsive Articles

With responsive design, the article adapts to any screen width.

04

Print data

A verified PDF meeting the print shop's specifications.

In the "Pipeline & Workflow" course, you will delve deeper into how to set up print files technically correctly. This course focuses on preparing publications to ensure smooth production and proofing processes.

Order in your files means order in your notebook.

8.2 / Accessible publishing

Good design excludes no one.

Accessible publications can be used by as many people as possible, including those with visual impairments or reading difficulties. This includes sufficient contrast, an adequate font size, a clear structure with proper headings, and alternative text for images.

Working with style templates lays the groundwork for accessible PDFs and websites: paragraph styles become heading levels that screen readers can detect. Put simply: public bodies in Switzerland are required to publish accessibly; the benchmark is the WCAG guidelines, specified for the federal administration in standard eCH-0059.

Clear structure helps all readers.

8.3 / Planning style templates

Plan first, then create.

Before you set up paragraph styles in your layout software, it pays to have a plan: which text levels are there, and with what font, size, line spacing and margins? Numbered names like '01 Title' or '10 Body Text' keep the list organised.

Paragraph styles apply to whole paragraphs, character styles to individual words, such as italics or small caps. Build styles on top of each other: if they are all based on the base font, you can change them in one place for the entire issue.

A good name saves a search.

Try it out
Style Sheet Planner

Plan paragraph and character styles with name, font, size, and spacing. The tool checks the grid and creates a list to copy.

1 / Styles · 7 paragraph, 2 character

Paragraph style
Paragraph style
Paragraph style
Paragraph style
Paragraph style
Paragraph style
Paragraph style · off the grid
Character style
Character style

Check the grid

These leadings are not a multiple of 6.5 pt: 20 Caption. For captions or boxes this can be deliberate.

2 / List to copy

PARAGRAPH STYLES (baseline grid 13 pt)
00 Base · Source Serif 4 Regular · 9.5/13 pt · before 0 pt, after 0 pt
01 Kicker · Inter Bold, caps · 8/13 pt · before 0 pt, after 6.5 pt
02 Title · Inter Bold · 23/26 pt · before 0 pt, after 13 pt
03 Lead · Inter Medium · 14/19.5 pt · before 0 pt, after 13 pt
10 Body · Source Serif 4 Regular · 9.5/13 pt · before 0 pt, after 0 pt
11 Subheading · Inter Semibold · 11/13 pt · before 13 pt, after 0 pt
20 Caption · Inter Regular · 7.5/10 pt · before 4 pt, after 0 pt

CHARACTER STYLES
C Italic · Source Serif 4 Italic
C Small caps · Source Serif 4 Small Caps

Numbers in the name keep the styles sorted. Create «00 Base» first and build the other paragraph styles on it.

Exercise

From print to screen

Task: Create the style templates for 'Quer' and implement an article as a digital page.

STEP 1

Plan all paragraph and character styles in the tool.

STEP 2

Set up the formats in the layout programme and apply them to your pages.

STEP 3

Implement an article as a responsive page with genuine headings and alternative texts.

STEP 4

Check contrast and readability on mobile and desktop.

Evaluation: Where did the plan save you time, and what is different digitally compared to print?

Final project

Your edition of ‘Quer’

In the final project, you will design a 16-page issue of 'Quer'. You will bring together everything from the course: format, grid, typography, imagery, hierarchy, pacing and cover. On top of that, you will work with style sheets and create a digital article page.

STEP 1

Concept & flat plan

Define the format, target audience, and page order for all 16 pages.

STEP 2

Grids & Style Sheets

Define the type area, baseline grid, and all paragraph and character styles.

STEP 3

Content pages

Design pages with images, hierarchy, and clean microtypography, and export them as PDFs.

STEP 4

Cover

Front page with masthead, cover image and cover lines, tested as a thumbnail.

STEP 5

Digital article page

Implement an article responsively and accessibly for screen viewing.

Evaluation criteria: consistent grid, good legibility, clear hierarchy, engaging narrative, recognisable cover, clean style templates, and an accessible digital implementation.

Everything comes together in one edition.

© 2026 Corinna Kost, Basel