Accessible Javascript links

I just changed the format of my comment links to make them accessible without Javascript. Why? Two reasons. First, accessibility: my comments are now available to people using text browsers like Lynx, screen readers, or even—God forbid—people with Javascript turned off. Second, functionality: now my links behave like links: if you shift-click or right-click and select Open in new window, you get the comments rather than a Javascript error, and you can right-click and select Copy shortcut to get a link to the comments. They should also work with popup killers and browsers like Crazy Browser that try to open every link in a new window.

Having a non-Javascript link also makes the comments available to search engines (a good thing: several of my comment threads have more good information than the posts that started them), and, I’m afraid, to spammers’ email address harvesting programs. All is not lost, however. I’m now displaying the email addresses hex-encoded (making my name %70%68%69%6c%72%69%6e%67%6e%61%6c%64%61), which at least in theory foils the spam bots but doesn’t bother browsers passing the address to email programs. While I’m not absolutely convinced that hex-encoding works, it probably works well enough: after all, the address I’m using right now has been in every one of my blogs (unencoded) since late last summer, and in that time I’ve gotten more emailed viruses from people who added me to their address book (ten) than spams (five, including two port41-related spams). Whether I’m just not popular enough to get crawled, or the spammers are just passing the same old addresses around without crawling for new ones, I’m not sure. My address that was harvestable from 1998 to 1999 continues to get around ten spams a day, twenty to thirty on Sundays (losers), but newer ones are mostly staying spam-free (thanks in part to liberal use of forwarding from Spam Motel whenever I have to give an address to someone I don’t trust). Also, I wouldn’t count on Javascript-only links being totally spammer-proof forever: it shouldn’t take more than an hour or two to write a program that would parse a page for commands in functions, and then evaluate the url from each call.

The how-to: there are two good approaches to Javascript links, depending on whether the link target will work without Javascript or not. If the target doesn’t require Javascript, and you are just using script to open a popup window, use <a href=”” target=”_blank” onclick=”, ‘_blank’, ‘height=480, width=515’); return false;”> to open your target page in a your-sized window when someone with Javascript (on) clicks, or in a new whatever-sized window without Javascript. Note the “return false;”, which keeps the link from being followed when Javascript is on. For a link that isn’t usable without Javascript, when the target is nothing but a Javascript program, use <a href=”JavascriptRequired.html” onclick=”‘coolprogram.html’ …); return false;”>, and create a page named JavascriptRequired.html that explains what your users are missing out on by not using a browser with Javascript enabled.
[techniques cribbed from]


Comment by Hossein Sharifi #
2002-02-24 17:24:34

You have converted the actual mailto link to URL encoding, but the text still exists in the source, and I think that bots can find that too. You can easily encode that text as well. For example, instead of using %65, you would use A , which the browser interprets as A.

Comment by Phil Ringnalda #
2002-02-24 17:32:01

Oopsie. That would have jumped out at me if the line wasn’t so long: I didn’t scroll out past the mailto to notice the link text. I need to figure out how to turn word wrap on by default in HTML-Kit. One more function call…

Comment by Phil Ringnalda #
2002-02-24 17:53:01

… and we’re set.

Comment by Phil Ringnalda #
2002-04-19 20:18:56

And, a mere two months later, and thanks again to Hossein, you can not only access the comments without Javascript, you can actually submit a comment. No preview, but then, if you have script turned off it’s because you don’t trust me, so too bad: no preview for you. At least until I redo preview to handle it more reasonably.

Name (required)
E-mail (required - never shown publicly)
Your Comment (smaller size | larger size)
You may use <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <del datetime="" cite=""> <dd> <dl> <dt> <em> <i> <ins datetime="" cite=""> <kbd> <li> <ol> <p> <pre> <q cite=""> <samp> <strong> <sub> <sup> <ul> in your comment.