How to create the dirección de correo electrónico signature in HTML for your

How to create the dirección de correo electrónico signature in HTML for your

If you use dirección de correo electrónico as a means of communication in your company, then surely you are interested in maintaining the identity of your company in each correo electrónico you send. There are many ways to achieve this, but one of the most effective is through the correo electrónico signature.

Customizing a signature so that it appears in each of the correos electrónicos you send is much more important than it may seem, it is not only an efficient method to strengthen the identity of your company.

For this reason, in this article I will teach you how to create an correo electrónico signature in a fácil way, so that you cánido attach it to your corporate correos electrónicos:


What is an dirección de correo electrónico signature and what is it for?

The signature of an dirección de correo electrónico or correo electrónico It is a piece of informative text that is made up of our personal data and main contact methods (telephone, correo electrónico, website, etcétera.) that is usually added at the end of an dirección de correo electrónico.

In this way, recipients will always be aware of who the sender of the correo electrónico is.

We cánido say that it is an extension of our brand identity and a direct way with which we perro “print” our identity in the correos electrónicos we send, in addition to providing some other important benefits that I will discuss later.

the signature It is often also known as the “pié de página” of the dirección de correo electrónicobecause it is found at the end of the messages, and is generally programmed to appear automatically in each message, so it is not necessary to insert it every time we compose a new message.

As a consejo: signatures bear a certain resemblance to corporate business cards, so if your company has business cards, it’s not a bad iniciativa to use these as a base model to design your signature.

Of course, it is not just about placing your name or that of your company.

The dirección de correo electrónico signature must meet certain requirements, which in this case would be the minimum information that you must add.

What information should a corporate dirección de correo electrónico signature contain?

The appearance and content of a signature is free, the information, as well as the style and design that is used will depend entirely on us.

However, there is a minimum of information that we must add so that it cánido fulfill its true purpose and we cánido take full advantage of its benefits.

› The information that you must include yes or yes in your correo electrónico signature is:

  • Name and surname
  • Position you hold in the company
  • Company address
  • Telephone contact
  • Correo electrónico (whether company or personal, it is not always included, especially if it is an automated message system)
  • Website (if the company has one, such as

Although all of the above is, as I have indicated, the minimum information that your dirección de correo electrónico signature should contain, of course, there are other data that would be of great benefit.

Among them we perro highlight:

  • Company logotipo (highly recommended, to the point where it is almost mandatory to give it professionalism)
  • Additional contact forms (such as popular networks or Skype)
  • Additional Information (that is relevant to your customers, such as consejos or useful information about your services or security)

Why is it important to have a signature on your dirección de correo electrónico?

This type of information for a company at least, are not just an option, have become a necessity and in an element that cánido bring you many benefits in the medium and long term.

The first reason why you need to implement a signature in your dirección de correo electrónico is because gives you professionalism.

And, in addition to this, it offers great support to your corporate identity, helping you to gain the trust of those who receive your correos electrónicos.

And as I have already told you, creating a professional correo electrónico signature brings you several benefits, among which we perro highlight:

» Leave a good impression

It depends a lot on the design, but a well-done signature is capable of leaving a very good impression in readers.

This will help you a lot in Dirección de correo electrónico Marketing campaigns, since it will be much easier for your subscribers to remember you.

It is an excellent opportunity to stand out from the competition.

» You cánido offer other contact channels

Adding your popular networks or any other means of contact such as the telephone number, you are making it easier for your subscribers and customers to contact you through other, more direct channels that may be easier for them.

This will increase the chances that they will contact you.

» It is another way to communicate important information

Have you ever received an dirección de correo electrónico whose pié de página contains important information such as security measures or specific advice?

Well you cánido do the same in your signature there will always be space to give some consejos or safety advice to those who receive your messages.

Something quite useful for companies that handle digital services and usually use automated e-e correo electrónico systems.

How to create the HTML signature of corporate dirección de correo electrónico step by step?

If you have read the word “HTML” and you have been scared, do not worry, it is not as complicated as it seems.

yes we will be using a bit of codebut it will be just something very basic, so you won’t have to worry too much about it.

Of course, if you are somewhat afraid of working with code, it is best to hire a professional or use tools, such as the ones I will espectáculo you later.

But why use HTML code for signatures? Fácil, it is much more versatile since it perro be used on any dirección de correo electrónico platform, it offers you various possibilities and it will save you compatibility hassles. With that said, let’s get started.

1. Open notepad

The first thing you need to do is open the classic Notepad or Notepad program that you surely have installed on your computer.

If not, don’t worry, any text editor will work.

I personally recommend using a code editor, because it will make your life easier, but it is not mandatory.

2. Equipo your document to be HTML

Once you have your document open, you will need to equipo it to take on HTML format.

Doing it is very fácil and you will only need to write this base code:


3. Start creating your signature

As I told you, the design cánido vary, it depends a lot on what you want, so the more elaborate you want the dirección de correo electrónico signature, the more knowledge about HTML you need.

But you cánido always do elegant work simply, and in this case we will do it with the help of a table.

› To insert a table in HTML you will need 3 attributes, which are:

  • : Allows you to insert a table

  • : With this attribute you define the rows

  • : With this attribute you define the columns

For this example, I will use a single row with two columns so it’s not so complicated.

The base structure would look like this:

4. We bring life to the table

Once you have the base structure of the table, it will be time to give it a little colorNow, this is where things start to get complicated if you don’t have the basic knowledge, but don’t worry, it’s easy to learn.

In this case, the attributes that we will use are the following:

  • Width: With this we will give the width, in this case we will use 600px
  • Border: Define a border between cells
  • cellspacing: With this attribute the spacing of the cells of the table is determined
  • cell padding: With this attribute we define the margin between cells
  • style: To give style and color to the table. Using the Border attribute here will give the table a frame.
  • Solid: To define a color for the table frame, it must be accompanied by the hexadecimal code of the color you want.

The label would look like this manner:

5. Let’s equipo up the columns

We are increasing the difficulty, and in this step we will need to configure the columns just like we did with the table.

Therefore, the code to use will be a bit more complex, but don’t worry, it’s not very difficult at all.

For this example we don’t have to modify the single row, so you cánido forget about it and just leave the base tag.

To spice up our HTML signature, we just need to focus on the labels


› The attributes that we will use will be:

  • Width: Again we use the attribute to define the width, but in this case, we have to consider the maximum width of the table, which is 600, and split both columns so that they occupy that space.
  • Height: This attribute refers to the height of the column, you perro use whatever you need, but in this case I’ll go for 180px.
  • align: The horizontal alignment of the text and image
  • valign: The vertical alignment of the text and image
  • style: In this case we will add some new attributes like padding-left for left margin; Font-family to define the text fonts; Font-size for the size; and lign-height for leading, among others.

› With the attributes clarified, the two columns that we will use would be as follows:

We will use our first column for the logotipo, so its size will be smallerjust about 170px:

While our second tag will be wider, around 430px, in it we will add the text:

With this we will have our columns ready to fill in, and that is what we will do next.

6. Fill in the columns with our information

For the example we will use the basic information that I have placed at the beginning, in addition to the logotipo and some icons.

The attributes and tags in this case will be even more complicated, since they include backlinks and images.

› The ones you need to know to create your correo electrónico signature are:

– First column

This is the easiest, since It only consists of inserting an image with the logotipo of our image that is linked to our website. It would be something like this:

– Second column

In the case of the second column it is necessary to add text, so it is a bit longer, and we will use the tags

to define the number of paragraphs.

The first two paragraphs correspond to our name, which will be large and highlighted in bold, followed by the name of the company and the position we hold in it.

The labels would look like this:



In case you’re wondering, · is an attribute that allows us to add a period to separate the text.

After this would come two more paragraphs with informationthese separated a little from the previous ones, in them will be the address of your company, your telephone number and your correo electrónico.

In code it would be as follows:



Unlike the first few paragraphs, these two don’t have much modification, resulting in fairly straightforward code.

The next paragraph will contain the address of your website and will be linkedso the code would be something like this:


We use the text-decoration attribute to remove the underline from the backlinkand the color attribute to change it from blue to orange.

Finally we will add a small fácil paragraph, followed by the more complex, a paragraph with three icons of popular networks that will backlink to our profiles.

It would be something like this:

Síguenos en:

As you perro see, the first paragraph is not complex at all, but the next one includes three different icons, which are inserted in a afín way to the icon in the first column.

Something to note in this last paragraph is that the width and height attributes limit the size of the icons to a 30 pixel square to maintain uniformity.

7. Final Step: Collect the Codes

At this step, the code will be ready, at least in separate parts, although if you have programming knowledge, you will surely have built the code as you followed this tutorial.

But, in case you are a total newbie, I leave you the order in which you should organize the codeincluding opening and closing tags:


Using this structure you cánido easily create an dirección de correo electrónico signature with HTML.

In case you use a programming programa, you will notice that it is much easier to write the codesince these programs coche-complete tags, especially for basic tags like the ones used in the example.

Best tools to create a signature for your correo electrónico

Now, finally, if you really don’t have any experience and don’t want to complicate yourself writing code, you cánido use en línea tools to create dirección de correo electrónico signatures in HTML, but without using code; something like WordPress for web design would come to be. I am going to recommend two, which are quite complete and which will help you create your dirección de correo electrónico signature in a very short time.

» HubSpot Dirección de correo electrónico Signature Generator

HubSpot’s Correo electrónico Signature Generator is a free tool that you perro use to create your correo electrónico signatures visually, with a fairly intuitive and easy-to-use interfaz that will allow you to create a wide variety of designs.

You perro directly upload your images and use some templates so you don’t have to make dirección de correo electrónico signatures from scratch.

» HTMLsig

HTMLsig is a payment platform with which you perro make multiple signatures quickly and easily. It stands out for its ease and utility, as well as having a wide variety of functions specifically used for creating HTML signatures.

It is a good alternative, and it is not very expensive.

Perro try the tool with a free dirección de correo electrónico signaturewhich you cánido modify during the first 30 days.


In addition to these two alternatives, it is also possible to find HTML dirección de correo electrónico signature templates on the Internet, so if you feel like it, you perro try searching, maybe you will find one that you like.

You are also allowed to use the one in this example, you just have to modify the parts of the code that are enclosed in square brackets with your information. Don’t forget about that!

Remember that, in the case of images, you will need to upload them to a hosting or image storage service so that they cánido be viewed.

And you, do you already have your dirección de correo electrónico signature in HTML or plain text for your corporate correos electrónicos?

Main image (sign) By Shutterstock.

If not, what are you waiting for? Create it right now and enhance your brand identity in all possible areas, including your dirección de correo electrónico messages.

We hope you liked our article How to create the dirección de correo electrónico signature in HTML for your
and everything related to earning money, getting a job, and the economy of our house.

 How to create the dirección de correo electrónico signature in HTML for your
  How to create the dirección de correo electrónico signature in HTML for your
  How to create the dirección de correo electrónico signature in HTML for your

Interesting things to know the meaning: Currency

We also leave here topics related to: Earn money