how to design a dynamic template of email signatures

You're willing to design a new template of email signatures for your company? Or you want to make sure, you're design' agency proposal can be applyed? Discover 6 tips to make sure email signatures will be correctly displayed on all devices.

Discover 6 tips to prepare your email signature template.

1. Typography: font and uses.

Compare to websites, the messaging services are much more restrictive in term of font possibilities. Fonts cannot be embeded and automatically applied in exchanges. It means a font defined in your email signature' template will only be displayed on your contact's messaging service, if the font is already active on his/her device.

Here are 2 advices to prepare your email signature template :

  1. Choose common fonts for the text displayed on HTML email signatures.
    Here is a grid to compare Mac and PC's default font installed on dekstop.  
  2. Prepare a scenario of possibilites if you want to use a dedicated or less common font.
    For example on the style settings of your element:

    "font-family: My Dedicated Corporate font, Arial, sans-serif;"

    On this example, if your contact has the "My Dedicated Corporate font" installed on his/her desktop, informations of the signature will be displayed with it. If not, "Arial" will be used. And if the "Arial" font is not installed, the default "sans-serif" font will be used.

2. Design social network icons.

Sigilium helps you display social networks icons on email signatuers. In order to help you benefit from a large range of up to date icons, the design is based on FontAwesome's icon system. You can define, the color and shape of the icons. And they will be displayed automatically depending on the informations filled.

3. Colors.

Avoid too much colors on your email signature templates. Help people focus on your marketing banners and content, with a restricted range of colors for the contact details and the icons.

The color advice : use 1 or 2 colors is the key to be more efficient, corporate and distinctive. It will help youAnd ensure graphical consistency of your teams.  

4. Width and height of the email signature.

To make sure your email signature is well displayed on every device, Sigilium requires to use a width of 450 pixels. It helps you get a polyvalent size or email signature, and will correctly display it on desktop as well as on mobile devices.
Avoid larger email signature templates, whey will require a scroll action on mobile devices to see it completly.

About the height of the signature, keep the contact details part short, to maxime vilibility of your content and banners. 

5. Dynamic content 

When preparing your email signature template, do not forget informations can be short or very long depending an users. For example, a jobtitle can be very short : "CEO" or more specific : "International Recruitment Manager".

This means you need to anticipate various width of elements when preparing your template. Our advice : Work on the worst cases to make sure your design is fonctionnal and though.

Notice you can preview the render on various cases, selecting different users on the design section.

6. Design the signature' template with a banner 

When creating your template, prepare your layout with a marketing banner, because most of the time your content and marketing teams will create and display content.

Width of the banners displayed are 450 px.     

Need assitance? 

The Sigilium team will be happy to share more tips, and review your HTML template! Just book a meeting on the platform, or talk with us at : / +33 1 83 64 02 13. 

Still need help? Contact Us Contact Us