9 Tips for Designing an Email Signature in 2019

Default avatar.
February 14, 2019
9 Tips for Designing an Email Signature in 2019.
It’s no secret that email signatures have a major impact in the world of email marketing. It’s also clear that they are one of the easiest ways to re-engage with your existing customers, without spending any (or very little) money. Successful businesses are using the untapped power of their email signatures because they know that decisions are all about prioritizations based on invested effort vs benefit. Let’s take a look at how you can revamp your email signature for 2019 to give it that “pop” factor.

1. Create Your Signature with Mobile in Mind

It’s amazing how many people completely skip over this step, without knowing the consequences. Mobiles account for 46% of all email opens, meaning that testing your email signature for mobile compatibility is essential. A common misconception is that your email signature will be compatible across all email clients. The sad truth is…it won’t. Although I would love to blame Outlook for this, the reason is actually that most email clients (mobile included) use different HTML rendering engines and that means they all display email signatures differently. In addition, mobile screens are much smaller than PC displays, and they also use scaling. Because of this, vertical layouts work much better on mobiles. Using a wide layout on mobile devices can cause your signature to look squashed and the images to be scaled up which makes them look blurry.

2. Include Only Essential Details

The details a college student includes in their signature will be a lot different to the details a lawyer includes. Only include the details which are relevant to you. For example, if you’re a college student, you would probably include the university you’re attending and the subject you’re studying. You wouldn’t include those details if you’re a lawyer. Most people aren’t interested in knowing your favorite band, or color. Your email signature should include the information needed to contact you, and any other relevant information. If you’re unsure, ask yourself “Would I give that information to a business associate I had just met?”. Here are the most popular fields to include in your email signature:
  • Full Name
  • Job Position
  • Company
  • Mobile Phone Number
  • Office Phone Number
  • Office Address
  • Profile Picture and/or Logo (or both)
  • Social Icons (optional, but recommended)
  • Promotional Banner (optional)
  • Disclaimer (optional)
Details which are not needed only bloat the signature and make it hard for your recipient to find the details they actually need.

3. Consider Fonts

A font can completely change the look and feel of an email signature. The same can be said for the colors and spacing. You should never use multiple fonts in your email signature. The only exception is if your logo uses a different font to your signature. In terms of font sizes, you shouldn’t have more than 2-3 different sizes throughout your whole signature.

4. Use Colors Which Reflect Your Brand

Like fonts, keep your selection to around 2-3 different colors. Any more and you risk creating that “rainbow email signature”. It’s important that the colors match your logo as much as possible. Otherwise, your logo can look misplaced, or your signature could have that “template” look which you don’t want.

5. Use Beautiful Images

In sales-based roles (such as real estate agents) where you’re dealing directly with the public, using an image of your face can add a personal touch to your signature. If you’re not too fond of using a profile picture in your signature, you can just use your company logo. Only use good quality images which have been professionally taken. Use PNG or JPEG type images for maximum compatibility and always ensure you compress them using a tool like TinyPNG. PNG’s work best for logos and when you need transparency in your images. JPEG’s are best for profile pictures where the color quality needs to be perfect. Avoid using GIF animations (more on this later).

6. Tweak the Spacing

Behind every great looking email signature is consistent spacing. If you’ve got 10 pixels of spacing above the contact information, then you should have the same spacing under the contact information too. The same goes for all sections of the signature. Consistent spacing makes the signature look professional and clean, even at a quick glance. It also makes it easier to spot information that you’re trying to find.

7. Keep an Eye on Size

With email signatures, there’s 2 sizes to check. The size in pixels, and the size in kilobytes (KB).

Size in Pixels

The size in pixels determines visually how big your signature is, and whether it will fit mobile screens. Keep in mind that narrower signatures look better on mobiles because of screen sizes and scaling. For desktops and larger screen sizes that don’t use scaling, the recommended maximum email signature size is 700(w) x 300(h) pixels. For mobile phones which have smaller screens that use scaling, the recommended maximum email signature size is 320(w) x 600(h) pixels. Checking the size of your signature is as simple as opening your signature in a web browser like Google Chrome, right clicking on it and clicking inspect element. You should then be able to hover over the outer most table, and it should show you the height and width of the signature.

Size in KB

The size in KB is the amount of disk space the email signature will take up when it’s stored on a mail server. If you send roughly 30 emails a day, your email signature will be stored 30 times on your server, which can take up valuable space in the long run. And that’s only with you sending emails. If you have multiple staff sending emails, it can add up very quickly. You should aim to keep your email signature under 50KB in size. There generally isn’t a need to have an email signature that is any larger (even if you have a promotional banner).

8. Test Your Email Signature for Compatibility

Remember earlier we touched on the subject of email signature compatibility? To ensure your signature looks the same in all email clients, you must cross test it between all the popular email clients. Just because your signature looks perfect in Outlook, doesn’t mean it will look perfect in Gmail.
  • This is an example of how cross testing should be done:
  • Sending from Outlook 2013 to Gmail
  • Sending from Outlook 2016 to Gmail
  • Sending from Gmail to Outlook 2013
  • Sending from Gmail to Outlook 2016
…and so on. Hopefully, now you can see what an enormous task cross testing can be if want your signature to be compatible with the top 10 email clients. Just because you have done cross testing, it doesn’t mean that your email signature will work flawlessly in all email clients. For example, Gmail inserts gaps below images, and there is nothing you can do about it. Sometimes you can fix compatibility issues, other times you simply can’t.

9. Things You Shouldn’t Do

Don’t make your whole email signature an image

If you’re considering making a fancy email signature, but you can’t do it using HTML + CSS, then either change the design so it can be coded, or don’t do it at all. Whatever you do, don’t make your whole email signature an image, as the size (in KB) is usually large and your recipients won’t be able to copy your phone number or other details out of it. Basically, it screams “I care more about looks, than I do about functionality”. Also, you can’t do split testing on things like CTA buttons, and you can’t easily make changes to the signatures.

Don’t Over Complicate the Design

A simple design goes a long way. Don’t think of your signature as needing to cram as much information into it as possible. Simple designs are easier to code, and also have a much higher chance of looking consistent across all mail clients.

Don’t Insert GIF Animations

Animations are fun to look at, but most of the time they don’t work with email signatures. In addition to possibly being perceived as immature, animations don’t always technically work with email clients. Some email clients convert GIF animations to still images. So, if you have an animation of your head moving around, your recipient might see a still image of the side of your head…not a good look.

Don’t Use Inspirational Quotes

There isn’t enough room for them, and the idea is to keep your email signature clean and clutter free. Avoid using quotes in email signatures, unless it’s something like a CEO quote that enhances the brand image.

Conclusion

Creating an email signature is quite straight forward as long as you keep these tips in mind. Hopefully, now you should be fully equipped to make a really great looking email signature that will be compatible and at the same time have all the features you want. Featured image via DepositPhotos.

Gordan Banjac

Gordan Banjac is the co-founder of Gimm.io, an email signature development platform. With extensive experience in Web Design and IT Managed Services, Gordan has dedicated the last six years to learning as much as possible about email signatures. When not working, he is usually traveling with his family along the southwest region of Australia.

Read Next

LimeWire Developer APIs Herald a New Era of AI Integration

Generative AI is a fascinating technology. Far from the design killer some people feared, it is an empowering and…

20 Best New Websites, March 2024

Welcome to our pick of sites for March. This month’s collection tends towards the simple and clean, which goes to show…

Exciting New Tools for Designers, March 2024

The fast-paced world of design never stops turning, and staying ahead of the curve is essential for creatives. As…

Web Tech Trends to Watch in 2024 and Beyond

It hardly seems possible given the radical transformations we’ve seen over the last few decades, but the web design…

6 Best AI Productivity Apps in 2024

There’s no escaping it: if you want to be successful, you need to be productive. The more you work, the more you…

3 Essential Design Trends, February 2024

From atypical typefaces to neutral colors to unusual user patterns, there are plenty of new website design trends to…

Surviving the Leap from College to Real-World Design

So, you’ve finished college and are ready to showcase your design skills to the world. This is a pivotal moment that…

20 Mind-Bending Illusions That Will Make You Question Reality

Mind-bending videos. Divisive Images. Eye-straining visuals. This list of optical illusions has it all. Join us as we…

15 Best New Fonts, February 2024

Welcome to February’s roundup of the best new fonts for designers. This month’s compilation includes some innovative…

The 10 Best WordPress Quiz Plugins in 2024

Whether it’s boosting your organic search visibility or collecting data for targeted email marketing campaigns, a great…

20 Best New Websites, February 2024

It’s almost Valentine’s Day, so this latest collection is a billet-doux celebrating the best of the web this month.

Everything You Need to Know About Image Formats In 2024

Always trying to walk the tightrope between image quality and file size? Looking to branch out from JPGs and PNGs this…