How to Craft a Perfect Email Signature: Tips for Leaving a Lasting Impression on Your Recipients

Email signatures have become an essential part of our daily lives. They provide valuable information about the sender in business communication. In this article, we will delve into the significance of email signatures and the best practices for creating them. Read on to enhance your brand’s image.

What Exactly Is an Email Signature?

An email signature, also known as an email footer or branded signature, is the final component of an email that recipients see. Typically, a business email signature includes details about the sender, making it an effective tool for introducing yourself or your company.

Different Types of Email Signatures

There are various types of email signatures to consider. Firstly, there are company-wide signatures and personal (individual) signatures.

Company-wide signatures can be divided into general and specialized ones. General signatures include the organization’s information without specifying a particular person. These signatures are commonly found in newsletters sent by companies.

01_company-wide_semrush

On the other hand, specialized or personalized company signatures contain the employee’s name and relevant details about the company.

02_semrush_erika

Personal or individual email signatures are typically used by professionals working independently, such as designers, writers, and photographers.

03_personal_Blue Modern Business Email Signature

Why Do You Need an Email Signature?

There are multiple compelling reasons why having an email signature is crucial, and we’ll highlight the most significant ones.

Establish Brand Identity

Including a logo in company-wide signatures helps customers easily associate emails with your brand, reinforcing its identity.

Ensure Consistency

Standardized signatures for employees’ emails promote coherence across different departments. You can allow employees to create their own signatures following a consistent structure.

Alternatively, personalized company-wide signatures can be created for each employee. This ensures that when customers interact with representatives from various departments, they receive emails with reputable signatures that align with the brand’s identity. This coherence builds trust in your company.

Drive Website Traffic

Adding a link to your company’s website in email signatures is an effortless way to direct traffic. Clicking the link in an email is convenient, and customers who reach the end of the email are more likely to visit your site. Consequently, you can improve your position on search engine results pages with minimal effort.

Inform Customers

An effective practice for email signatures is incorporating banners that inform recipients about:

  • Recent content, such as blog posts or case studies.
  • New products or services.
  • Sales, discounts, or promotions.
  • Upcoming events, like conferences or webinars.

By creating standardized company-wide signatures and customizing them for different departments or employees, you can ensure that the target audience receives relevant information.

Exude Professionalism

For individuals working independently, a visually appealing email signature showcases vital contact details and leaves a lasting impression with a personalized professional touch. Such signatures serve as a reminder to clients about your job or services, encouraging them to collaborate with you.

Effective Guidelines for Email Signatures

Here are some valuable guidelines to assist you in crafting a remarkable email signature.

Optimal Size and Format

Avoid overwhelming your signature by adhering to the golden rule of simplicity. Determine the essential information to include and keep your signature concise and organized. Overloading it with excessive details may divert attention and harm your reputation.

Typically, a professional business email signature comprises approximately seven lines, with each line containing around 72 characters. This ensures that you incorporate key contact information without burdening the signature with extraneous data.

04_size_White Green Simple MArketing Sale Email Signature

When it comes to dimensions, aim for a height of 150px-200px and a width of 300px-600px. These dimensions provide ample space to showcase necessary details while maintaining a visually appealing appearance across various devices.

Strategic Space Allocation

Organizing the space within your signature is crucial for prioritizing information. Employ a hierarchical structure to present your data, placing the most important details first. Additionally, consider incorporating dividers to effectively separate elements and enhance their prominence.

05_organize_space_Modern Email Signature Template

Also, evaluate the white space in your design to ensure that each component of your email signature is easily distinguishable. A well-balanced use of white space enhances readability and overall visual appeal.

Choosing the Key Elements of Your Email Signature

Consider the nature of your signature, its primary purpose, and brand identity. Ensure that your signature adheres to your company’s style in all aspects.

Fonts

To be on the safe side, use commonly used fonts such as Times New Roman, Tahoma, Arial, Courier New, Georgia, or Verdana. These fonts are easy to read, allowing customers to process the text quickly. Additionally, they are supported by most browsers and devices, minimizing compatibility issues.

Rather than experimenting with different fonts, draw attention to your text through font style and size. Opt for larger letters for vital information. You can also use bold, italics, and an additional color for emphasis. However, avoid using too many font variations, as it can be overwhelming.

06_fonts_Light Academia Email Signature

Images in Email Signatures: Best Practices

High-quality images are crucial for email signatures. Low-resolution pictures can diminish the impression and have a negative impact on your brand. Typically, email signatures include employees’ headshots with neutral backgrounds. It is advisable to use headshots rather than full-body photos.

You can also incorporate your brand logo into both employees’ and company-wide signatures. However, be mindful not to include an excessive number of images. Limiting it to two is optimal.

Colors

Following best practices, select your brand colors for email signatures. Using these colors ensures consistency and brand recognition. Choose up to three colors or shades from your logo and experiment with your signature. Be cautious not to use too many colors, as it can make your signature appear unprofessional and flashy.

One option is to go for a minimalistic design with a white background and black text.

07_Black White Simple Business Card

Alternatively, you can apply your brand colors to the text and background. Ensure that the chosen colors are not too light; opt for dark and high-contrast shades for better visibility.

Contact Information

An email signature serves the purpose of providing customers with information about the sender and additional ways to contact them. Ensure that your signature includes the following details:

  • Employee’s name and title (for personalized company emails) or your name and title (if you are an individual professional)
  • Company name (preferably with a logo)
  • Website address (make sure it is clickable)
  • Email address
  • Social media icons

Tips for Social Icons

When creating company-wide signatures, it is essential to include social media platforms that best represent your brand. For example, you can add links to your brand’s Facebook, Twitter, YouTube accounts, and blog. Customize the social icons to match your style and chosen colors.

08_oxford_u_p

For employees’ signatures, choose professional networks like LinkedIn instead of directing customers to personal pages. Avoid including too many icons to maintain a clean design.

Company Slogan

Adding a company motto to your email signature is not mandatory but can help support your brand identity. Consider incorporating your slogan if it aligns with your content. However, avoid including unrelated quotes, even if favored by employees.

Awards

If your company has recently received notable awards, showcasing them in your email signature can enhance trust and brand awareness. However, including this element is optional, and your signature can function effectively without it.

Disclaimers, Legal Notices, and Confidentiality Clauses

The inclusion of disclaimers and legal notices depends on the country and industry in which you operate. Certain industries such as finance, banking, and law often require disclaimers in emails. Email signatures may also contain a confidentiality clause stating that the information is intended solely for the recipient, protecting data from unauthorized use.

09_coursera

Incorporate Calls-to-Action

Calls-to-action (CTAs) are an essential component of email signatures. They serve as a convenient way to connect with and engage your audience. Some common CTAs include:

  • Subscribe to our channel, blog, social media accounts, or newsletter.
  • Place an order and enjoy a discount (use promo code provided).
  • Leave a review if you have already purchased our products.
  • Explore job opportunities if you’re interested in joining our team.

By aligning your email signature CTAs with your marketing goals, you can effectively drive website traffic and increase conversions.

10_call-to-action_goodreads

Ensure Signature Responsiveness

To cater to the increasing number of individuals who read emails on mobile devices, it is crucial to make your signature responsive. This demonstrates professionalism and reflects your commitment to providing a seamless experience for all customers.

Tailor Your Signature to Your Audience

For optimum efficiency, create multiple signatures that cater to your customers’ specific needs. Start by including general information in the signature and then segment your audience to add the most relevant data. You can even incorporate different banners to achieve this.

Additionally, consider allowing employees to have multiple signatures. They can use longer signatures for outgoing emails and shorter ones for replies. Experiment with various signature variations to determine what works best and select the most effective options.

Verify Email Signatures Thoroughly

Having multiple signatures for different departments and employees increases the likelihood of inconsistencies. To ensure a professional appearance across all signatures, it is essential to carefully check them.

Firstly, confirm that all signatures adhere to the same format and include necessary information. This consistent approach demonstrates attention to detail and reinforces your brand’s image.

Secondly, meticulously review all links within your email signatures. Broken links can leave a negative impression on recipients and potentially damage your reputation. The impact grows as more individuals attempt to open broken links in branded emails.

Rely on Professionals for Code Creation

Creating functional code that works seamlessly across all email clients or apps is a vital aspect of effective company email signatures. While you may design and save the visual representation of your signature, entrusting the development of HTML code to professionals is recommended if you lack expertise in this area.

Online email signature generators are available and user-friendly, allowing you to generate signatures on demand. However, these resources often have limitations in terms of design and functionality.

By working with a professional developer, you can discuss your specific requirements, such as the information to be included, the need for multiple signatures, and the targeted email clients. This ensures that you receive precisely what you desire.

Regularly Update Signatures

In addition to verifying the functionality of signature elements, such as links, regular updates are crucial. Employee turnover, the creation of new departments, and changes in contact details necessitate signature updates. Similarly, if you incorporate banners into signatures, it is essential to provide customers with up-to-date information.

Wrapping Up

In conclusion, crafting effective email signatures involves strategic decisions and careful considerations. To ensure a professional appearance, it’s crucial to customize social icons, consider including professional networks, incorporate calls-to-action (CTAs), and display any notable awards.

In addition, depending on the specific industry, legal notices or disclaimers may be required. It’s essential to tailor your signatures to your audience, ensuring responsiveness for mobile users, and allowing for variation in signature length based on context.

Regular updates and thorough verification of all elements, particularly links, are necessary to maintain relevancy and functionality. Finally, for complex coding needs, consider seeking professional assistance to guarantee a seamless experience across all email clients.

These best practices, when implemented correctly, can enhance brand visibility, foster trust, and facilitate customer conversions.

Unleash the Power of Email – Team with The Site Slinger

Now, when you place your next PSD to Email order with us, you can get three months of unlimited MailChimp services free, no matter what your current plan is!

Do you need another reason to team up with the best people in the industry? Well, here you go! The Site Slinger is a MailChimp-approved Expert, and we are pleased as punch to announce it! What does this mean for you? Three months of complete email marketing freedom! If you use MailChimp, this is the deal you’ve been looking for. If you’re new to MailChimp, then this is a great time to get started.

mailchimp_experts

With The Site Slinger you get:

  • Email that looks great. We pay attention to the smallest details, down to the very last pixel.
  • Email that works great. No matter the screen size or email client, our templates load quickly and smoothly.
  • Email that sends great. Our markup can be easily integrated with all major email tools like MailChimp, ConstantContact, iContact, or Campaign Monitor.

Just Another Reason to Love The Site Slinger

Now, when you place your next PSD to Email order with us, you can get three months of unlimited MailChimp services free, no matter what your current plan is!

It’s easy as one, two, three:

  • submit your email project here
  • provide MailChimp the proof that you choose to work with experts: we just need your MailChimp username and your paid invoice for our services
  • get a confirmation from MailChimp.

Now get your newsletters out! Promote products, generate traffic, grow sales, all without spending anything! No MailChimp account? No problem! Just go to MailChimp and set up a new account. After you place your order with us, we’ll send your paid invoice with your MailChimp username to the MailChimp guys, and they will apply the deal to your account. Please note that the offer can be applied once per MailChimp account and it can only be redeemed towards email related orders only.

Successful companies rely on email campaigns because they work. Rely on The Site Slinger as your MailChimp Expert and unleash the power of email marketing for free for three months. It’s time to rock the inboxes!!

Christmas is coming! Download a Free Holiday Email Template! (PSD + HTML)

In the spirit of the holidays we’re giving our customers and blog readers a free holiday email template. It’s a responsive email template in a fully editable PSD format, with the full HTML markup included, hand-coded by our own Site Slinger team. It’s available for free download for your personal or commercial use. Edit away and have your mobile-optimized email template ready to go for your next email campaign.

Download a Free PSD + HTML Responsive Email Template!

In the spirit of the holidays we’re giving our customers and blog readers a free holiday email template. It’s a responsive email template in a fully editable PSD format, with the full HTML markup included, hand-coded by our own Site Slinger team. It’s available for free download for your personal or commercial use. Edit away and have your mobile-optimized email template ready to go for your next email campaign.

Great for advertising your holiday news or sales!

As the winter holidays are already upon us, you’re probably gearing up for those Christmas sales and other holiday events. Whether you are in marketing, event planning, or just need to send out a mobile-optimized email to your mailing list, we’ve got you covered with this free responsive email template. We’ve designed a great looking email ready for viewing on all major devices and email clients, including iOS, Outlook, and Gmail.

Mobile-optimized.

This email template was designed and hand-coded by experts to ensure a great mobile experience, along with full desktop viewing. Now days, more than half of emails are opened on mobile devices! It’s imperative your email reaches your audience when it’s convenient for them to view and act on it… without compromising the desktop aesthetics. We’ve put great effort into ensuring the email elements are mobile-optimized and appropriate for this holiday season.

We hope you’ll enjoy editing and using this free responsive email template, shared as a fully editable PSD and provided with hand-coded HTML – by our web development experts. If you need other PSD email designs converted to code, we can help! We’re experts at PSD to HTML, whether for emails or websites! Get your free holiday email template today!

Download

What’s Included:

  • Fully editable Photoshop file (PSD)
  • Hand-coded HTML template
  • High resolution image comp (JPG)

DOWNLOAD HERE

Preview

free-holiday-email-template-image

10 Proven Tips for You to Get Prepared for Holiday Email Campaigns!

At this time, when Christmas is coming, our main advice will be – do not try to just take from your customers (sell them something). Instead, give them as much as you can and your contacts will love you back. This approach pays off not only in Email marketing but also in life in general.

At this time, when holidays are coming, our main advice will be – do not try to just take from your customers (sell them something). Instead, give them as much as you can and your contacts will love you back. This approach pays off not only in Email marketing but also in life in general.

карт_1

#1 Don’t Just Sell – Investigate and Communicate

Yes, your contacts database is still a source for additional sales to you. But why limit yourself to just selling? These people can become a valuable source of information, insights, and inspiration for your business growth. Beta test your new products or services on them. Ask what they find good about your customer service and what could be improved, etc., etc.

If you focus on selling to your current contacts database too much, you will miss a more promising opportunity. Use these contacts to better learn about your potential customers in general, their preferences and fears. This knowledge will help you get more new customers and get a bigger market share.

Stimulate your current contacts’ feedback by offering rewards in various forms. Take criticism even more gladly than the praise.

#2 Use Permission-Based Lists Only

Never ever purchase any contact databases for Email marketing. If you are just starting your business it may look like an attractive opportunity. But in reality unsolicited Emails will more likely damage your reputation and not bring any sales.

People usually share their addresses with those who can provide some value to them. So offer this value in the form of educational materials, tips, hints or any other valuable pieces of information. It is surely easy to say but harder to do. But it is worth doing.

#3 Use Email Marketing Automation Software

Even if your contact database is small there are still several reasons to apply specific Email marketing automation software like Mailchimp, Act-on, etc. right from the start.

With this software you’ll be able to reduce the guesswork to a minimum as these solutions provide very valuable statistics regarding your campaigns (such as Open Rates, Click Rates, Unsubscribe Rates, Bounce Rates, etc.).

Another advantage of such solutions is that they use special technologies and methods to ensure the highest delivery rate. If you do it by yourself using your personal/corporate Email address, you are at much more risk to be blacklisted for mass mails (even if you use permission-based lists).

Yet another advantage is that Email marketing software allows you to manage targeting and timing of your messages, schedule campaigns, and automatically send out Emails at the specified time.

#4 Test, Test, Test

Before sending your message to your end consumers, try it on your own test accounts including Gmail, Yahoo, Hotmail, and any account using Outlook client (especially if you have lots of corporate addresses in your list since many organizations still use Outlook as the default Email client). Check the layout of your Email message on your desktop, tablet, and cell phone.

You may also want to test some of your offers on a limited number of contacts from your database before sending them to the whole segment or a complete database.

If you want maximum efficiency, you can split one segment of your contact database into several sub-segments randomly and try several different messages to find the highest performing one (A/B testing).

#5 Use Responsive Email Template

Mobile Email usage statistics show that more than 50% of all Email opens occur on mobile devices nowadays. In some industries this ratio is up to 90%. So even if mobile traffic doesn’t take any significant share on your website according to your Google Analytics, you still need to make your Email responsive.
карт_2
For this reason the ability of your Email message to be properly displayed on mobile devices is a must. If you already have a PSD file with your template, The Site Slinger will slice it to a responsive HTML template to save your time and efforts.

If your Emails contain links to some landing pages on your website, don’t forget to make those landing pages responsive, too.

#6 Get the Length Right

The length of your subject line and the Email itself is critical. The main rule is the more frequent your Emails are, the shorter they should be. Of course there are always some exceptions, especially if content is the feature of your business and consumption of that content is the feature of your customers. However, keep the volume of messages to the minimum possible.

The same is valid for Email subject lines. General recommendation and best practice here is to keep your subject line length under 50 characters. Such Emails always have higher Open Rates and CTR. Besides, longer subject lines are cut off on the majority of mobile devices, which additionally decreases efficiency.

#7 Keep Your Messages Easy to Scan and Perceive

People get lazier about reading and tend to pay more attention to rich media containing images, audio and video. Statistics show that rich-media messages generate much higher response rates. But it doesn’t mean you don’t need a text version anymore. Bear in mind Tip #4 Test, Test, Test, and experiment on your audience segments.

Use paragraphs, bulleted item lists, font bolding, columns. This will make the life of your readers easier and let them quickly scan your message for key points without going too deep into detail.

#8 Keep Track of Your Competitors and Industry Best Practices

Your competitors may become a wonderful source for inspiration and insights. You need to monitor them to keep track on what they do and how they do it. Do not afraid of borrowing and adopting their best features and know-hows. Your competitors’ achievements and best practices may build a good ground for your own strategy.

Keeping an eye on your competitors often helps to learn from their mistakes and avoid these mistakes in your own campaigns.

Keep track of latest design and Email marketing industry trends. Use free modern templates if you feel they perfectly cover your current needs. But craft your own personal designs as well.

#9 Keep Your Active Email Lists Clean

Pay attention to your bouncebacks and clean your lists accordingly. Distinguish between so called soft bouncebacks and hard ones. Soft bouncebacks mean that the Email address is generally valid but unable to receive your message because of temporary problems on the recipient’s side. Hard bouncebacks usually mean that the addresses have typos or the mailbox no longer exists.

Do not hesitate to delete hard bouncebacks from your active lists permanently, but keep them in inactive lists just for statistics and for the history. Otherwise you have the risk to be blocked by your ISP.

General recommendation for soft bouncebacks would be to categorize them in a separate list and make several attempts to deliver the message to them as part of your next campaign. If it doesn’t help, you should also move them to your inactive list.

Such categorization may help you understand your customers’ turnover and your minimum need for new contacts in order to maintain your database.

#10 Find Your Own Way to Success

Do not take industry surveys, best practices, and all those industry-related statistics too seriously. Of course you should take them into account, but in the end they all are just reference points, some kind of milestones and not verdicts.

Avoid copycatting your competitors’ strategy blindly even if they are well ahead of you. If you want to outperform them, you need to stand out from the crowd and invent your own unique features and style.

Do not afraid of experimenting and A/B testing, as they are the only means to find out what will work best for your business.

And don’t forget to wish your contacts Happy Holidays!

50% Christmas Discount on PSD to Email Conversion Services

This Christmas we’ve prepared something really special for you. Starting from December 04 until December 25, 2014, you can order our high-level PSD to Email and PSD to responsive HTML email conversion services with a 50% discount!

Christmas Is Coming – The Site Slinger Has Got Presents for You!

Dear friends,

This Christmas we’ve prepared something really special for you. Starting from December 04 until December 25, 2014, you can order our high-level PSD to Email and PSD to responsive HTML email conversion services with a 50% discount!

600x338_thesiteslinger_sale_blog

Do not loose this one shot! This amazing Christmas offer is available for a limited time only.

High-end packages are now available starting at $149 (usual price is $299) and they are as follows:
– Easy to update flexible table structure;
– Deeply commented HTML code;
– Inline and embedded CSS versions;
– Easy to customize template;
– Tested and working with all major mail clients & devices;
– Retina 3x Support!

The offer expires on the 25th of December, so hurry up and grab your 50% discount! Request a free quote to get started – no credit card is required!

Click Here to order your outstanding PSD to Email Template.

Enjoy the Holiday Season with The Site Slinger!

Download Yours Now: Free Email Template! (PSD + HTML)

It’s Valentine’s Day and because we [HEART] our customers and blog readers we’re giving away a free email template in a fully editable PSD format, available for download for your personal or commercial use. Edit away and have your mobile-optimized template coded and ready for your next email campaign. Perfect for advertising your next event!

Download a Free PSD Email Template!

It’s Valentine’s Day and because we [HEART] our customers and blog readers we’re giving away a free email template in a fully editable PSD format, available for download for your personal or commercial use. Edit away and have your mobile-optimized template coded and ready to go for your next email campaign.

Perfect for advertising your next event.

SXSW 2014, anyone? Whether you are in marketing, event planning, or just need to send out a modern email to your mailing list, we’ve got you covered with this free email template – created for marketing and promoting events. We’ve designed a great looking email ready for viewing on all major devices and email clients, whether iOS, Outlook, or Gmail.

Mobile-optimized.

This email template was designed with mobile in mind. As of now, more than half of emails are opened on mobile devices! It’s imperative your email reaches your audience when it’s convenient for them to view and act on it… without compromising the desktop aesthetics. We’ve put great effort into ensuring the CTA button is thumb-clickable, the text is legible, and the imagery makes an impact, all within a minimalist and modern layout.

We hope you’ll enjoy editing and using this freebie email template, shared as a fully editable PSD and provided with example markup – we’ve included the HTML for a variation of this template so you can see how this might translate to code. If you need your completed PSD email design converted to code, we can help!

Download

What’s Included:

  • Fully editable Photoshop file (PSD)
  • Example HTML markup of a variation we made
  • Image comp (JPG)

DOWNLOAD HERE

Preview

Free Email Template Preview

Placeholder image used in design is shared under Creative Commons. Source: Unsplash.

 

10 Tips for Designing HTML Emails

Love ‘em or hate ‘em, HTML emails are a wildly popular marketing tool and you will almost definitely come across clients that want you to build them.

Love ‘em or hate ‘em, HTML emails are a wildly popular marketing tool and you will almost definitely come across clients that want you to build them.

If you don’t know anything about HTML emails, they’re annoying to develop and break all the rules you’ve ever learned as a web designer, but being able to code them is a valuable skill to possess. Today we’ll look at ten quick and easy tips to get beginners started on the road to creating beautiful and functional emails.

#1 Use Tables

Wait what? Didn’t we abandon non-semantic table-based designs ages ago? Yep, and now you get to experience the joy all over again. Unfortunately, most email clients don’t support a plain old CSS layout like you’re used to. Instead, it’s back to the 90s and familiarizing yourself with cellspacing.

If you’re unfamiliar with table-based layouts, here’s a simple example.

	<table cellspacing="0" cellpadding="10" border="0"> <tbody><tr> <td width="100"></td> <td width="200"></td> </tr> </tbody></table>

Table Tools

If you want an easy way to build the basic structure of an HTML table, check out the free generators below.

#2 Use Inline CSS

HTML emails do support limited CSS, but you can’t use an external style sheet. Instead, you use inline CSS to style the various elements in the tables.

	<p style="background: #cccccc; color: white;">Some text goes here.</p>

The snippet above shows you the basic syntax for inline CSS. As you can see, the code is essentially the same, you just embed it right into the code of your HTML rather than linking to another document.

Inline CSS Tools

If you’re more comfortable using an external stylesheet during development, just use one of the tools below to convert it to inline styling once you’re finished.

  • Premailer: Converts CSS to inline styles and checks your code against email standards
  • HTML Inline Styler: Converts CSS rules into inline style attributes

#3 Nest Your Tables

Another quirk regarding email clients is that they are quite inconsistent when it comes to interpreting margins and padding. To overcome this problem, use nested tables whenever possible. The code is a little messier but you’ll have much greater compliance across the board.

To “nest” a table simply means to place one table inside of another. You can nest multiple tables, just be wary of overnesting and creating a huge mess. Some email clients start to get buggy around eight nests, but you should be able to come in far below this number for most of your designs.

#4 Watch Your Width

Several email clients are fairly limited in their width. For instance, consider the online Gmail client. Building a normal size webpage and then displaying it in the tiny Gmail window will force the user into awkward horizontal scrolling.

There are too many possible clients and screen sizes to code for every scenario so the consensus among the web community is usually just to keep your emails fairly narrow. As a rule of thumb, try to stay under 600 pixels wide in every email design you create.

#5 Be Careful With Images

There are several complications to consider when using images in HTML email. First, some clients don’t support background images, others do support them but will often have them turned off by default. This is by no means an argument that you shouldn’t use images in your design. The strongest selling point of HTML emails is that they surpass the quality and possibilities of the rich text already available in most email clients. Eliminating images altogether can really reduce the benefits.

Instead of completely abandoning images, just make sure that your message works fine without them. Use background colors as a fallback so any text will remain readable and test your layout with images disabled.

Another thing you have to be aware of with images is that you can’t (or at least, shouldn’t) embed them into the email. Instead, you’ll have to host them long-term on a reliable server and then link to them in your code.

Finally, make sure you watch your load times. People are used to clicking on an email and seeing the contents, not waiting for images to load. If you make me endure long load times, I’ll hit delete faster than you can explain why it’ll be worth the wait.

#6 Allow Easy Unsubscribing

HTML emails are most often part of a stream of newsletters subscribed to by a user. Many times users sign up for a service and don’t even realize it means they’ll be receiving a newsletter. Other times they consciously decide to sign up but change their mind later.

In either case, unsubscribing should be a painless process that virtually anyone viewing the email should be able to figure out. To accomplish this, include an unsubscribe link and make sure it’s easy to spot. Designers and marketers who attempt to hide this link lack integrity and respect for their audience.

If the person doesn’t want your email, they’re not reading it anyway. There’s no value in sending 10,000 emails to spam folders all over the world. It’s far better to know that those receiving your newsletter are actually interested.

#7 Consider Your Content Carefully

Marketers and business owners often see an email newsletter as the sole source of consistent contact with their customer base. They are therefore often tempted to fill it with as much content and information as possible. As a designer, help them resist this urge by designing a template that showcases a little information extremely well rather than a lot of information very poorly.

The key here is quality over quantity. No on will read a thousand word marketing email. You have, at the very best, 3-5 seconds to grab the average reader’s attention before they hit delete. Accomplish this with fast loading, attractive visuals, concise copy and clear descriptive headers.

#8 Include Other Viewing Options

In addition to including an unsubscribe option, you should present at least two alternate ways to view the email for anyone not receiving their preferred experience. For the minimalists, a simple text version is best. There are plenty of people out there who think that email should stay simple and simply don’t want to see your fancy-pants attention grabbing graphics.

At the opposite end of the spectrum are users who do want the full rich experience but are being held back by a buggy email client. For these users include a fairly prominent link (often at the top) that allows them to view the email in a browser. Because browsers are infinitely better for displaying HTML and CSS, you can even beef up the browser-based version by coding it more like you would a normal web page (or simply have the browser display the original version).

#9 Test Thoroughly

When designing a web page, one of the most annoying processes you have to go through is cross-browser testing. This process usually involves testing for Webkit, Mozilla, IE and maybe even Opera if you’re really dedicated. If you can believe it, designing for email clients is even worse!

There are upwards of 30 popular email clients, each with their own standards and varying support for different commands. To begin, test in the email clients that you have handy. Sign up for accounts with popular webmail clients like Gmail, AOL and Yahoo. Also make sure to test out the default apps for both Macs and PCs.

Obviously, you can’t test every client. If you’ve got the budget, sign up for a month of a service like Litmus during the testing phase. This will allow you to quickly get a preview of the finished product on 33 different email clients and is one of the best ways to ensure that everyone is covered.

screenshot

During the design stage, be sure to check out The Email Standards Project. This is one of the single best sources available for detailed reports regarding what is and isn’t supported by various email clients.

#10 Use a Template

The best way that I’ve found to begin the process of designing your first HTML email is to grab a template. Even if you have a very specific design in mind, modifying a professionally developed template rather than starting from scratch can save you countless hours in troubleshooting time.

This will also give you a good look into how other developers structure and style their tables. Just remember that if you’re going to redistribute or sell an email template as stock art, you shouldn’t be stealing from someone else’s work! In these cases, you’ll want to really know what you’re doing and develop your own structure from the ground up.

Free Email Templates

screenshot

Fortunately, you don’t have to pay a dime to snag some quality free templates from which to start your design process. Most of the premium email services offer free downloads to get you started, often with no signup required. Check out the resources below:

Conclusion

To sum up, when designing email templates, start with a good basic template, code like your dad did a decade ago, keep your content both conceptually and physically lean (less than 600 pixels wide), make it easy to unsubscribe and see alternate versions, and test like crazy.

Leave a comment below and let us know if you found the article helpful. Also be sure to share any bits of wisdom you’ve picked up along the way for designing HTML emails.