Increase relevancy by thinking responsively

Share this content:
Sean Shoffstall, Ozone
Sean Shoffstall, Ozone

Mobile has become the norm, and marketers are challenged to coordinate their efforts with this chameleon landscape. Responsive email design takes the idea of “the right message at the right time” to the next level by delivering the right “experience” to their audience.

Using a technique that automatically reformats and resizes email for optimal viewing on various screens, responsive design ensures that the most important messages fit the viewing screen while hiding nonessential elements from the mobile reader. Marketers can therefore provide optimized experiences seamlessly across platforms (mobile, tablet, and desktop) within a single email.

With 88% of smartphone users checking email on their phones daily, responsive design is now a must for your arsenal. By tailoring your user experience, copywriting, and technical specs to both mobile and desktop audiences, you can modify your email marketing campaigns to be better consumed across devices.

Accounting for the device as well as the content ensures the best user experience and, of course, drives conversions.

UX: Consider how you could modify your current templates for mobile devices, bearing in mind the following four factors.

1. The maximum width for content on each device type.
2. How the content needs to wrap or stack based on device.
3. Readability: On mobile devices, larger font sizes and buttons are key to higher conversions. Don't use fonts smaller than 14px. Buttons should be 40px high. (Remember, it's a finger not a mouse.)
4. Secondary content can be hidden in the mobile version.

Copywriting: Responsive design is further motivation for crafting your message as concisely as possible. Thinking responsively means shorter copy for mobile with stronger calls to action, and, as screen size increases, being more descriptive.

1. Make sure the payoff is in the first sentence of a paragraph so copy is easily edited down for phones.
2. Make bullets your friend with short punches at the front.
3. Think about line wrapping and how increased font size will affect copy real estate.
4. Keep the detail on the desktop version—people check both.
5. Consider whether the call-to-action will vary between devices.

Technical: This is where everything pays off. By using media queries in style sheets and doing something all email marketers have been told not to—putting style in the header—marketers can target only the viewports that are necessary for a particular campaign.

Fleshing out all the technical considerations is a topic for a separate article, but here are some ‘gotchas' to watch out for:

1. Separate your mobile and desktop actions with discrete tracking tags.
2. Remember Retina Displays when using your @media queries.
3. If your CSS isn't working, try important tags; they are your best friend when coding responsively.
4. Develop images appropriate for the screen size.
5. Stack your table layouts using CSS.

Responsive emails require more setup at the get-go, but once you've nailed down a process and have templates that accommodate new designs, they become much more turn-key. Enjoy, and think responsively.

Loading links....

Sign up to our newsletters

Company of the Week

Since 1985, Melissa Data has helped thousands of companies clean, correct and complete contact data to better target and communicate with their customers. We offer a full spectrum of data quality solutions, including global address, phone, email, and name validation, identify verification - available for batch or real-time processes, in the Cloud or on-premise. Our service bureau provides dedupe, email/phone append and geographic/demographic append services for better targeting and insight. For direct mailers, Melissa Data offers easy-to-use address management/postal software, list hygiene services and 100s of specialty mailing lists - all with competitive pricing and excellent customer service.

Find out more here »

DMN's Career Center

Check out hundreds of exciting professional opportunities available on DMN's Career Center.  
Explore careers in digital marketing, sales, eCommerce, marketing communications, IT, data strategies, and much more. And don't forget to update your resume so employers can contact you privately about job opportunities.

>>Click Here