Society is always on the go—phones now account for nearly half of all email opens, and that number is only expected to rise. Take into consideration that 73 percent of millennials prefer communications to come through email, and it’s safe to say that email will remain the primary communication method for schools to reach new prospects and current constituents. 

However, emails designed from the start for desktop monitors or laptops will not always translate well to a mobile device, often leading to emails that don’t fit on recipients’ screens, overly long subject lines, and confusing email structures that can tank your open and click-through rates.

To help you successfully communicate across all devices, here are six quick tips to creating mobile-friendly emails that are proven to increase open and click-through rates:  

1. Design Your Emails Vertically

2. Keep Your Subject Lines and Body Text Short

3. Be Mindful of Space

4. Use Smaller, Fewer, Optimized Images

5. Create Larger, Simpler CTAs

6. Use Responsive Email Templates

1) Design Your Emails Vertically 

Mobile email design starts from the beginning. Think about the space you’re working with, which is smaller than on a desktop: the screen width is between two and six inches wide (500 to 650 pixels) for most modern smartphones. The size and pixel count can differ widely from phone to phone, but the idea is the same: you have to get the same message across with less space. Easy, right?

To convey the same amount of information most efficiently, build and design your emails as a vertical stack of information, often referred to as a ladder. Each rung of the ladder contains a new section of content, such a paragraph of text, image, or call-to-action (CTA). 

This vertical approach perfectly matches the ways we interact with our phones. Rather than moving a mouse across a horizontal monitor, we scroll up and down on our phone with the swipe of a finger. You’ll want to stack your emails vertically with the most important information at the top of the email, and it doesn’t always have to be text.

Vertical emails tend to be single-column since multiple columns introduces the chances that the content will be reordered into a single-column vertical format, potentially leading to a confusing email structure. However, you can safely use two- or three-column emails as long as you test your emails on mobile before sending to ensure the layout is as you intended. 

Quick tip: Content will always stack from left to right on mobile, so you do have at least some sense of how your content will stack vertically when using multiple columns. 

Multi-column emails (emails with 3+ columns) also introduce the chance that viewers will have to “pinch in” or zoom in on the email. Chances are, if someone has to zoom in to see parts of your email, you’ve already lost their attention and interest. We tend to only give 7 to 11 seconds to each email we read before deleting them if we’re uninterested. You don’t want those precious few seconds spent on zooming in when they should be reading your content. 

Single column emails also allow you to highlight content in order of importance. If you’re using a marketing email to promote three different events, order the events on the ladder in terms of importance or in order of which will occur first. 

Single-column layouts aren’t limited to just mobile devices, either. This format is still easy to read and display on even the largest of monitors. The inherent flexibility means that single-column email layouts have become the default email template for marketing emails since the one design can work for both mobile phones and monitors, especially if the designer is using a responsive email template. More on that later.

2) Keep Your Subject Lines and Body Text Short

The single most important line of text in your email is the subject line. It doesn’t matter how amazing your body content is, or how long you’ve spent creating all the exceptional graphics and calls-to-action (CTAs), if the recipient isn’t enticed enough to open the email. 

You can get away with a near complete sentence for subject lines on a desktop view since the subject line is stretched across most of the monitor’s width (60+ characters). Mobile devices offer significantly less space to pique the recipient's interest. 

Think of your subject lines like good news headlines. Keep them short, informative, and catchy, typically 30 characters or less to fit within the phone’s smaller width. If you absolutely need a longer subject line, place the two to four most important words at the beginning of the subject line to ensure they’re not cut off. 

Keep pre-header or preview text for your emails similarly short, typically between 50 to 100 characters, with the most important content at the beginning. Pre-header or preview text is the short line of text that’s displayed immediately after the subject line when previewing an email. 

Quick Tip: Consider releasing weekly newsletters instead of monthly newsletters. Weekly newsletters keep your emails short and easily digestible, while it’s easy to cram far too much information into one monthly newsletter. Readers are far more likely to read a one- or two-minute long email each week than a 10-minute read once a month. 

 Learn how you can quickly and easily build responsive emails with Finalsite Messages.

3) Be Mindful of Space

Designing emails for mobile devices also has to take into account the way we interact with touch screens. We’re a lot less accurate and precise with our fingers compared to the old-fashioned point-and-click computer mouse. While tapping and scrolling feels more natural, we lose a lot of dexterity in moving around the screen due to the decreased size difference between our fingers and mobile screens compared to a computer mouse.

Increase the padding around the interactive elements of your email to reduce the chances that your recipients click on something other than what they intend. Extra padding also pushes elements farther apart and makes it easier to read the email when scrolling up or down without your fingers blocking a sizable amount of the lower screen.

Padding of around 10 pixels on each element is recommended for proper spacing, and padding between 15 and 25 pixels is recommended for the edges of the email so the person’s hand isn’t blocking the sides of the screen when holding their phone or tablet.

You’ll also want to bump up the text size so your written content is easier to read on smaller devices. A minimum text size of 14 is recommended for body content, while a font size of 20 or more is recommended for headers and important text. 

For emails with less text, feel free to increase the text size to make your content easier to read. However, excessive use of large text throughout the entire email can trigger automatic spam detection, sending your emails straight to the spam folder. 

4) Use Smaller, Fewer, Optimized Images

Images are great for adding some extra style or substance to emails, but images can also introduce a lot of complications that are unique to mobile devices, namely unreliable and slow public wireless or older 3G connections. 

To ensure your emails load quickly, use smaller images and optimize each to further reduce the file size so the email doesn’t get hung up trying to load multiple 2MB or larger images. Anything larger than a MB per image can double or triple the amount of time it takes to load each email, and every second spent loading that email is another second the recipient can move on to another email in frustration.

Stick to one to three images per email, if possible. Think of each image you add as another second it’ll take to open and load that email. Fewer images is also preferred since most mobile phones (except for Apple) disables images for emails by default. Users have to opt-in to view images in emails on mobile devices. This means most of the images you add to your emails are likely showing up as blank spaces for most of your recipients.

Alternative text (alt text) is a great way to ensure that the point of each message is still conveyed even if the image fails to load. Alt text displays a short written description of each image that displays when an image fails to load images due to slower internet connections or the recipient’s email provider of choice preventing images from loading.

You can further optimize your images for emails with faster loading speeds by removing the excess meta information and tags that bloats the file size. Websites like TinyPNG, CompressPNG, and PS2PDF are great for compressing images. ImageOptim is also a great tool you can download to your desktop if you use a Mac.

If you have basic coding experience, you can ensure that images are always properly scaled to the email’s width by adding a style=”width:100%;” to an image tag, with the percent adjusted to meet the desired image width. Alternatively, you can use a style=”min-width:100%;” to prevent the image from passing the email’s width. 

5) Create Larger, Simpler CTAs

Calls-to-action (CTAs) need to be short, direct, and to the point with their messaging to account for the smaller mobile email format but also large enough to interact with without worrying about accidentally tapping another link. 

Here are some tips for making CTAs that get clicked:

• Make your CTAs to be at least 44 x 44 pixels (about the size of the tip of your thumb) for ease of tapping with a finger.

• Avoid relying on image-based CTAs. If the recipient is using an email provider that defaults to not showing images, or the recipient only sees images from verified email addresses, the CTA will show up as a blank space, guaranteeing they take no action from that email. 

• If you absolutely have to use image-based CTAs, which do often receive higher click-through rates that text-based CTAs, make sure to include alt text that mirrors the CTA text so the recipient can still take action even if the CTA fails to load.

• Successful email CTAs are most commonly found at or near the top of emails to ensure every recipient sees them. Place one CTA front and center in your emails, and avoid placing others further down. Not only does multiple CTAs increase the length of the email, requiring readers to scroll more, but it also takes away the significance of the first. Is your front and center CTA really all that important if there are others in the same email?

Having one clear, large, and up front CTA provides clear direction as to what you want your recipients to do and ensures that more recipients will see and click the CTA compared to CTAs that are buried further down the email.

6) Use Responsive Email Templates

Pulling all of the previous tips, best practices, and suggestions together, you can ensure that all of your emails are mobile-friendly while still looking great on desktops and larger monitors by using responsive email templates.

Gone are the days where coding knowledge and experience is needed to craft each message to automatically scale emails to best display automatically on multiple devices with various screen sizes. Responsive and fully customize email templates, like the ones offered in Finalsite Messages, our email marketing software, save you time since you no longer have to worry about manually adjusting each email for several screen sizes, providing you with more time to focus on the actual content of your emails.

Finalsite Messages also allows you to preview how each email will look on each device while you’re still building the email, giving you an accurate look into how the content is adjusted and scaled based on screen size. 

Preview and send a test email to yourself or your marketing and communications team(s) before you hit that send button so you can review the mobile experience in tandem with the desktop view before sending to your constituents or prospective families. 

Key Takeaway

These six quick tips should give you the perfect start to creating mobile-friendly emails that are proven to be more successful in connecting your school with your current constituents or prospective families. For more email marketing tips and best practices, check out our blogs on award-winning email marketing tips from Finalsite schools and seven school email marketing mistakes your school might be making (and how to correct those mistakes). 

ABOUT THE AUTHOR

As Finalsite’s Product Marketing Specialist, Andrew writes blogs and creates videos to share information about all the latest and greatest Finalsite products. Andrew has more than 10 years of video production experience and a journalism degree from the University of South Carolina. He has an incredible passion for movies, television, reading, and writing fantasy and science-fiction.