To transform a static piece of design – in this case a printed publication – into an interactive experience, two critical elements need to be maintained:
1 – Visual Identity. The interactive experience must coordinate with and build on the visual identity of the printed publication. The site should seamlessly reflect the look and tone of the publication. Introducing unrelated visual cues or stylistic devices can cause visual fragmentation, resulting in user confusion and reduced web readership.
2 – Content Management. Editing content and introducing interactive elements such as video, animation, or music, can bring printed stories to life and hold an audience’s attention. Regardless of screen size, large passages of back-lit text can be tedious to read, and can quickly lose readers with short attention spans and high online expectations.
To make a positive transition to the web and increase online readership, try incorporating these basic principles:
Print publications are structured in a specific way for ease of navigation and optimal readability. The architecture of the corresponding website should maintain the magazine’s basic structure as closely as possible. Navigation terms should reflect the naming conventions established in the magazine. Avoid changing section titles and headlines, and try not to locate content more than one click away from the homepage.
When editing isn’t an option, break up long running text with various entry points such as oversized intro paragraphs, sidebars and call-outs. These devices, commonly used in print, make long stories easier to scan and navigate and can be easily applied to web style sheets.
The interactive experience must coordinate with and build on the visual identity of the printed publication. The site should seamlessly reflect the look and tone of the publication.
Opt for an open source typeface from a library such as Google Fonts to avoid online subscription fees and load time concerns. Styling can be nearly identical to the print-based fonts, with faster load-times and content indexing. And with the rise of variable scaling, appearance and speed will only improve when responding to multiple screen sizes.
“Web-safe colors” are becoming a thing of the past. Browsers are smarter and screen gamuts continue to rise. Pantone colors will never match projected color exactly, but they are now within range. With some color code finessing, you’ll feel like you never left the printed page.
When choosing between static artwork and “web extras,” consider the value of animation or video to capture the attention of a broader (and younger) audience. Static artwork is generally a direct carry-over from the printed page. If your budget is tight, consider subtle movement (parallax) or basic animation (gif) to add an element of motion. If you’re ready to commit to “web extras,” video or complex animation are now the gold standard for websites that keep audiences engaged and coming back.
The advantages of bringing your content online outweigh the loss of precise control that exists in a print environment. Print publications can transition to the digital realm in cost effective ways, with high indexing and fast load times, and still maintain the spirit of the original design. If you’re taking the time (and money) to generate powerful stories about your institution, why not make it searchable, linkable and likable online? It’s not enough to just post a PDF. Give the content a virtual life of its own and track reader’s responses using metrics.
Want to be notified when additional case studies in this series are posted?
Subscribe here to receive emails from us.