E-mail cím elrejtése CSS-sel

A spamáradattal már mindenkinek tele a kis hócipője, itt a lapon is volt már róla szó, hogy lehet ellene védekezni. A minap egy külföldi blogban láttam pár – számomra új és ötletek – megoldást ami tetszett és CSS-re alapul a használatuk, lássuk őket:

A szöveg megfordítása

A CSS-nek hála lehetőség van a karakterek fordított sorban történő megjelenítésére az alábbi módon:

1
2
3
4

<style type="text/css"> 
span.codedirection { unicode-bidi:bidi-override; direction: rtl; } 
</style> 
<p><span class="codedirection">moc.niamod@liame</span></p>

Ennek eredménye az lesz, hogy a lapon megjelenik a látogató számára a mail@domain.com cím, viszont a forráskódban a spamrobotok számára a moc.niamod@liame szöveg lesz olvasható.

Rejtett tartalom

1
2
3
4

<style type="text/css"> 
p span.displaynone { display:none; } 
</style> 
<p>email@<span class="displaynone">null</span>domain.com</p>

Annak ellenére, hogy a forráskód szerint ez nem egy mailcím, a lapon helyesen fog megjelenni. A kukac utáni “null” CSS segítségével rejtve lesz, a mailcím összeáll.

Az ötletek a “Three Best Ways To Obfuscate Email Addresses” oldalról származnak.

KAPCSOLÓDÓ CIKKEKTÖBB A SZERZŐTŐL

9 HOZZÁSZÓLÁS

  1. És hogy teljes legyen a kép, az első változathoz egy JavaScript kód, hogy kattintható legyen (PrototypeJS-t és pontosan a fenti kódot (span tag codedirection class-al és benne csak az e-maillel) feltételezi):

    1
2
3
4
5
6

    Event.observe(window, 'load', function() {
	$$('span.codedirection').each(function(item) {
		email = item.childNodes[0].nodeValue.split('').reverse().join('');
		item.parentNode.replaceChild(new Element('a', {href : 'mailto:' + email }).update(email), item);
	});
});

    BlackY

  2. Hatalmas ötlet, thx… Eddig a képfájlon olvasható e-mail címet tartottam a legmegfelelőbb ötletnek. :)

  4. Ötletes, ötletes, de ha CSS, akkor a JSt mellőzném :) Elvégre, azért CSS, hogy szkriptmentes böngészőkön is működjön.

  5. a megfordítással csak az a baj ha másolni akarod a mail címet akkor sajna fordítva másolja ki

  7. sajna egyik sem jó. az elsőnél beírja a “null”-t is, a másodiknál a már említett fordított e-mail cím.

  8. Hi, mindkét megoldás ötletes.
    De nem kattintható és másolásnál rossz emailt kapunk.

    Ezért gondoltam megkérdezem mi a véleménye a hozzáértőknek az alábbi megoldásról.

HOZZÁSZÓLOK A CIKKHEZ

Kérjük, írja be véleményét!
írja be ide nevét