Unfinished hyperlinks - add a todo

Tim Abell · May 25, 2013

Just a quick post;

Stop doing this

href="#"

Start doing this

href="#todo"

Why?

I’d like to promote a change to the habit of using ‘#’ as the placeholder for a the url of a new hyperlink when you don’t yet know where it’ll link to: instead set the href to “#todo”. This follows the //todo pattern recognised for unfinished code, and means you can now search your codebase for any links you forgot to finish off.

<a href="#">new link</a>

becomes

<a href="#todo" onclick="alert('Not Implemented');return false;">new link</a>

Demo: before becomes after

It will also give clues to any sharp-eyed testers / users that they should report a bug for you as the url will change to #todo when the unfinished link is clicked. It can often be seen in the status bar too. This has the handy side-effect of avoiding the annoying jump to the top of the page that is the default behaviour when you click on a # link that’s a placeholder.

For bonus points another little trick I like is to add a click handler with an alert to make it really obvious to any early users / testers that this is not done yet, and I’ve found this saves a lot of questions when you genuinely haven’t finished, and also guarantees a quick bug report when you should have (not that I ever forget any of course :-D)

<a href="#">new link</a>

becomes

<a href="#todo" onclick="alert('Not Implemented');return false;">new link</a>

Demo: before becomes after

You can automate giving all these links an alert with the following (cheers to “unknown” in the blogger comments)

$("a[href=#todo]").click(function () { alert('Not implemented yet.') });

Simple and effective.

If you agree, please help spread the word. Perhaps by retweeting my tweet


P.S. This goes hand in hand with a technique of picking points during development at which there should be no todo’s left in your codebase with the exception of those with references to outstanding user story / bug numbers. I suggest before marking a user story as done, and at the end of each sprint as good points to review all todos in your codebase.

Further reading:

Share: Tweet | LinkedIn
Suggest improvments: page source on github