We hope you like reading this blog post. If you would like the Boost IT team to just create your new email signature for you, click here.
Communicate in a space where you don’t have to compete with other ads. At no extra cost, make this marketing channel work for your small business.
Gather all your employees in a room. Tell them to pick a marketing strategy to promote your business. You would get people clamouring for social media channels, for trade shows, for a podcast, networking events, and car wraps. How many would sit back in their chair, think about the myriad of options, and confidently suggest, “let’s get a business email signature”? And yet…
An email signature is a block in the email footer. Modern email signatures are digital business cards. How many emails leave your organisation daily? How many people do they land in front of?
Company email signatures provide the real estate to:
- build your brand
- build awareness of your products, and the breadth of what your business offers
- promote events, new products, award announcements, or a value-add service your business offers.
And all of that in that sweet, sweet spot of undivided attention and zero competitor ads.
Think about those hundreds of emails that get sent to suppliers and clients who may only be aware of a subset of what you offer. Don’t forget staff that send emails out to their son’s teacher, their best friend who works at an ASX 200 company, or their father, to tell him to please, please stop dropping trolley loads of jokes in their inbox. Remember all those recipients who forward a conversation about your service, and could be displaying your business email signature.
If your business is not making the most of this marketing channel, it’s time to start now. Real estate this valuable is not usually free to use. Plus, you don’t have to camp overnight in a queue to nab it. Setting up a professional business email signature will involve a small investment in time. Money will only come into play if you don’t have the in-house expertise and choose to trust an email signature design services instead. But trust us, the recipe isn’t difficult.
How to make a professional email signature? Get your grocery shopping pen and paper and start jotting down the signature template.
Ingredient list
• Sender’s basic info : name, title, office address and contact details • An image – choose 1 from logo / product image / staff profile photo / banner • Strain fonts until there’s 1 type left and ensure it is a “websafe” font • Two font colours • Dividers and whitespace • Social media icons linked to profiles – only if you have active, interesting accounts • Company website with a link • Call to action – just one, choose what you’d like to promote • Someone who can code in HTML or a HTML converter tool • Notepad (Windows) or TextEdit (Mac)
• Chocolate (it’s on all our checklists)
Recipe
This HTML email signature recipe includes step by step instructions.
Looking for professional business email signature examples? Don’t worry, the article is peppered with modern email signature designs and ideas to cover all industries.
Click the links below to jump to steps quickly.
Step 1
How to get your design to look professional
Step 2
How to convert your design into HTML so it renders properly on most device screens and the links and images are clickable
Step 3
How to add images
Step 4
How to add social media icons and link them through to all your brand’s social networking pages
Step 5
How to save the email signature
Step 6
How to install the email signature
Selecting Fonts
The appearance and availability of a font in an email message depends on the client and device used to read your email. If fonts used in your email signature are not supported by the recipient’s environment, these fonts are not displayed or they get replaced with other available fonts. That is why it’s better to avoid these problems by preparing your email signatures properly and selecting a web safe font.
If you want to make sure your email signatures are correctly displayed on all clients/devices, use only the most common fonts (known as web safe fonts). These fonts are supported in the majority of environments. The following fonts are known as safe to use:
Arial, Arial Black, Gadget, Comic Sans MS, Impact, Charcoal, Lucida Sans Unicode, Lucida Grande, Tahoma, Geneva, Trebuchet MS, Verdana, Courier New, Lucida Console, Times New Roman
To protect your signature against situations where a font is missing on the recipient’s platform, we define one or more fallback fonts – they will be used if the primary font is missing.
How to get your design to look professional
Keep your business email signature to the point and tailored to your brand. Identify the Sender and make it clear what their role is within the organisation.
People don’t always scroll to the bottom. Optimise your design to communicate effectively. Prioritise by including the important information at the top of your email footer design.
Keep it short and sharp, no more than 7 lines. Don’t add your cat’s name, your fave local pub, or an inspirational quote. A professional business email signature is not a memoir.
Use scale, colour, and font weights to visually signal to your email recipients which elements of your signature they should read first.
Align your design to the left. The difference between a neat, organised, effective and elegant email signature, and one that just looks thrown together, is alignment. The step below explains how to convert your design to HTML and uses properties of a table to align elements.
Use only 2 font colours. Black font is easiest to read on screens. Choose a second colour from your logo/branding for spice. More and your email footer design will look cluttered.
Choose a websafe font for your email signature design. Choosing something fancy is taking a risk. If your reader hasn’t installed that specific font on their computer, they will only see a fallback font in their email footer. Go simple. Choose a websafe typeface such as Arial, Georgia, Times New Roman or a variation from the same font family. You can use bold font (a different font weight) or a larger size to highlight information.
Separate the different content so readers can scan each item when creating email signatures. Dividers help create an easily digestible content. Options for dividers are the pipe “|” or using text colour or weight.
Using whitespace between the elements can ensure that your design won’t be swarming with details and appear overpowering to the eye. This unused space helps create an elegant email signature, just as much as style colour and signature style.
Make sure it’s mobile device friendly. Narrow designs work on small and large screens. Test your design on smartphones and tablets.
If you can, check your signature between Mac and PC, Apple mail might render the email footer design differently.
Use your email signature as a marketing tool. You can promote your podcast, services, latest article or next conference.
How to convert your professional email signature design into HTML so it renders properly on most device screens and the links and images are clickable
Most email clients don’t render email signatures perfectly, even those coded with HTML. And we mean 100% perfect, not a single pixel out of place. Like viewing a web page on Chrome versus seeing it on Safari, each email app has its own way of interpreting the code.
HTML coded signatures keep mail apps playing by a standardised “uniform look” rules, even if there is minor discrepancies in the way they render. Ensure your professional email signature format works across most email apps by translating your design to HTML.
Outlook has some very particular ways in which it handles HTML due to it utilising the Microsoft Word rendering engine. Even if you do know how to code in HTML, there are several unsupported HTML tags.
We recommend having someone who understands the how to get the email signature to display as intended.
There are HTML tools like “WordtoHTML” to translate your design, however it will include unsupported HTML tags that can cause Outlook to render perhaps not as you intended.
HTML tips for rendering in Outlook :
Resizing using px
This is the main offender of a lot of issues in Outlook HTML email signatures. If you include “px” as a unit of measurement Outlook will render the element styled with that value at its original size ignoring the value. For example if I have an image that is 1000px wide and want it to be viewed in the email signature at 100px wide. If I style it using width=100px; the image will be displayed in the email signature at the full 1000px width.
The solution is to simply omit “px”, for example “width=100;”. Or use the alternative measurement system pt which pt is slightly larger than px so it is not as precise, however Outlook will acknowledge the style value when rendering pt.
Resizing using %
Whilst Outlook will render elements using the % style tag, the results are often unpredictable with the resizing of the element affecting other elements around it. It is best to avoid using percentages and use either no unit or pt as mentioned above.
Aligning images
Do not use the align style tag when aligning images in an email signature as this causes Outlook to delay downloading the image making it look incomplete.
Tips for using the WordtoHTML tool:
Make it easy to navigate. Use
Insert > Link
in the Visual Editor to add links for your phone number, website, business address so they are “tappable” on phones. Being helpful at every opportunity goes a long way. Search for your address on
Google Maps
, click on Share, copy the Google Maps link that appears into your design.
The alignment of the elements in the signature should be done using HTML tables. HTML tables, although a bit cumbersome to work with, seem to render fairly consistently across many devices and is well supported. Use
Insert > Table
and add each element to a table cell. Use at most 2 columns because people will view emails on narrow small screen devices. Mobile devices are the priority nowadays.
How to add images
All images in the professional signature need to be hosted somewhere like Google Drive or on your website. This is because the HTML image elements need a source URL. Those images need to be pulled from some online server for the emails to render correctly.
In the WordtoHTML tool,
- Use Insert > Image in the Visual Editor to add an image into a cell.
- Keep “constrain proportions” ticked.
If you are hitting goals on social media, add icons that link to your profiles. All your business transaction will translate into easy free email marketing.
Including social media links in your business email signature provides a great opportunity to gain new followers. It makes it easier for the readers to follow you and might increase the traffic to the company’s social profiles as well. Free social media icons for email signature are available here.
Use
Insert > Image
in the Visual Editor to add an image into a cell.
Keep “
constrain proportions
” ticked.
Use
Insert > Link
in the Visual Editor to add a link to your social media profile page in the
URL
field.
How to save your professional business email signature
Once you’ve completed your email footer design and used the free tool “WordtoHTML” to code it into HTML, follow these steps to save it.
In WordtoHTML, choose “Copy to clipboard”.
If you’re a Windows person:
- Open a new file in Notepad and Edit > Paste.
- Go to File > Save As. In “Save as type:” choose “All Files (*.*)”
Save the file with a name and add .htm at the end. For example, “Bill Murray.htm”
If you’re using Mac:
- Open the TextEditapplication by clicking on it. Look for the application in the dock at the bottom of the Mac screen or in the Applications folder.
- Choose File> New on the menu bar.
- Paste the contents of the clipboard. To save it without any text formatting, go to menu “Format > Make Plain Text” (or shortcut “Command+Shift+T”).
- Save the file with a name and add .htm at the end. For example, “Bill Murray.htm”
- Enter a name for the file in the “Save As”field and add the .htm file extension. For example, “Bill Murray.htm”
- A pop-up screen will ask if you want to append the standard extension .txt to the end. Choose “Use .htm.”
We do the technical stuff so you don’t have to.
How to install the email signature
Is everyone in your office running on different email clients and mobile devices? The task can seem overwhelming, scary and unachievable.
Staff could be using Outlook 2003, Microsoft 365, Gmail, Thunderbird, as well as mail apps on their Android phone or iPad. How do they all install their business email signature? Will they all need help with installation?
Click on the installation guides below for step by step instructions.
If your setup is not listed above, most mail apps have simple instructions on setting up email signatures. Simply Google the mail app name, and “set up HTML email signature”. For example, “thunderbird HTML email signature set up”.
Important to note for laptops and PCs, opening your HTML email signature in a browser, and copying and pasting that into your email app settings will not have the desired result. Your email app will “interpret” your business signature and create its own coded file. Which probably won’t be widely supported by mail apps. Instead, attach the HTML file which will use the correctly coded email signature design. That will appear as intended on most email apps.
Roaming Signatures Coming to Outlook
In July 2020, Outlook for Windows introduced email signatures that are stored in the cloud rather than stored locally on the user’s Windows device. It syncs your email signature across devices.
How does this affect your organisation?
- The feature is on by default. With this feature, signatures now are associated with an email account.
- Signatures are stored in the user’s mailbox and are available on any devices running Outlook for Windows that are configured with that email account.
- Outlook reads the existing local signatures, copies signatures selected as default for New messages or Replies/forwards to the account mailbox, making them available across multiple devices.
Lastly, here are apps that don’t support email signatures with formatting and images
Outlook for Android
Outlook for Apple
Outlook for Android and Outlook for Apple apps do not support HTML signatures. You cannot format text and images don’t appear in email footers. Signatures can only be text based with no formatting (like Notepad).
Upgrade requests have been sent to Microsoft but we could not find a commitment or timeline from them to adding it in.
At this stage, the workaround is to use a text-based email signature or choose a different email app which supports HTML signatures.
If after all this you still ask why email signatures are important and why you should bother, we have two words: free marketing. From event promotion email signatures to timeless and elegant email footers, those display your professionalism. They give you credentials and make your products better known. It’s a win-win!