Como Criar um Link de Email em HTML

PDF download Baixe em PDF
Coescrito por Equipe wikiHow

PDF download Baixe em PDF

É sempre bom para os visitantes de um site que exista um canal fácil de comunicação caso eles tenham alguma pergunta ou comentário para fazer. Esse recurso, com certeza, agrega valor a qualquer site. Veja abaixo o passo a passo de como adicionar um link de e-mail a uma página da internet usando um trecho de um código HTML simples.

Passos

PDF download Baixe em PDF
  1. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/9\/95\/Create-an-Email-Link-in-HTML-Step-1.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-1.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/9\/95\/Create-an-Email-Link-in-HTML-Step-1.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-1.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    O atributo "<a href=" inicia o link no seu documento HTML. A tag "<a href=" geralmente informa ao navegador que o item a seguir é um link.
    • Você terá que adicionar todo o código HTML até esse ponto antes de prosseguir.
  2. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/6f\/Create-an-Email-Link-in-HTML-Step-2.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-2.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/6f\/Create-an-Email-Link-in-HTML-Step-2.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-2.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    depois do sinal "=". Isso informa o navegador que o link que vem a seguir é direcionado para um endereço de e-mail, em vez de ser para uma página da web.
  3. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/6\/62\/Create-an-Email-Link-in-HTML-Step-3.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-3.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/6\/62\/Create-an-Email-Link-in-HTML-Step-3.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-3.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Informe-os como no exemplo a seguir: <a href=mailto:agentavery@sample.com ".
  4. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/7\/76\/Create-an-Email-Link-in-HTML-Step-4.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-4.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/7\/76\/Create-an-Email-Link-in-HTML-Step-4.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-4.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Se você quiser adicionar um campo de assunto, digite um sinal de interrogação (?) depois do endereço de e-mail do usuário, seguido pela palavra "subject" (sem as aspas), um sinal de igual (=) e o assunto entre aspas.
    • Se quiser adicionar isso ao seu comando, o código ficará assim: {{kbd|<a href=mailto:<nowiki>agentavery@sample.com?subject="texto do assunto"}.
    • Tente não utilizar caracteres que não são alfanuméricos na linha do assunto. Existem algumas formas de driblar esse problema para que o seu link não seja confundido e interpretado como parte de outra coisa.
    • Também é possível adicionar informações para autopreencher a linha de assunto por meio da sintaxe de envio, mesmo que isso não costume ser usado. Isso é utilizado com mais frequência quando o e-mail está sendo enviado para um servidor dentro de um robô que trabalha com o recebimento de mensagens para processamento posterior (ele faz um trabalho de filtragem antes).
    • Você pode adicionar "body", assim como uma linha para “cc” ou “cco” usando uma sintaxe parecida. Só não esqueça de colocar um sinal de interrogação, o termo "body","cc" ou "cco", um sinal de igual e o texto da linha entre aspas.
  5. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/3\/34\/Create-an-Email-Link-in-HTML-Step-5.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-5.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/3\/34\/Create-an-Email-Link-in-HTML-Step-5.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-5.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Até o momento, nosso comando HTML está dizendo para o navegador a qual endereço de e-mail ele deve se conectar e para adicionar um assunto, cc ou cco. O sinal de fechamento ">" diz ao navegador que não há mais nenhum comando a ser executado quando clicarem no link.
  6. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/b\/b4\/Create-an-Email-Link-in-HTML-Step-6.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-6.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/b\/b4\/Create-an-Email-Link-in-HTML-Step-6.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-6.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Esse é o texto que o usuário vai ver ao clicar para abrir o link do e-mail. Ele deve vir depois do sinal de fechamento. Pode ser uma palavra, uma frase ou até uma cópia do endereço de e-mail para onde a mensagem vai. Muitas vezes as pessoas escrevem “entre em contato conosco por aqui” ou algo parecido.
  7. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/5\/55\/Create-an-Email-Link-in-HTML-Step-7.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-7.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/5\/55\/Create-an-Email-Link-in-HTML-Step-7.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-7.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Isso fecha o comando HTML. As tags âncora em HTML precisam ter um fechamento para que esse truque funcione e não fazer o resto da página se tornar uma extensão da tag âncora.
    • O comando de link de e-mail em HTML inteiro deve ficar assim: <a href=mailto:<nowiki>agentavery@sample.com?subject="link HTML">Clique aqui para nos enviar um e-mail!</a>
  8. {"smallUrl":"https:\/\/www.wikihow.com\/images_en\/thumb\/0\/03\/Create-an-Email-Link-in-HTML-Step-8.jpg\/v4-460px-Create-an-Email-Link-in-HTML-Step-8.jpg","bigUrl":"https:\/\/www.wikihow.com\/images\/thumb\/0\/03\/Create-an-Email-Link-in-HTML-Step-8.jpg\/v4-728px-Create-an-Email-Link-in-HTML-Step-8.jpg","smallWidth":460,"smallHeight":345,"bigWidth":728,"bigHeight":546,"licensing":"<div class=\"mw-parser-output\"><\/div>"}
    Não se esqueça de salvar seu trabalho. Se você tiver mais códigos HTML para adicionar ao documento, já pode prosseguir.
    Publicidade

Dicas

  • A tag âncora HTML <a> pode ser usada de várias formas diferentes. Aprenda mais sobre ela para usá-la melhor.
  • As tags âncora devem ser colocadas dentro da seção do corpo (<body>...</body>) do documento HTML. Não coloque-as em nenhum outro lugar ou elas causarão erros ou abrirão o agente de e-mail imediatamente depois de carregar a página do site onde elas estão, independentemente se for uma pré-visualização ou se o seu visitante estiver abrindo essa página, e podem causar problemas se forem abertas sem querer.
Publicidade

Avisos

  • Colocar endereços de e-mail em uma página da web pode causar problemas com spam nas contas de e-mail. Existem muitas pessoas na internet que executam programas para colher esses tipos de e-mails para fazer spam. Portanto, quem for colocar um link de e-mail em um site público tem que estar pronto para lidar com o spam também.
  • Verifique o nome do receptor antes de enviar o e-mail.
  • Se os usuários não tiverem um programa de e-mail instalado no computador, então eles não conseguirão mandar uma mensagem para você.
Publicidade

WikiHows Relacionados

Como
Conseguir um Número Falso Para Usar no WhatsApp
Quais Emojis têm Significado Sexual?
Como
Responder uma Mensagem de "Estou com Saudades"
Qual o Significado do Emoji de Duas Mãos 🙌 🙏?
Qual o Significado do Emoji de Cadeado 🔒?
Como
Pedir Dinheiro a um Cara Por Mensagem
O Que o Emoji de Coração Azul Claro 🩵 Significa?
Como
Responder uma Mensagem de Bom Dia
Como
Saber o Que o Emoji de Fogo Significa
O Que os Emojis de Rosto Sorridente Significam?
O Que o Emoji de Coração Branco 🤍 Significa?
Como
Usar Aos Cuidados (AC) em Emails
O Que o Emoji de Coração Laranja 🧡 Significa?
Como
Entender o Significado do Emoji de Coração Verde
Publicidade

Referências

  1. http://www.zaposphere.com/html-email-links-code/ - fonte de pesquisa

Sobre este guia wikiHow

Em outras línguas
Esta página foi acessada 114 803 vezes.

Este artigo foi útil?

Publicidade