Obfuscate email addresses using the HTML bidirectional override element
- 03 May 2017: Post was created (diff)
Starting with a reversed e-mail address
'sshow@example.com'.split('').reverse().join('')
// "moc.elpmaxe@wohss"
Putting it in a <bdo>
element to make it readable again.
<bdo dir="rtl">moc.elpmaxe@wohss</bdo>
// sshow@example.com
The dir
attribute specifies the text direction of the containing text. Either rtl
or ltr
.
I remember reading an article about different ways to obfuscate email addresses in websites to avoid feeding spambots and crawlers. Well, here’s another one.
… whether this is a good idea or not is a discussion of its own.
Full example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script>
function reverse(str) {
return str.split('').reverse().join('')
}
function load () {
var el = document.getElementById('email')
el.innerHTML = reverse('sshow@example.com')
}
</script>
</head>
<body onload="load()">
<bdo id="email" dir="rtl"></bdo>
</body>
</html>
If you have any comments or feedback, please send me an e-mail. (stig at stigok dotcom).
Did you find any typos, incorrect information, or have something to add? Then please propose a change to this post.