Flash based alternative to mailto:
When publishing a number of email addresses to a web page you run the chance of a spam bot scraping your site. There are a number of alternatives; such as using a mail form, obfuscating the mailto link with JavaScript or even converting the address to an image. While mail forms will conceal your email address from spam bots, they also conceal your address from the users who may simply want your address for other correspondence. Obfusticating your mailto link with JavaScript is also pretty useless since, being client site any spam bot can “resolve” the link much like your browser. And last but not least using images to display your address takes away the linking functionality. So I suggest a different alternative - Why not use Flash to display the address?
Using Flash, we can load the address client side in parts; “username” “domain” and form the address in a Flash textfield. Then we can simply use the getURL() function OR better use the textfield htmlText with an anchor to simulate our mailto link.
Here’s a hardcoded example of how I do it:
1. Create a 200px x 18 px document (FPS doesnt matter)
2. On Layer 1 add a textfield to the first frame, setting it to type dynamic, and give it an instance name of address_txt
3. Create a new layer above the previous layer for your Actionscript and add the following:
address_txt.htmlText = (username != undefined && domain != undefined) ? '<a href="mailto:'+username + '@' + domain + '">'+username + '@' + domain+'': "no email";</a>
4. Now using Publish your document (making sure you publish a html page in addition to your swf file)
5. Open your published html file in Dreamweaver or your favourite editor and append the querystring “username=joebloggs&domain=gmail.com” to the
<param movie="..." ></param> and <embed src="..."> </embed> tags:
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="200" height="18" id="mailto" align="middle"> <param name="allowScriptAccess" value="sameDomain" /> <param name="movie" value="mailto.swf?username=joebloggs&domain=gmail" /> <param name="quality" value="high" /> <param name="bgcolor" value="#ffffff" /> <embed xsrc="mailto.swf?username=joebloggs&domain=gmail.com" quality="high" bgcolor="#ffffff" width="200" height="18" name="mailto" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> </object>
6. Finally run your movie in the browser and you should see your email address in the Flash textfield!
It isn’t a bad concept, I like it.. Taking the precaution of using javascript at a minimum would be a start though, maybe a link to how to do that if people don’t want to have flash running on their site, or haven’t purchased flash. Alternatively, maybe we could link to a pre-built SWF that allows users to also specify the CSS and maybe have a JS that can resize itself as an embedded object so that it doesn’t always be 200width (or have to guess what is big enough in the case that it is dynamic).
Comment by Cameron Manderson — February 25, 2007 @ 10:41 am
Yep, here’s my simple javascript alternative - I believe the spam bots target “mailto” in the source and any formed email addresses:
<script language="javascript"> function mailit(user, domain) { window.location.href="mailto:"+user+"@"+domain; } </script> <body> <a href="javascript:mailit('joebloggs', 'gmail.com')" rel="nofollow">Email</a> </body>Comment by Richard Lee — February 28, 2007 @ 1:47 pm
And if you wanted to have the email address appear simply render the text with PHP
if (!empty($_GET['user']) && !empty($_GET['domain'])) { $string = trim($_GET['user']).'@'.trim($_GET['domain']); $line = array("linespacing" => 0); $fontsize = 12; $fontfile = 'verdana.ttf'; $imgH = 18; $marginX = 0; $imgColorHex = '000000'; $txtColorHex = 'FFFFFF'; $box = imageftbbox($fontsize,0,$fontfile,$string,$line) or die("ERROR"); $tw= $box[4]-$box[0]; //image width $marginY = $imgH - (($imgH - $fontsize) / 2); $imgW = $tw + (2*$marginX); $im = imagecreate($imgW, $imgH); $int = hexdec($imgColorHex); $arr = array("red" => 0xFF & ($int >> 0×10), "green" => 0xFF & ($int >> 0×8), "blue" => 0xFF & $int); $black = imagecolorallocate($im, $arr["red"], $arr["green"], $arr["blue"]); $int = hexdec($txtColorHex); $arr = array("red" => 0xFF & ($int >> 0×10), "green" => 0xFF & ($int >> 0×8), "blue" => 0xFF & $int); $white = imagecolorallocate($im, $arr["red"], $arr["green"], $arr["blue"]); header("Content-type: image/png"); imagefttext($im, $fontsize, 0, $marginX, $marginY, $white, $fontfile, $string, array()); imagepng($im); } else { echo "ERROR!"; } ?>And here’s an example with the addition of our js function above:
<a href="javascript:mailit('joebloggs', 'gmail.com')" rel="nofollow"><img src="http://www.melbournechapter.net/wordpress/nospam.php?user=joebloggs&domain=google.com" /></a>Comment by Richard Lee — February 28, 2007 @ 3:27 pm
Nice snippets!
Comment by Cameron Manderson — February 28, 2007 @ 10:43 pm
Hi,
I was looking for something like this but I’m not familiar with scripts and the like and have used NetObjects Fusion to create my website.
I’ve created a file called nospam.php (which has got the code above starting with the line “if (!empty($_GET[’user’]) && !empty($_GET[’domain’]))….” and copied that to the same directly as my html pages.
I’ve then inserted the code :
in place of the mailto in my web page and changed the http:… bit to the location where I put the nospam.php file.
I was expecting to see the email address rendered as an image but I just get one of those square image placeholders however clicking on this does work and open outlook with right To address. Why is the image not looking right?
Simon
Comment by Simon Ferrari — April 21, 2008 @ 4:05 am
Hi Simon, have u tried cutting and pasting the link you see in the source into your browser - does the image appear? Because it sounds like a paths issue to me
Comment by Richard Lee — May 2, 2008 @ 3:30 pm