Foutieve/encoded href in e-mail-link frontpage

[HyperioN]

In het artikel plan: Tweakers stapt over op YouTube - Win een oled-tv ter waarde van 1999 euro!
staat een mailto-link naar het e-mailadres [e-mail].
De href-tag van die link is echter foutief/vreemd opgebouwd:

HTML:

<a rel="mail" data-to=" prijsvraag" data-domain="%74%77%65%61%6B%65%72%73.%6E%65%74" href="mailto: prijsvraag@%74%77%65%61%6B%65%72%73.%6E%65%74">[e-mail]</a>

Allereerst staat er een spatie na mailto: wat volgens mij niet hoort.
Daarnaast is de tld tweakers.net url-encoded; als ik de string %74%77%65%61%6B%65%72%73.%6E%65%74 door php's urldecode haal komt daar inderdaad tweakers.net uit.

Als ik in Chrome via context menu "Copy e-mail address" kies en vervolgens plak in Gmail, komt het er ook zo uit:


Dus dat gaat niet helemaal lekker.

[koku]

De mail-adressen worden automatisch obfuscated ivm crawlers/spam. Er stond nog wel een overbodige spatie achter "mailto:" en die heb ik even weggehaald.

[HyperioN]

Valide reden, maar daarmee breek je dus wel de "Copy e-mail address" functionaliteit van sommige browsers.

Heb het even getest.
"Copy e-mail address" werkt nu niet goed in Safari 12.0 op macOS 10.14 en Chrome 69 op zowel macOS 10.14 als Windows 10. Deze browsers passen dus géén urldecode toe op de value als je "Copy e-mail address" doet.
In Firefox 62 werkt het wel naar behoren; dus deze browser voert een urldecode uit alvorens de value naar het clipboard te schrijven.
Internet Explorer en Edge hebben geen "Copy e-mail address" functionaliteit.


De vraag is dus of de beoogde spampreventie opweegt tegen de UX-degradatie die je ermee veroorzaakt.

Ik zie nu trouwens dat het href-attribuut in de source niet eens aanwezig is:

HTML:

<a rel="mail" data-to="prijsvraag" data-domain="%74%77%65%61%6B%65%72%73.%6E%65%74" rel="external">[e-mail]</a>

Ik vermoed dus jullie de hrefs setten met Javascript - vermoedelijk om bots uit te sluiten die geen Javascript uitvoeren.
Als je dat toch al doet, dan zou je dus ook direct decodeURIComponent kunnen uitvoeren op de domeinnaam, zodat het un-obfuscated mailadres in de href-tag gezet wordt.

Zoiets:

HTML:

<p>
  hoi tralala <a rel="mail" data-to="prijsvraag" data-domain="%74%77%65%61%6B%65%72%73.%6E%65%74" rel="external">[e-mail]</a>
</p>

<script type="text/javascript">
var mailLinks = document.querySelectorAll('a[rel="mail"]');
mailLinks.forEach(function(elem){
  elem.href = 'mailto:'+ elem.dataset.to + '@' + decodeURIComponent(elem.dataset.domain);
});
</script>

offtopic:
Overigens vermoed ik dat de meeste spambots niet alleen zoeken naar mailto:-hrefs maar ook met een reguliere expressie strings zoeken in je source die lijken op een emailadres. In dat geval bereik je met enkel obfuscation van het adres in de mailto vrij weinig.

[Voor 0% gewijzigd door HyperioN op 26-09-2018 16:21. Reden: typo]

[crisp]

Ik heb er decoding aan toegevoegd; komt vanmiddag online