How to create an email link in HTML

Table of contents:

How to create an email link in HTML
How to create an email link in HTML
Anonim

Visitors to your site will be happy if they can quickly find a link to your email to contact you with questions or concerns. Such a link is an additional function for any site. In this article, we are going to show you how to create an email link with a few lines of HTML code.

Steps

Create an Email Link in HTML Step 1
Create an Email Link in HTML Step 1

Step 1. Enter an anchor tag <a href = in your HTML document

The link will start with the "<a href =" attribute in the HTML document. The "<a href =" tag tells the browser that the next element is a link.

Enter all the HTML before jumping to other sections of the code

Create an Email Link in HTML Step 2
Create an Email Link in HTML Step 2

Step 2. Enter mailto

after the "=" symbol. This tells the browser that the link is for an email address and not a web page.

Create an Email Link in HTML Step 3
Create an Email Link in HTML Step 3

Step 3. Enter your email address

At this point, the line you entered should look like this: <a href = mailto: [email protected]

Create an Email Link in HTML Step 4
Create an Email Link in HTML Step 4

Step 4. Add a subject line (optional)

To do this, enter a question mark (?) After the email address, enter the word "subject" (without quotes), enter an equal sign (=), and then enter the subject inside the quotes.

  • If you decide to add a subject line, the line you entered should look like this: <a href = mailto: [email protected]? Subject = "subject text"
  • In the text of the topic, do not use symbols that are not alphanumeric. This is necessary for the link to work correctly.
  • Using the mailto syntax, you can add information to pre-populate the subject line, but this method is rarely used - it is more common when letters are sent to a server with a bot that controls them for further processing (filtering).
  • Using the same syntax, you can add the lines "body" (body of the message), "cc" (copy), and "bcc" (blind carbon copy). Enter a question mark (?), Enter "body", "cc", or "bcc", enter an equal sign (=), and then enter the text for the string within the quotes.
Create an Email Link in HTML Step 5
Create an Email Link in HTML Step 5

Step 5. Enter> to add a closing parenthesis

So far, the HTML commands injected have pointed the browser to the email address and added a subject / cc / bcc. The closing brace ">" tells the browser that there are no more commands to execute when the link is clicked.

Create an Email Link in HTML Step 6
Create an Email Link in HTML Step 6

Step 6. Enter the link text

This is the text the user clicks to open the email link. Enter text after the closing parenthesis. The text can be a word, phrase, or even a copy of an email address. Typically, the word "click here", "mail" or similar is entered.

Create an Email Link in HTML Step 7
Create an Email Link in HTML Step 7

Step 7. Type links after the text to close the HTML command

The anchor tag must be closed so that the remaining code does not become part of the tag.

The entire HTML command that adds an email link should look like this: Click here to send an email

Create an Email Link in HTML Step 8
Create an Email Link in HTML Step 8

Step 8. Paste other code into the HTML document

Do this if you need to add more code to your document. Now save your document.

Advice

  • The anchor tag can be used in different ways. Read about this tag online to use it effectively.
  • Anchor tags must be inside the body (…) section of an HTML document. If this tag is inserted elsewhere in the document, it will lead to errors or the launch of the mail client when loading the web page (regardless of whether the page was opened by another user or you did it), which negatively affects the page load.

Warnings

  • If you post your email address on a web page, your inbox can be filled with spam. There are many people on the Internet who collect such addresses for the purpose of sending spam. So if you're posting a link to an email address on a public website, get ready to fight spam.
  • Check the recipient's name before sending the email.
  • If there is no mail client on the user's computer, such a user will not be able to send you an email.

Popular by topic