How to send email through an HTML page?

1st OPTION:

I used MandrilJS, which is a service that sends me 12 thousand emails free of charge to you (this is not spam). it works as a field medium so you do not need a server.

Link to access (you need to create an account): MandrilJS

2º Create a common form and (put as method POST just not to fill the URL but nothing will be sent to a server) on the submit button do it this way:

<button onClick="sendMail();return false;">Enviar</button>

3rd Create a Javascript with a function of the same name as the button that will retrieve the fields populated by the user of the form:

function sendMail(){
    var nome = document.getElementById("nome").value;
    var email = document.getElementById("email").value;
    var assunto = document.getElementById("assunto").value;
    var desc = document.getElementById("desc").value;
    var body = '<strong>Nome: </strong>'+nome+'<br />'+
               '<strong>Email: </strong>'+email+'<br />'+
               '<strong>Assunto: </strong>'+assunto+'<br />'+
               '<strong>Descição: </strong>'+desc;

    $.ajax({
        type:"POST",
        url:"https://mandrillapp.com/api/1.0/messages/send.json",
        data:{
                'key':'sua chave aqui',
                'message':{
                    'from_email':'email que irá enviar',
                    'to':[
                        {
                            'email':'email remetente',
                            'name':'Seu Nome (ou nick)',
                            'type':'to'
                        }
                    ],
                    'subject':'Assunto',
                    'html':body
                }
            }
    });
}

OBS1: It is not necessary to enter your email passwords anywhere, you only have to register with MandrilJS (without entering your email password) and generate a key, this key will be inserted in the json at the specific location (it is generated in the settings).

OBS2: jQuery is required.

OBS3: You can insert CSS into tags

OBS4: Both Emails have to be valid the Recipient for obvious reasons he will receive the emails, Remente why MandriJS sends weekly statistics of mailings and reads. >

2nd OPTION:

I use the PHPMailer class for this purpose (you need at least one GMAIL for this as we will use your SMTP server) I am putting methods that make use of this class (all documented).

PHPMailer download link: link

    /**
    *String que armazena o email de onde partirá os emails (remetente).
    *@var string
    */
    const GUSER = 'email';

    /**
    *String que armazena a senha do email de onde partirá os emails (remetente).
    *@var string
    */
    const GPWD = 'senha';

    /**
    *String que armazena o email para qual as mensagens serão enviadas (destinatário).
    *@var string
    */
    const GSEND = 'teste';


   static function contactUsEmail(){

        $emailRemetente = $_POST['email'];
        $name = $_POST['name'];
        $subject = $_POST['subject'];
        $mensagem = $_POST["message"];
        $corpoMensagem = '<b>CONCTACT US EMAIL</b>'.'<br /><b>Email Remetente: </b>'.$emailRemetente.
        '<br /><b>Nome:</b>'.$name.'<br /><b>Assunto:</b>'.$subject.'<br /><b>Mensagem:</b>'.$mensagem;

        $sendResult = SendEmail::smtpMailer(SendEmail::GSEND, SendEmail::GUSER, $name, $subject, $corpoMensagem);

        if($sendResult === true){
             echo 'Mensagem Enviada com Sucesso';
        }else{
            echo $sendResult;
        }
    }

    function smtpMailer($destinatario, $remetente, $nomeRemetente, $assunto, $corpo){

        /*
        *Objeto que realizará a composição do email com os dados passados como parametros, 
        *armazenara as configurações do servidor SMTP utilizado e todas as outras configurações 
        *e realizará o envio do email.
        *@var PHPMailer object
        */
        $mail = new PHPMailer();

        /**
        *Define o charset do email a ser enviado.
        */
        $mail->CharSet = 'UTF-8';

        /**
        *Ativa SMTP para uso.
        */
        $mail->IsSMTP();

        /**
        *Não exibirá erros e mensagens, outras configurações possiveis: 
        *Debugar: 1 = erros e mensagens, 2 = mensagens apenas.
        */
        $mail->SMTPDebug = 0;

        /**
        *Ativa a autenticação.
        */
        $mail->SMTPAuth = true;

        /**
        *Protocolo utilizado, o gmail (servidor utilizado) requere o uso de tls.
        */
        $mail->SMTPSecure = 'tls';

        /**
        *SMTP utilizado
        */
        $mail->Host = 'smtp.gmail.com';

        /**
        *Porta utilizado para envio de mensagens (ela deverá estar aberta em seu servidor).
        */
        $mail->Port = 587;

        /**
        *Login do usuário utilizado para envio do email (no caso usuário comum do gmail).
        */
        $mail->Username = SendEmail::GUSER;

        /**
        *Senha do login de usuário utilizado para envio do email.
        */
        $mail->Password = SendEmail::GPWD;

        /**
        *Identificação do remetente do email (usuário de email utilizado para envio do 
        *email pelo sistema (logo de propriedade do sistema) e o nome do usuário remetente 
        *(informado na hora da criação do email)) do email.
        */
        $mail->SetFrom($remetente, $nomeRemetente);

        /**
        *Assunto do email.
        */
        $mail->Subject = $assunto;

        /**
        *Corpo do email.
        */
        $mail->Body = $corpo;

        /**
        *Email destinatário do email (de propriedade do sistema).
        */
        $mail->AddAddress($destinatario);

        /**
        *Seta o email como HTML (por padrão ele é text/plain).
        */
        $mail->IsHTML(true);

        $sendResult = $mail->Send();

        if(!$sendResult){
            return "<b>Informações do erro:</b> " . $mail->ErrorInfo;
        }else{
            return true;
        }
    }

Use the a element by reporting in the href attribute the email details such as subject ( subject ), recipient ( mailto: ) and message body ( body ). The blanks separating each word into the subject and message text should be reported as the %20 character combination.

Example:

<a href="mailto:[email protected]?subject=Assunto%20da%20mensagem&body=Conteúdo%20da%20mensagem">Enviar email</a>