Mobile newsletter layout optimization for smartphones and tablets

More and more users are checking their e-mails on the go with their smartphone or tablet. The proportion of those who go online via mobile devices has increased by 13 percentage points to 40% compared to the previous year (Initiative D21). A fact that companies that rely on the e-mail channel have to face. Because users who are annoyed about shot or awkwardly designed newsletters on the go are quickly lost as subscribers. Responsive e-mail layouts based on templates promise a remedy.

When it comes to mobile design, touch navigation, smaller screens and special technical features must be taken into account. This is why solutions are required that dynamically display emails on smartphones, tablets and desktop devices. The ideal solution is to optimize the different views of an email for the various end devices on a template basis. The email layouts are variably defined for the different screen resolutions and display sizes. Central design elements such as images or call-to-buttons can be automatically moved and optimally placed.

6 tips for responsive layouts

Below, I’ve summarized six tips for mobile email layouts:

1. Generate attention

The subject matters because it is the key piece of information that can most easily arouse curiosity and interest. Subscribers open e-mails with a short and concise subject much more frequently – this is no different with smartphones and tablets than with PCs and notebooks. Long subject lines, in which keywords slide too far back, should be avoided if possible, as they may not be displayed on smartphones. Special snippet texts should be used for the mobile channel. These are displayed below the subject on smartphones such as the iPhone and are therefore a good addition to the classic subject line.

2. Optimize for touch navigation

Touchscreen-optimized click elements ensure a high response. In the mobile channel, for example, flexible font and image sizes and easy-to-click call-to-action buttons are recommended. Pictures, graphics and buttons should be designed to be small, but still clearly recognizable. Links should be placed at a sufficient distance from each other so that the thumb can easily navigate the touchscreen. As a rule of thumb, the thumb of an adult user needs approx. 40 x 40 pixels. In addition, horizontal scrolling from left to right should be avoided. Single-column layouts, in which the content is stacked on top of each other, are particularly user-friendly.

3. Concentrate on the essentials

The credo of mobile email marketing is: less is more. And this philosophy coincides with the expectations of most users – the desire for simple and intuitive operation. The use of design and content should therefore be limited to the essentials in the mobile channel. Text and graphics ensure the necessary attention in the body text. Don’t forget the landing page behind a newsletter link. It must also be designed for mobile use. Because only then can it ensure the desired conversion.

4. Note above the fold area

Scrolling is much more tedious on mobile devices than on the desktop. The header of an email is all the more important. “Above the fold” describes the entry area of ​​an email that is immediately visible without the user having to navigate down. The following applies in particular to smartphones & Co.: The most important messages should be placed right at the beginning, because the user’s attention is focused on the upper area. This is particularly recommended for important layout elements such as call-to-action buttons. Such buttons should contain a clear call to action and encourage people to “click through”.

5. Use alt attributes

Images are automatically loaded and displayed on Apple devices. Otherwise, companies can never be entirely sure whether images in the mobile inbox will be displayed immediately. Therefore pictures, graphics and buttons should be provided with a descriptive and activating alternative text. This information is usually displayed even if the images are not loaded. The so-called old attributes known from the “stationary” area are recommended for this.

6. Test regularly

E-mail layouts should be tested on common end devices. Especially at the beginning, i.e. when developing templates. But also later during regular communication. Because with updated mailbox versions and new devices, the representation of the existing e-mail HMTL code often changes. In order to prevent display errors, checks are essential. Display tests are usually already integrated in professional shipping solutions.

Leave a Reply

Your email address will not be published.