Saturday, May 24, 2008

Don't Abuse Anchors -- Use CSS

Many web developers use anchors "<a...>" to suround texts and images simply to change the cursor. This usually involves setting the href property to "#" and possibly using the onclick event to execute some JavaScript code and then adding "return false;" at the end so that the page doesn't jump to top every time a user clicks the link.

This might have been the right way to do things at some point. However, after introducing the CSS element "cursor," there is no reason to use all that mess. Simply set the cursor property of the HTML element in question to "pointer" and add the onclick event code to the element itself if needed.

So for example:

.button {
cursor: pointer;
}


This makes code look so much cleaner and it would prevent the URL in the browser from changing to something with an "#" at the end. Moreover, it would also prevent the status of the window shown usually at the bottom of the browser from changing when hovering over the element.

No comments: