Get the Word Out, Part Two: Design for Devices

Last week, I wrote about increasing a mass email’s reach by making sure it’s legible for all your audience members. Today’s post is about making sure your email is legible across different devices.

Picture perfect?

You’re competing for your audience’s attention, so you want to send out something eye-catching. You’ll probably want to make sure everything looks just perfect. This can be done by making a page layout for your message, then sending the whole thing as an image, but don’t.

Why not?

This practice immediately excludes part of your audience (by being inaccessible), and can also frustrate the rest of your readers. People using mobile devices will find themselves trying to scale the image just to make the letters big enough to read, and/or scrolling in all directions to see the entire message. Also, many email clients block images by default, so your readers won’t see the message until they click “display images” or “show content.”

This is basically asking your audience to do work. Nobody wants to do work. It’s easier for them to move past your email without reading it.

Invitation image scaled to fit within an iPhone screen, then zoomed for the text to be a legible size.

This invitation is too small to read when the iPhone scales it down to fit the screen. Zooming in, however, cuts off content, requiring the reader to scroll back and forth to read it all.

So then what? Be flexible!

I understand the strong desire to make your email “pixel perfect,” but, honestly, you (and your audience!) are better served by giving up some control.

You may have heard of “responsive” design, a popular trend in web design where content is resized and rearranged to gracefully adapt to the width of any size screen, be it a 27″ iMac or an iPhone 4. You can see this in action at it.emerson.edu (if you’re on a computer, just make the browser window really small to see the effect). The Foundation website is another great example (as well as an excellent framework for creating responsive websites and web apps).

Allowing this flexibility delivers an optimal experience for each kind of device.

How can I do this?

If (like most of us) you compose your emails in an application like Outlook, stick to using the default HTML editor to write and style your content. This way, your text will be able to wrap to adapt to your readers’ screens, instead of being shrunk down to fit. It’s a basic approach, but there is nothing wrong with that!

If, however, you’re fancy enough to code your own emails, this guide from Campaign Monitor is helpful.

This invitation was created with some of Gmail’s styling options. The image scaling does not affect the text size. Also, the iPhone has made the date and times into convenient links for adding to a calendar!

Form follows function

You send mass email in order to communicate with an audience. Decorative elements are a little something extra to attract attention (they really like attention). Don’t let them steal the spotlight, though, as it will defeat the purpose of sending a message at all.

Here are some fun examples where form has perhaps overstepped function:

Set of silverware made partially of limp rope.

A “rustic-chic” silverware set by artist Giuseppe Colarusso.

Converse-style shoe with pointy toe and stiletto heel.

You probably shouldn’t play basketball in these Chucks.

Toilet with decorative goldfish in the tank.

The poor fish never had a chance…

 


Toast up! Toast down!

 

…Next week is Part 3: Think Like a Newsperson!

Leave a Reply