Friday, March 29, 2013

your email sucks - your font's message is more powerful than your own

with this installment of "your email sucks" i thought i would do more than just point what's wrong with the email, but that i would also actually attempt to fix it. here goes nothing.

today, while looking through my twitterfeed, i stumbled on this email announcement from attractionsmagazine.com. there is no doubt in my mind that their site is cluttered, and clutter makes it hard to read. it's one of those sites that is full of great information, but it's so visually cluttered that you get tired not from reading all the great stories, but from refocusing your attention to the content you're trying to read.

newsletters for sites like this can be a great way to allow your readers to become laser focused on your content -- without having to have lasik to correct the damage caused by eyestrain. but when your cluttered mentality - forcing the most content with the most number of ads onto a page - invades your newsletter, along with a poor font choice and you've just set yourself up for a high number of unsubscribes and low impressions.

just so that we know what we're dealing with, i've attached a screenshot of their website to the left, like i said, it has that more ads = more impressions layout.

next we'll look at the newsletter, go through some constructive criticism, and then like i said, i'll attempt to fix it.

here is how their current email appears today:
attractions magazine - before

it's pretty basic, and i was pleasantly surprised that they actually use mailchimp for their emails.

before we get to what's wrong with this email, lets look at some of the things that they got right:
1. the email is is 600 pixels wide. this is good that they aren't stretching the email across the full screen.
2. the email uses a two column layout, keeping story content separated from the paid/advertising content.
3. they attempt to make use of white space with horizontal story dividers, breaking up the stories.
4. they have a can-spam compliant footer! something i have seen missing from a few of the emails i get these days.

okay that was difficult, but i eked out a few things that are good about this email.

what can be improved with this email, to increase readability, open rates, and make advertisers feel like they are in a professional publication and not a term paper:
1. start by increasing the width of the email to 640 pixels. the email will scale better to iOs devices, this by the way is the tactic that most people take when they don't have a developer or coder on staff to "optimize" their emails for mobile readers.
2. create white space through increased line-heights and padding to increase the readability.
3. pick a consistent font, and use color and bolding for emphasis to increase the readability.
4. employ methods of organization to keep the advertising from running into the content.
5. better use pre-header text to entice reader to open; using pre-header text will also help to make your email more mobile friendly - this text is displayed for the google snippet and the preview text for mobile email clients.
6. include links to view the email in a web browser and forward to a friend on the same line as the pre-header text.

and most importantly, to make the email look professional - they are going to the expense of using mailchimp and selling advertising in their newsletters after all - is to choose a more up to date, easier to read font. the original uses times new roman (or something similar) - and it's not the font used on the website so branding as an excuse is out - unfortunately with the everything else going on with the email, it really dates the design and makes the communication that much harder to read.

attractions magazine - after
so with those ideas and things in mind, i set out to make improvements in the email, keeping the same basic design, but increasing the white space and better organizing the content, i.e. using a different color side bar to separate the advertising. i think for the most part it came out looking better. for the record, i did all seven (7) of my suggestions, and did it rather quickly, if i had more time (or was being asked to do this not just do it for the purpose of my blog) i would have put more time and effort into it to really wow the readers.

you'll notice that there is a blue line down the left hand side of the email, this is the same blue background used on the original email, and i included it in this illustration to show the left hand side of the page. i added padding to all of the pictures and the horizontal line story dividers, which gives a polished appearance since the content and the pictures don't run to the edge of the page.

my biggest pet-peeve with this email was the use of the font. so using a different font, i used the font family of arial, helvetica, sans-serif, and increased the line-height which helps with white space and with making the email more readable. not to mention the professionalizes and updates the overall general look of the email. it no longer looks like someone just threw this together when they were working on their high school term paper (which is where times new roman should be kept) and makes it look like a competent web outfit put it together and would make me more willing to pay the price of advertising to be included in this far-reaching email.