Learn, explore, apply instantly!
Email Signature Design Guide

 

A significant portion of our daily routines runs in parallel with numerous different digital communication tools such as Microsoft Teams, Slack, and WhatsApp. Of course, emails remain indispensable in the corporate world across all these communication tools. While communication within companies continues to shift towards instant messaging platforms, communication between companies largely appears in email traffic. This situation naturally increases the importance of the signature section, which is standard in all emails. So how should email signatures be designed? How are our digital business cards, which we expect to represent our company and us in a corporate manner, perceived by recipients? Our emails, or mails as they are commonly known, Office 365, Exchange, Gmail, Yandex, Windows, iOS, Android, mobile or desktop devices, Outlook, web or mobile mail applications, we have compiled this article for you on how to create signatures that will appear as intended across all these platforms.

 

  • WHAT TO CONSIDER WHEN DESIGNING A SIGNATURE
  • When designing a signature, it is important to keep it simple.
  • As no background image is added, a solid colour should be chosen for the background of text such as your name, email address, contact details, etc.
  • Images and icons to be used must be cropped to the size you want them to appear. It is recommended that the main background colour be white.
  • GUIDELINES FOR CREATING HTML EMAIL SIGNATURES
  • It is recommended to use the table tag instead of the span tag.
  • The width values of all sections should be defined as fixed.
  • All style properties should be applied inline within the HTML code.
  • Text sections must have all their style properties defined individually. Otherwise, email clients may render them differently.
  • After completing the HTML design in another editor, the source code or the design viewed in the browser should be copied and pasted into the application panel.
  • The img tag should never include a height value. In Outlook Web App (OWA) mobile view, images are often scaled by reducing their width to fit the screen, which can cause distorted aspect ratios if a fixed height is set. To ensure images remain proportional, only the width should be defined, and height should be omitted.
  • For p tags, always use style="margin:0px;". If top and bottom margins are required, define them explicitly (e.g., style="margin:7px;"). By default, p tags add excessive margin, which may distort the layout.
  • Avoid leaving unnecessary spaces on the left side of email signatures, as this may cause unwanted shifts in mobile view.
  • In signatures with a logo on the left and content on the right, make sure to add proper spacing between the logo and the text. If spacing is not defined (via td or margin settings), the logo and content may overlap in mobile view due to layout compression.
  • The line-height style is ignored in the Outlook desktop app but may appear differently when accessed via the web.
  • Always specify the font type and font size for text areas.
  • Remove unnecessary nested table structures to keep the code simple.
  • Width definitions inside div or p tags may not work in some email clients. If a fixed width is required, use a table instead.
  • For vertical spacing, setting a height value on tr or td will not work if the cell contains text (e.g.,  ). In such cases, define a font-size or use margins, which is the easiest and most reliable method.
  • Managing Email Signatures Effectively

It may not always be feasible for companies to redesign their email signatures in HTML or approach an agency every time updates are needed. In such cases, you can use ready-made email signature templates.

If you feel comfortable working with Microsoft Word, you can also design your signature there by inserting standard tables, allowing you to adjust signature dimensions more flexibly.

Once you’ve designed your signature, it might feel like you’re ready to go — but the real questions begin here:

  • How will you roll out the designed signatures across the entire company?
  • As employees’ phone numbers or job titles change, how will these details stay up to date?
  • How can you ensure that every signature appears exactly as you designed it?
  • And perhaps most importantly, during special occasions, anniversaries, or campaigns, will you need to repeat the entire process from scratch just to make updates?

To make answering these questions easier, you can explore the centralized email signature management solution SIGNandGO (SIGNandGO). With SIGNandGO, you can either import signatures you’ve designed in Word or use an HTML design prepared by your agency to create signature templates. You can define who uses which signature with simple filters and roll out the designed signatures across your company in just a few steps — without disrupting users.

With scheduled signature templates, you can prepare in advance for special occasions or campaigns. By including banner areas in your signatures, you can dynamically manage your email communications, reduce manual effort, and boost productivity.

Now you’re ready. In the next step, discover how to turn your email signatures into a direct marketing tool with banner ads and learn how to track click statistics on the links within your signatures by exploring our other blog articles.