Come aggiungere collegamenti e-mail offuscati per evitare "Scegli applicazione"

Migliorare l'esperienza utente con i collegamenti e-mail

Incorporare collegamenti e-mail nel tuo sito web è una pratica comune, ma a volte può portare al messaggio "Scegli un'applicazione", interrompendo l'esperienza dell'utente. Per evitare ciò, offuscare il collegamento e-mail può aiutare ad aprire direttamente l'applicazione di posta elettronica predefinita dell'utente.

Questa guida esplorerà metodi efficaci per aggiungere collegamenti e-mail offuscati al tuo sito. Forniremo soluzioni pratiche per garantire che i collegamenti e-mail si aprano senza problemi, migliorando l'interazione e la soddisfazione dell'utente.

Comprendere i collegamenti e-mail offuscati

Il primo script utilizza una combinazione di HTML e JavaScript per offuscare il collegamento e-mail. IL addEventListener Il comando associa un gestore eventi clic al collegamento. Quando si fa clic, JavaScript costruisce l'indirizzo e-mail dalle parti utente e dominio, quindi imposta il file window.location.href all'URL mailto costruito, che apre il client di posta elettronica predefinito dell'utente. Questo metodo impedisce efficacemente ai bot di raccogliere l'indirizzo e-mail garantendo al tempo stesso un'esperienza utente fluida.

Il secondo script sfrutta PHP per ottenere risultati simili. In questo caso l'indirizzo e-mail viene generato dinamicamente sul lato server utilizzando i tag PHP <?php ?>. Questo codice PHP costruisce l'indirizzo email e lo inserisce nell'HTML come collegamento mailto. Questa tecnica garantisce che l'indirizzo e-mail non venga esposto direttamente nell'origine HTML, riducendo così il rischio di spam e mantenendo la funzionalità per l'utente.

Creazione di collegamenti e-mail dinamici con Flask

Il terzo esempio utilizza Python con Flask, un framework web leggero. In questo script viene definito un percorso per la home page e all'interno di questo percorso l'indirizzo e-mail viene costruito utilizzando un file f-string per una formattazione delle stringhe pulita e leggibile. IL render_template_string Il comando viene utilizzato per generare dinamicamente il collegamento e-mail nella risposta HTML. Questo metodo fornisce una solida protezione lato server contro lo scraping delle e-mail, garantendo al tempo stesso che il collegamento e-mail funzioni come previsto per gli utenti.

Nel complesso, questi script dimostrano diversi modi per offuscare i collegamenti e-mail e impedire la visualizzazione del messaggio "Scegli applicazione". Utilizzando JavaScript, PHP e Python (Flask), questi esempi evidenziano approcci versatili per migliorare l'esperienza utente e proteggere gli indirizzi e-mail dalla raccolta dei bot.

<!-- HTML Part -->
<a href="#" id="email-link">Email Us</a>
<script>
// JavaScript Part
document.getElementById('email-link').addEventListener('click', function() {
  var user = 'user';
  var domain = 'example.com';
  var email = user + '@' + domain;
  window.location.href = 'mailto:' + email;
});
</script>

<!-- HTML Part -->
<?php
$user = 'user';
$domain = 'example.com';
$email = $user . '@' . $domain;
?>
<a href="<?php echo 'mailto:' . $email; ?>">Email Us</a>
<!-- This PHP code will construct the email address dynamically -->

from flask import Flask, render_template_string
app = Flask(__name__)
@app.route('/') 
def home():
    user = 'user'
    domain = 'example.com'
    email = f"{user}@{domain}"
    return render_template_string('<a href="mailto:{{email}}">Email Us</a>', email=email)
if __name__ == '__main__':
    app.run(debug=True)

Tecniche avanzate per l'offuscamento delle email

Un altro metodo efficace per offuscare i collegamenti e-mail prevede l'utilizzo della codifica CSS e Unicode. Suddividendo l'indirizzo email in parti più piccole e utilizzando i CSS per riassemblarlo, puoi nascondere l'indirizzo email ai bot mantenendolo funzionale per gli utenti. Ad esempio, puoi dividere l'indirizzo email in singoli caratteri e inserire ciascun carattere all'interno di un file elemento con una classe unica. I CSS possono quindi definire questi intervalli in modo che vengano visualizzati come un indirizzo email continuo.

Inoltre, puoi utilizzare JavaScript per decodificare un indirizzo email con codifica Unicode. Questo metodo prevede la codifica dell'indirizzo email in Unicode e quindi l'utilizzo di JavaScript per decodificarlo sul lato client. Entrambe queste tecniche aggiungono ulteriori livelli di protezione contro i bot che raccolgono e-mail, garantendo che i collegamenti e-mail rimangano sicuri e facili da usare.