Optimize your email for mobile viewing

Click through for steps to optimize your email for mobile…
Sophie Lamarche
1 April 2012
Omni-Channel Marketing Campaign
1 min 20
optimisez vos courriels pour le mobile
  1. Target mobile devices with the @media query

    The @media query will provide targeted CSS style sheets that are triggered when a device’s capabilities match specific criteria. It will allow you to adjust widths, padding and hide some content all together.

  2. Make it smaller

    Mobile devices have smaller screens and therefore you should be coding your email so that the @media query will shrink the width of your email to about 300 pixels eliminating the need to zoom in or pan out.

  3. Turn off font resizing

    Mobile devices use a browser (Webkit) that will automatically adjust the text size for better viewing on your device. If you make all of the changes above it is a good idea to add some code to turn this feature off. You can do that by applying the following CSS to your body tag:

  4. Highlight the important stuff

    Place all important messages in the upper portion of the email if possible. No one likes to scroll down forever.

  5. Hide low priority content

    In order to ensure maximum scanability of your email on a mobile device you can hide secondary content by adding the hide class to any image, paragraph or entire table.

  6. Use a single column design

    A single column makes it easier to quickly browse through an email. If you decide to use more columns for secondary content you can always choose to hide them for mobile.

  7. Be touch friendly

    Design your buttons a little bigger so they easy to click without having to zoom in.

  8. Test, test and test some more

    Don’t forget to test your new email design on all platforms. Think about how it will look in a vertical pane as well as horizontal.

    Inquire today to see how we can help your emails become mobile friendly.

Find out how your company can benefit from Dialog Insight.

Read also

Blog

Purchase Preference Analysis: The Pillar of Ultra-Personalized Marketing

Discover how purchase preference analysis can transform your marketing strategy! Leverage automation to boost engagement and drive conversions effortlessly.

Blog

Buying Guide: An Essential Ally in Choosing Your Marketing Platform

A marketing platform buying guide is more than just a document—it’s a strategic tool to help you make informed decisions, compare solutions, and optimize your marketing performance. Discover why it's essential!

News

Leverage Purchase Preferences to Transform Your Marketing Campaigns

Leverage purchase preferences to enhance your marketing campaigns, personalize your messages, and increase conversions with Dialog Insight’s advanced tools.

Omni-Channel Marketing Campaign

3 proofs that technology takes over marketing

Has personalized marketing become a science? Which of marketing or technology is really responsible for the "data culture"?

Omni-Channel Marketing Campaign

Top 4 tips to writing email subject lines they will want to click

As digital marketers, we invest a lot of money in the design and contents of our email marketing campaigns. However, we can never underestimate the power of a well-crafted, compelling email subject line.

Personalization

Unlock Your Email Marketing Potential with Hyper-Personalization

It’s no secret that email marketing is a powerful tool for businesses. But what if you could take it to the next level with hyper-personalization? Hyper-personalization is a process of using data and technology to deliver personalized content to customers at scale. In this blog post, we’ll take a look at what hyper-personalization is, the benefits of using it in email marketing, the types of data used for hyper-personalization, and the best practices for leveraging it. So, let’s dive in!