The world is becoming ever more mobile, with people taking along their digital lives with them and always looking to be connected on the move. According to a recent study covering Indian mobile users by Octane Research (India Mobile Users Experience Monitor 2013), 64.2% of the respondents stated that their most preferred activity on their smartphones was checking email. That’s a huge number of people checking mailers from marketers but also where a problem arises. Simply put, different smartphones and mobile devices such as tablets and phablets all have different characteristics such as screen size, resolution and mail apps and these differences can create major problem when it comes to displaying your emails correctly.
This is where responsive email design comes into play. Responsive email design means that the email automatically adjusts itself to better utilize the display available for any given device. How this works is that the response code in the email gets the information from the device and reacts by displaying the most appropriate layout of the email that keeps the design language and utility of the email intact.
Why should marketers care?
There are many reasons why marketers should care about responsive mailer design but the most important of them all is the marketers need to provide the best experience of engagement to the people who are opening the emails. The layout, the amount of scrolling, the rendering of images, the placement of link, all contribute towards the overall experience for a subscriber and have a very real impact on the potential for conversion. The better experience you offer them, the higher engagement you will see and thus, a higher chance for conversion.
Another important reason why we should care about responsive mailer design is the touch screen problem of ‘involuntary clicks’. This usually happens due to the mailer design not being displayed correctly on a device, the recipient scrolling or adjusting a mailer and inadvertently activating a link that pulls them away from the mail and towards a different page.
Picture this scenario; you get an email on your mobile device but the font is really small and as you try to navigate through the email you accidently click a link. You get frustrated and close the link before the page opens. This can be a false positive for the company when it comes to analytics and will end up providing incorrect stats. For marketers, the number of opens and clicks matter a lot and incorrect or non-responsive mailer design via virtue of being non-optimized, can lead to incorrect assessment of engagement.
So what are the steps/guide to get an excellent and effective email:
- Subject Line:
While not a traditional “design element” your subject line is considered one of the most important factors in getting your email opened so your subscribers can see your sweet design so make it engaging, personal, and relevant. Remember, that overuse of CAPS and unnecessary punctuation, as well as some words, can trigger spam filters so respect your subscribers and don’t go there. Use these words instead.
- Is longer better?
When it comes to email subject lines longer isn’t necessarily better. It’s important to keep in mind that your subscribers use a variety of different browsers and email clients as well as mobile devices to consume your emails.
According to data from Return Path, 65 characters seems to be a sweet spot for email subject lines, which is about 15 characters more than the average subject line. When subject lines are 61-70 characters long, they tend to get read. However, most email subject lines are between 41 and 50 characters.
- What about symbols in subject lines?
The saying “a picture is worth a thousand words” may never be more true than when it comes to emoji. And emoji in email subject lines can have a major impact. Not only can they take the place of words, be attention-grabbing, and add a definite charm, they can increase your open rates. A report by Experian noted that fifty-six percent of brands using emoji in their email subject lines had a higher unique open rate. Consider us ?.
- Things to keep in mind when using emoji in email
If an emoji isn’t supported in the email client, the recipient may see a ☐ character instead.
Remember: Gmail has to have some extra special considerations when using emoji. You may notice in Gmail when you use emoji in the subject line the icon will look different in the inbox view and after the email has been opened. This is due to the inbox view using the Android version of the emoji, meanwhile, the opened email view uses Google’s own emoji style. While the emoji basically look the same, it’s still worth testing to make sure the same sentiment is expressed in both versions.
In addition, for Inbox by Gmail, it’s currently not possible to insert emoticons in Inbox messages using the browser version.
Your preheader can be visible in the inbox preview and in the body of your email, or just in the preview pane if you want to save email real estate. Preheaders add valuable context to your subject line and can help your open rate. Keep it short (between 40-70 characters) and to the point. Use this space to help your customer know why the email is useful to them. Your subject line and preheader text should work together.
Emails with personalized subject lines are 26% more likely to be opened. Go beyond just using your subscriber’s name in the subject line and use other data you have to fuel super relevant messages. Adding company name, last purchase, or other information helps you to personalize the email in the perfect way for each subscriber. But really good personalization involves more than just injecting a first name. Think about how you could completely change the email based on someone’s information.
Stop thinking of emails as one-to-many and think about them as one-to-one—where each email is customized to each subscriber.
- Humanization / Contextual Marketing
A term that’s been getting popular is contextual marketing or humanization which focuses on making the email more of a 1-to-1 engagement rather than a 1-to-many type email that’s one-size fits all.
This leads to emails specifically tailored to the subscriber which will lead to higher engagement.
Spotify is a great example with their year-end campaign showing each subscriber what their most listened songs were and where they ranked in their favourite artists’ fan rankings (based on how many times they listened to their music). Making your email feel more “humanized” and like it was built for each subscriber has many benefits including increased engagement, better relationships with your subscribers, and even people getting excited to receive and open your email.
- Dynamic Content
For those wanting to get serious with personalization, you can also dynamically change entire sections of content within your email to make the entire campaign more relevant and more appealing to subscribers.
A common use case for this would be showing menswear to your male subscribers while showing womenswear to female subscribers.
- Email Layout
Your email layout should help the viewer know what they should check out first, and where they can go from there. They should be able to scan the email quickly using a logical hierarchy with large headlines and images focusing the attention. Use layout to break up space and help create chunks of content.
- Inverted Pyramid
We’re big fans of the inverted pyramid model. It’s essentially a framework for structuring the elements of your email campaigns (headers, imagery, buttons, etc.) so they work together to draw people in, deliver the key messages of your campaign and get them to click-through. By guiding a subscriber’s eye down the page to your CTA, you’ll encourage them to click through to explore more of what you have to offer, resulting in better brand awareness, more web traffic, and ultimately more sales.
Another effective design grid is an angular one with a zig-zag layout.
You can create these angles through using imagery or colour blocking in order to guide the reader through each step of the email. This not only creates a visually pleasing layout, it also helps to simplify each section of the email so that it is easy to read.
- One Column
One column emails work great on desktop and mobile. These mobile first emails usually adapt to desktop and scale images. It helps consumers navigate the email without overwhelming them. The one column design makes it obvious what information is important and what you want a consumer to do next.
- Email Width
To ensure that your email renders well in every email client, we can push the envelope on our email widths to at least 640 pixels. At widths wider than 640px Gmail doesn’t show any background colour that would appear in the margins at most reasonable browser sizes (you can see them if you stretch your browser to wider than 1200px). For our designs, 600px is usually the sweet spot.
Plus, email clients don’t use the full width of your screen to display an email message. Some show ads or have navigation or a menu so there are limitations to the real estate on a screen.
When using images in your emails, it’s important to keep the following in mind:
Dimension – most emails are 600-640px wide. However, to keep your image crisp on high-resolution displays, you need to make your image 2x the size (i.e. 1200px) and use the image attributes and CSS to keep the image at the width you want.
File Size – It’s easy to forget about file size in an email but you want to make sure your images are optimized. Especially since more than 50% of emails are opened on mobile devices. The bigger the email, the longer it’ll take for mobile subscribers to view and thus create a negative experience with your email. Read more about best practices for image-heavy emails here.
Alt Text – If your image doesn’t load or breaks somewhere along the sending process, Alt Text is the text that will display in its place. This is another area that many email marketers overlook. Add in helpful Alt Text that adds to your message in the case that your image doesn’t load. If your image has text on it, I usually write the overlaying text as the alt text. This way if the image doesn’t load, the text will still be read. Including ALT text also makes your email more accessible.
Use images that complement the email – Your email should not be a bunch of images placed together. An image should add to the email and messaging—not be the messaging. A simple way to test this is to view your email with images turned off. Does the email still make sense? Is the message still clear? Our friends at Email Monks offer some solid advice on the optimal text to image ratio.
Stock Images – Stock imagery can sometimes take your audience out of the messaging. Keep your images on brand and genuine. Take the time if you have the opportunity to create specific imagery for your email campaign! If not, use imagery from paid sites like stocksy.com or free sites like deathtothestockphoto.com. Here are a few more to check out.
- Images and Alt Text
Alt text is simply the alternative text displayed with an image. Think of it as the backup text that provides some context about what your image is, for those that have images blocked or turned off by default. Many marketers learn about alt text the hard way by forgetting to use it and suffering the consequences. Don’t be that person.
As you can see from the example below, when images are blocked, subscribers see what looks like a broken image, or a red “X”. In this case, alt text indicates that there is an image and provided a little context about the image to encourage subscribers to “turn on or enable” images in the email.
- White Space
White space is the blank area around your paragraphs, images, and call to action buttons.
Adding ample white space around the elements in your email encourages click-through by separating them visually from other elements in your email and helping focus the reader’s attention on them at the right time. It can also increase the legibility of your email and improves the eyes’ ability to follow the content. Use your best judgment to ensure your copy and CTA button are separated enough to stand out, but close to enough that your readers know they’re connected.
- Mobile Optimization
Email opens on mobile devices just keep increasing year after year. The latest stats are that over 68% of email opens occur on mobile. Making your emails mobile-friendly is easier than ever by:
- Using a mobile-friendly template
- Keep your subject line short
- Use preheader text
- Use minimal body copy
- Use one clear and easy to click CTA button (According to a recent MIT study, the average size of an adult index finger is between 1.6cm and 2 cm, which translates to between 45 x 45px and 57 x 57px on a mobile device.) Multiple CTAs can be confusing and lead to overwhelm, which you definitely want to avoid.
- Increase the size of body copy if it’s small on desktop emails. (16px is a good size for mobile)
- Make sure your images aren’t too small or hard to see when on mobile
This guide is brought to you by Adstuck which itself provides email marketing services and provides very effective mailer designs or related services to its clients.
So let us know about this company:
Adstuck is a digital marketing practice agency working from all over the world with four locations India, Singapore, Estonia and US. Its mission is to provide instant access to a talented workforce to enterprise. They have 491 clients and worked over 700 projects, with 30 fortunes 500 firms.
Adstuck provide services in:
- Improving marketing results
- Creating social media marketing strategy
- Proper assessments of current trends
- Market research
- Email designing
- Campaign creation
- Growing market share
- Email marketing
- Launching new product or enter new market.
It is a strong and leading digital media marketing service provider which can help you with cost cutting, plan execution, perfect reporting, strategy making, data collecting, and response collection from consumers. It handles all the aspects of your business. They don’t focus only on new on emerging brands who wants entail success and distribution in the market but also on brands that have successfully established the customer retail space, and need some assistance in managing their business.