Stop Making These 4 Responsive Design Mistakes With Your Marketing Collateral

By Ben Kulakofsky

Responsive collateral design mistakes

Marketing has always been a hybrid profession. As a marketer, you’re equal parts salesperson, writer, designer, behavioral psychologist, and often even statistician. The ability to wear many hats is what makes marketing special and appealing.

Creating marketing collateral, like blog posts and white papers, is one part of the job that touches on every facet of the field. You need to create eye-catching, well-written, persuasive content that drives people to a product — often without them even realizing it.

But in the current age of digitization, marketing collateral is changing rapidly, and the associated challenges are changing too.

Consumers interact with your content on an ever-growing number of devices. If you can’t provide an equally impressive experience on desktops, laptops, iPhones, Androids, iPads (and maybe even a smart fridge), you’re already three steps behind before the race even begins.

This is why (as all marketers know) responsive design is essential. There’s no point in producing top-notch content and ranking high on Google if no one can read it on a mobile device — in fact, Google will hardly acknowledge it if it's not optimized for mobile. 

But what very few marketers seem to realize is that responsive design is vital for all your sales and marketing collateral — not just your blog.

So before you put out your great new eBook, infographic, or white paper, ask yourself: Am I making these responsive design mistakes?


Mistake #1: Still Using PDFs

It’s no secret that technology is advancing. The capabilities of modern smartphones have made even The Hitchhiker’s Guide to the Galaxy obsolete.

And yet, when creating eBooks, white papers, and other collateral designed to entice and convert prospects and leads, most marketers still use a legacy file format released in 1993!

PDFs certainly had their moment in history. They were created to cross barriers and make it possible to share files across platforms without completely destroying the formatting.

But today, they create more barriers than they once helped overcome.

PDFs are a fixed-layout file format, meaning they scale to fit the viewer’s screen while keeping the layout intact. The problem with a fixed layout is that on smaller screens PDFs are often unreadable without zooming in.

If you want to make PDFs desktop- and mobile-friendly, you have no choice but to create multiple versions to fit various device sizes. This is possible, to be sure, but it’s a lot of extra work for marketers already constrained by budgets and time.

The smarter choice is to ditch PDFs and use a responsive format for your marketing collateral instead. Responsive design means that, instead of merely scaling in size, the layout itself intelligently adapts to the screen so that content is adjusted and rearranged for better viewing.

Fixed layouts are unsuitable for a world with so many screen sizes, and that’s why still using PDFs is a big responsive design mistake.

Top tip: Read our case study with Tentoo, a payrolling company. It’s a must-read on the advantages of digital publications over PDFs.


Mistake #2: Not Going Mobile-First

According to marketing consultancy IMPACT,


of the time people spend consuming digital media, they’re on a smartphone.


of users immediately delete emails that don’t render correctly on a mobile device.

The point of these statistics is that mobile is now the number one place to reach your audience. This is even true for B2B marketers, whose prospects traditionally viewed their content at a desk in their office.

In 2014, 64% of people viewing Foleon Docs used a desktop, and 36% used a mobile device. In 2017, the desktop had fallen to 52% and mobile had risen to 48%. That’s a 12% shift in 3 years!

Mobile-first is a strategy for executing a responsive design. Instead of creating content for desktop and then making sure it renders “okay” on mobile, the process is reversed. The design begins with creating an exceptional mobile experience and then works its way up to larger screen sizes.

When thinking about responsive design for various forms of marketing collateral like catalogs and magazines, it’s important to think in a mobile-first way. Making content beautiful on mobile devices should be your top priority because that’s what most of your audience will be using.

Infographics are a commonplace where marketers go wrong. They design them for desktops and then insert them into a blog post. While the blog itself might be responsive, the infographic is not and thus becomes too small and too detailed to read on a mobile device.

Responsive design allows them to hide certain elements when the screen size is below a certain point — and many marketers end up using this when they realize their image or infographic is unreadable on smaller screens. However, having an important piece of collateral that can’t be viewed on mobile is a critical design flaw.

A mobile-first approach would mean creating a mobile-friendly infographic that also looks great on a desktop.


Mistake #3: Repeating Work

An unfortunate side effect of the proliferation of devices is that your job is significantly more complex. From device-specific analytics to creative efforts, tasks are often repeated to cover all audience segments. Luckily, responsive design can cut down on this clutter.

There is no need for you as a designer or content writer to repeat your work by creating many versions of the same collateral.

Just as responsive design principles made separate “mobile versions” of websites unnecessary and obsolete (remember all the m.example.coms?), you can apply these same principles to your marketing collateral — whether it’s a report, a proposal, or an online magazine and create a single document that will display perfectly on any device. All you need is the right tool.

Spending less time creating collateral means you can invest that time elsewhere. Instead of creating one piece of content many times, you can produce more pieces to entice your prospects and build your reputation as a thought leader.

More content is certainly better than more versions of a single piece of content.


Mistake #4: Thinking the Web is All That Matters

Responsive web design has been a standard for years, and it’s a part of nearly every company’s strategy. Unfortunately, not all marketing collateral receives as much TLC as the corporate website.

As a marketer and content producer, it’s your job to apply responsive design not just to your website and blog, but to newsletters, white papers, digital brochures, and anything else you create.

Consider the user experience of your marketing collateral. Blogs and eBooks don’t exist just for their own sake. They serve to pull potential customers through your funnel and, ultimately, contribute to business goals. Reducing the bounce rate, increasing engagement, and making conversions easier should be a top priority.

Having all your content — not just your website — look and function its best on any device, especially mobile where the majority of users spend their time, is paramount.



Here’s one more stunning statistic to convince you of the necessity of responsive design: At Foleon, we’ve observed more than 900 screen sizes and 1600+ browser versions used to view our sales and marketing content.

Marketers are often early adopters of new technology. You were quick to recognize the potential of social media and the need to rank highly Google’s search results.

Yet, there is always the potential for blind spots. It would be an unfortunate waste of resources if prospects see your content, but are unimpressed and don’t convert because of a sub-par mobile experience. Don’t let responsive design become a blind spot in your marketing collateral.


Curious about making your marketing collateral responsive? See some examples of responsive eBooks and white papers other companies have created with Foleon.

Foleon & CMI White Paper

How to Overcome Content Creation Barriers

Why the time is now for B2B marketers to develop modern digital content experiences.

Get the White Paper
Overcome-Content-Creation-Barriers (1)
Ben Kulakofsky

Ben Kulakofsky is a digital marketer and content writer. His past work has been featured in the Guardian and Al Jazeera. When not buried in his notebook, Ben can be found catching midnight showings of his favorite classic horror movies.

Want to write for the Foleon blog? Here's how to submit a guest post.

What to read next