We regularly talk to customers who are keen on building mobile-optimized email templates, but have hit a roadblock. It’s easy to empathise, as while we’ve put a fair amount of effort into providing resources on designing mobile email, chances are that you’ll hit at least one of the following hurdles:
- Skill: ‘Everyone says that you should ‘code email like it’s 1999′. After getting my head around that, I’m now being told to use CSS3 – help!’
- Time: ‘Optimizing for mobile adds a whole bunch more coding and testing tasks. My clients can’t afford to cover this.’
- Resources: ‘I don’t have a device to test on.’
- Motivation: ‘This is going to be hard.’
One of the aims of our new template builder has been to overcome these hurdles. In essence, make it really easy to create email campaigns that look just as slick on your iPhone or Android handset, as they do in the inbox. Plus, save you loads of testing time, as you can be confident that they will just work.
After yammering on about mobile optimizations in this blog, it’s about time that everyone gets to create responsive email campaigns for themselves and their clients.
Switching between desktop to mobile versions
In order to fulfill this, we’ve added a toggle button to the bottom of the template builder’s preview pane. This switches between the desktop and mobile version of an email template, so you can customize things to your heart’s delight without having to repeatedly test on a mobile device:
As you can guess, we’ve already rolled all the necessary
@media queries into the template code, so at no point do you have to get elbows-deep into CSS3.
Learning from the code
That said, these templates provide ample opportunity to learn about some of the coding fundamentals behind creating responsive designs. It’s worth mentioning that you can export your template builder creations, fire them up in your favorite editing software and see how we’ve narrowed layouts, resized images and more, simply by using a few lines of CSS.
Finally, we’d love to hear your questions or feedback in regards to creating mobile email templates in the new builder. It has already saved us a lot of time and mental energy when creating our monthly newsletter, so hopefully it will do the same for you, too.