¿Cuáles son las dos mejores opciones para agregar un enlace de correo electrónico un sitio web?

De acuerdo, estas son las dos mejores opciones para agregar un enlace de correo electrónico a un sitio web, junto con sus pros y contras:

1. Uso del `mailto:` html enlace

* Cómo funciona: Este es el método más común y directo. Utiliza una etiqueta html `` (ancla) con el atributo `href` establecido en` mailto:`. También puede agregar parámetros opcionales al `mailto:` enlace para preopular los campos de sujeto, cuerpo y CC/BCC del correo electrónico.

* Ejemplo:

`` `HTML

Envíenos un correo electrónico

Soporte de contacto

`` `` ``

* pros:

* simple de implementar: Requiere un conocimiento de codificación mínimo.

* ampliamente compatible: Funciona en prácticamente todos los navegadores y clientes de correo electrónico.

* directo: Inmediatamente solicita al cliente de correo electrónico predeterminado del usuario que abra un nuevo correo electrónico.

* Prepoblación opcional: Puede llenar previamente el sujeto y el cuerpo para guiar al usuario y facilitarles enviar la información apropiada.

* contras:

* requiere un cliente de correo electrónico predeterminado: Si el usuario no tiene un cliente de correo electrónico predeterminado configurado correctamente (como Outlook, Thunderbird o Mail.App), el enlace podría no funcionar como se esperaba (o en absoluto).

* Cosecha de spam: Direcciones de correo electrónico en `Mailto:` Los enlaces se cosechan fácilmente mediante bots, lo que aumenta el riesgo de spam. (Ver mitigaciones a continuación)

* Personalización limitada: Solo puede controlar el destinatario, el sujeto y el cuerpo. No puede agregar fácilmente archivos adjuntos o un formato más complejo.

* Consideraciones de seguridad: Si bien ahora es menos un problema, los navegadores mayores podrían explotarse a través de maliciosos `mailto:` enlaces (aunque esto es extremadamente raro).

2. Uso de un formulario con manejo de correo electrónico del lado del servidor

* Cómo funciona: En lugar de un enlace directo, crea un formulario HTML en su sitio web. El formulario reúne el nombre del usuario, la dirección de correo electrónico, el mensaje, etc. Cuando el usuario envía el formulario, los datos se envían a un script del lado del servidor (escrito en PHP, Python, Node.js, etc.) que luego construye y envía el correo electrónico.

* Ejemplo (HTML simplificado):

`` `HTML

nombre:

correo electrónico:

mensaje:

</extarea> <br> <br> <p> <p> <input type ="enviar" valor ="envío"> <p> </form> <p> `` `` `` <p> <p> * <b> pros:</b> <p> <p> * <b> Más control:</b> Tiene control completo sobre el formato del correo electrónico, el contenido y el proceso de entrega. Puede agregar archivos adjuntos, formato HTML, etc. <p> * <b> Experiencia de usuario mejorada:</b> Puede proporcionar un mejor manejo de errores y comentarios al usuario si el correo electrónico no se envía. <p> * <b> Protección de spam:</b> Puede implementar técnicas de prevención de spam más robustas (Captchas, honeypots, limitación de tarifas) en el lado del servidor. <p> * <b> No hay dependencia de un cliente de correo electrónico predeterminado:</b> Funciona independientemente de si el usuario tiene un cliente de correo electrónico configurado. <p> * <b> Manejo de datos:</b> Puede almacenar los envíos de formularios para análisis o mantenimiento de registros (si es necesario y cumplir con las regulaciones de privacidad). <p> <p> * <b> contras:</b> <p> <p> * <b> Más complejo de implementar:</b> Requiere habilidades de programación del lado del servidor y acceso a un servidor web. <p> * <b> requiere recursos del servidor:</b> Enviar correos electrónicos desde un servidor puede consumir recursos, especialmente si maneja un gran volumen de envíos. <p> * <b> aumentó las preocupaciones de seguridad:</b> Debe validar y desinfectar cuidadosamente la entrada del usuario para evitar vulnerabilidades de seguridad (por ejemplo, secuencias de comandos entre sitios). <p> * <b> Confía en la configuración del servidor:</b> Debe asegurarse de que su servidor esté configurado correctamente para enviar correos electrónicos (por ejemplo, con un servidor SMTP válido). <p> <p> <b> ¿Qué opción elegir? </b> <p> <p> * <b> Para sitios web rápidos, simples y de bajo tráfico:</b> El `mailto:` el enlace es generalmente suficiente. Solo tenga en cuenta los riesgos de spam y considere técnicas de ofuscación (ver más abajo). <p> * <b> Para sitios web que necesitan más control, manejen información confidencial o necesiten una mejor protección contra spam:</b> Un formulario con manejo de correo electrónico del lado del servidor es la mejor opción. Esto es común para los formularios de contacto y las solicitudes de soporte. <p> <p> <b> mitigando la recolección de spam con `mailto:` enlaces:</b> <p> <p> Si elige la opción `mailto:`, aquí hay algunas técnicas para dificultar que los bots cosechen la dirección de correo electrónico:<p> <p> * <b> Ofuscación con JavaScript:</b> <p> <p> `` `HTML <p> <script> <p> función decodeemail (codeDemail) { <p> // Ejemplo básico:reemplazar '[at]' con '@' y '[dot]' con '.' <p> Sea correo electrónico =encodeDemail.replace ( / \ [at] / g, "@"). reemplazar ( / \ [dot] / g, "."); <p> window.location.href ="mailto:" + correo electrónico; <p> } <p> </script> <p> <p> <a href ="#" onClick ="decodeemail ('info [at] ejemplo [dot] com'); return false;"> Envíenos un correo electrónico </a> <p> `` `` `` <p> <p> Esta técnica se basa en JavaScript para decodificar la dirección de correo electrónico justo antes de que se active el enlace `mailto:`. Los bots que no ejecutan JavaScript tendrán dificultades para extraer el correo electrónico. Sin embargo, los usuarios con JavaScript deshabilitado no podrán usar el enlace. Existen métodos de ofuscación más sofisticados. <p> <p> * <b> Usando una imagen:</b> Muestre la dirección de correo electrónico como una imagen en lugar de texto sin formato. Esto hace que sea más difícil para los bots extraer el texto, pero requiere que los usuarios escriban manualmente la dirección. <p> <p> * <b> reversión de la dirección de CSS:</b> Use CSS para revertir el orden de la dirección de correo electrónico y luego use HTML para mostrarlo en el orden correcto. Esto dificulta que los bots simples analicen, pero se derrota fácilmente. <p> <p> `` `HTML <p> <span style ="unicode-bidi:bidi-override; dirección:rtl;"> moc.elpmaxe@ofni </span> <p> `` `` `` <p> <p> * <b> Cloudflare de dirección de correo electrónico:</b> Si usa CloudFlare, tiene una función de ofuscación de dirección de correo electrónico automática. Habilitarlo en su configuración de CloudFlare. <p> <p> * <b> Filtros de spam:</b> Use filtros de spam como Akismet o Mollom en el lado del servidor para filtrar correos electrónicos de spam enviados a través de formularios. <p> <p> <b> Consideraciones importantes:</b> <p> <p> * <b> Privacidad:</b> Tenga en cuenta las regulaciones de privacidad (por ejemplo, GDPR, CCPA) al recopilar y manejar los datos del usuario a través de formularios. Indique claramente su política de privacidad y obtenga el consentimiento cuando sea necesario. <p> * <b> Seguridad:</b> Implemente medidas de seguridad sólidas para proteger contra el spam, los secuencias de comandos entre sitios (XSS) y otras vulnerabilidades. Use la validación de entrada y la desinfección en los lados del cliente y del servidor. <p> * <b> Experiencia de usuario:</b> Asegúrese de que el enlace o formulario de correo electrónico sea fácil de encontrar, usar y comprender. Proporcione instrucciones y comentarios claros al usuario. <p> <p> En resumen, el enlace `mailto:` es una solución simple para las necesidades básicas, mientras que un formulario con manejo del lado del servidor ofrece más control, flexibilidad y seguridad, pero requiere más esfuerzo de desarrollo. Elija el método que mejor se ajuste a los requisitos de su sitio web y su experiencia técnica. Recuerde priorizar la seguridad y la privacidad al manejar los datos del usuario. <div class="escomad2"><script language='javascript' src='http://www.ordenador.online/ad/es/2.js'></script></div> </div> <div class=contentpage> <div class=p1>Página anterior: <a class='LinkPrevArticle' href='http://www.ordenador.online/software/LinkedIn/354779.html' >¿Qué protocolo se utiliza para crear un enlace una dirección de correo electrónico? </a> </div> <div class=p2>Página siguiente: No </div> </div> <dl class=xgc> <dt><span>LinkedIn</span></dt> <dd><a href="http://www.ordenador.online/software/LinkedIn/259857.html">¿LinkedIn notifica cada vez que ves un perfil? </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/258204.html">Cómo ver las invitaciones pendientes en LinkedIn </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/292520.html">¿Cómo se pueden enviar noticias por fax a amigos y familiares? </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/336089.html">¿Cómo se configura el enlace E1? </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/257545.html">¿Qué hacer si mi cuenta de LinkedIn fue restringida? </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/323115.html">¿No se puede vincular un hipervínculo a qué? </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/296097.html">¿Qué sucede si un hipervínculo no puede mostrar el archivo? </a></dd><dd><a href="http://www.ordenador.online/software/LinkedIn/268405.html">Cómo agregar proyectos a tu perfil en LinkedIn </a></dd> </dl> </div>  <div class=rightmain> <div class=esrightlist> <div class=e1>Los últimos artículos de equipo</div> <ul> <li><a href="http://www.ordenador.online/software/LinkedIn/332888.html" >¿Qué tipo de conexión es el archivo adjunto? </a> </li><li><a href="http://www.ordenador.online/software/LinkedIn/292495.html" >¿Cuál es el atajo para el hipervínculo? </a> </li><li><a href="http://www.ordenador.online/software/LinkedIn/354708.html" >¿Qué es un hipervínculo de correo electrónico? </a> </li><li><a href="http://www.ordenador.online/software/LinkedIn/293789.html" >¿Cómo se crea un hipervínculo en Microsoft Outlook? </a> </li><li><a href="http://www.ordenador.online/software/LinkedIn/332148.html" >¿Cuál es el nombre de usuario para Linksys E1000? </a> </li><li><a href="http://www.ordenador.online/software/LinkedIn/258198.html" >¿Qué tan precisas son las vistas de perfil de LinkedIn? </a> </li> </ul> </div> <div class=esrightlist> <div class=e1>Artículos de la popular computadora</div> <ul> <li> <a href="http://www.ordenador.online/software/LinkedIn/263655.html" >Cómo eliminar tu currículum en LinkedIn </a></li><li> <a href="http://www.ordenador.online/software/LinkedIn/274042.html" >Cómo detener los correos electrónicos de LinkedIn </a></li><li> <a href="http://www.ordenador.online/software/LinkedIn/349800.html" >¿Qué es una clave de conexión? </a></li><li> <a href="http://www.ordenador.online/software/LinkedIn/258193.html" >Cómo utilizar la extensión Lusha en LinkedIn </a></li><li> <a href="http://www.ordenador.online/software/LinkedIn/296097.html" >¿Qué sucede si un hipervínculo no puede mostrar el archivo? </a></li><li> <a href="http://www.ordenador.online/software/LinkedIn/272450.html" >Cómo eliminar Open to Work en LinkedIn </a></li> </ul> </div> <div class="esrightad"> <script language='javascript' src='http://www.ordenador.online/ad/es/r.js'></script> </div> <div class=esrightlist> <div class=e1>Más categorías</div> <ul> <li><a href='http://www.ordenador.online/software/Adobe-Illustrator/' target="_self">Adobe Illustrator</a></li> <li><a href='http://www.ordenador.online/software/Software-de-Animación/' target="_self">Software de Animación</a></li> <li><a href='http://www.ordenador.online/software/Antivirus-Software/' target="_self">Antivirus Software</a></li> <li><a href='http://www.ordenador.online/software/Software-Audio/' target="_self">Software Audio</a></li> <li><a href='http://www.ordenador.online/software/Copia-de-seguridad-de-datos/' target="_self">Copia de seguridad de datos</a></li> <li><a href='http://www.ordenador.online/software/Grabar-CDs/' target="_self">Grabar CDs</a></li> <li><a href='http://www.ordenador.online/software/Grabar-DVDs/' target="_self">Grabar DVDs</a></li> <li><a href='http://www.ordenador.online/software/compresión-de-datos/' target="_self">compresión de datos</a></li> <li><a href='http://www.ordenador.online/software/Software-de-base-de-datos/' target="_self">Software de base de datos</a></li> <li><a href='http://www.ordenador.online/software/edición/' target="_self">edición</a></li> <li><a href='http://www.ordenador.online/software/desktop-Video/' target="_self">desktop Video</a></li> <li><a href='http://www.ordenador.online/software/Software-de-vídeo-digital/' target="_self">Software de vídeo digital</a></li> <li><a href='http://www.ordenador.online/software/Drupal/' target="_self">Drupal</a></li> <li><a href='http://www.ordenador.online/software/Software-Educativo/' target="_self">Software Educativo</a></li> <li><a href='http://www.ordenador.online/software/Ingeniería-del-Software/' target="_self">Ingeniería del Software</a></li> <li><a href='http://www.ordenador.online/software/Tipos-de-extensiones-de-archivos/' target="_self">Tipos de extensiones de archivos</a></li> <li><a href='http://www.ordenador.online/software/Software-financiero/' target="_self">Software financiero</a></li> <li><a href='http://www.ordenador.online/software/GIMP/' target="_self">GIMP</a></li> <li><a href='http://www.ordenador.online/software/Graphics-Software/' target="_self">Graphics Software</a></li> <li><a href='http://www.ordenador.online/software/Software-Home-Recording/' target="_self">Software Home Recording</a></li> <li><a href='http://www.ordenador.online/software/Microsoft-Access/' target="_self">Microsoft Access</a></li> <li><a href='http://www.ordenador.online/software/Microsoft-Publisher/' target="_self">Microsoft Publisher</a></li> <li><a href='http://www.ordenador.online/software/Microsoft-Word/' target="_self">Microsoft Word</a></li> <li><a href='http://www.ordenador.online/software/Código-abierto/' target="_self">Código abierto</a></li> <li><a href='http://www.ordenador.online/software/Otro-Software-Informática/' target="_self">Otro Software Informática</a></li> <li><a href='http://www.ordenador.online/software/Juegos-de-PC/' target="_self">Juegos de PC</a></li> <li><a href='http://www.ordenador.online/software/Photoshop/' target="_self">Photoshop</a></li> <li><a href='http://www.ordenador.online/software/Formato-de-Documento-Portátil/' target="_self">Formato de Documento Portátil</a></li> <li><a href='http://www.ordenador.online/software/PowerPoint/' target="_self">PowerPoint</a></li> <li><a href='http://www.ordenador.online/software/Software-para-presentaciones/' target="_self">Software para presentaciones</a></li> <li><a href='http://www.ordenador.online/software/Software-de-Productividad/' target="_self">Software de Productividad</a></li> <li><a href='http://www.ordenador.online/software/Quicktime/' target="_self">Quicktime</a></li> <li><a href='http://www.ordenador.online/software/Gestión-de-Escritorio-remoto/' target="_self">Gestión de Escritorio remoto</a></li> <li><a href='http://www.ordenador.online/software/SQL-Server/' target="_self">SQL Server</a></li> <li><a href='http://www.ordenador.online/software/Skype/' target="_self">Skype</a></li> <li><a href='http://www.ordenador.online/software/Software-versiones-beta/' target="_self">Software versiones beta</a></li> <li><a href='http://www.ordenador.online/software/Consultores-de-Software/' target="_self">Consultores de Software</a></li> <li><a href='http://www.ordenador.online/software/Las-compañías-de-desarrollo-de-software/' target="_self">Las compañías de desarrollo de software</a></li> <li><a href='http://www.ordenador.online/software/Licencias-de-software/' target="_self">Licencias de software</a></li> <li><a href='http://www.ordenador.online/software/Hojas-de-cálculo/' target="_self">Hojas de cálculo</a></li> <li><a href='http://www.ordenador.online/software/Impuestos-Preparación-de-Software/' target="_self">Impuestos-Preparación de Software</a></li> <li><a href='http://www.ordenador.online/software/Software-de-utilidades/' target="_self">Software de utilidades</a></li> <li><a href='http://www.ordenador.online/software/Web-Clip-Art/' target="_self">Web Clip Art</a></li> <li><a href='http://www.ordenador.online/software/Windows-Media-Player/' target="_self">Windows Media Player</a></li> <li><a href='http://www.ordenador.online/software/Software-de-Procesamiento-de-Texto/' target="_self">Software de Procesamiento de Texto</a></li> <li><a href='http://www.ordenador.online/software/Facebook/' target="_self">Facebook</a></li> <li><a href='http://www.ordenador.online/software/Twitter/' target="_self">Twitter</a></li> <li><a href='http://www.ordenador.online/software/Instagram/' target="_self">Instagram</a></li> <li><a href='http://www.ordenador.online/software/LinkedIn/' target="_self">LinkedIn</a></li> <li><a href='http://www.ordenador.online/software/TikTok/' target="_self">TikTok</a></li> <li><a href='http://www.ordenador.online/software/WhatsApp/' target="_self">WhatsApp</a></li> <li><a href='http://www.ordenador.online/software/WordPress/' target="_self">WordPress</a></li> <li><a href='http://www.ordenador.online/software/Chrome/' target="_self">Chrome</a></li> <li><a href='http://www.ordenador.online/software/Discord/' target="_self">Discord</a></li> <li><a href='http://www.ordenador.online/software/Amazon/' target="_self">Amazon</a></li> </ul> </div> </div>  <div class="cl"></div> </div> <div class=esfoot> <div class=copy>Conocimiento de la computadora © http://www.ordenador.online</div> </div> </body> </html><script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script>