Welcome to my blog, please feel free to subscribe to my RSS feed, join me on Twitter or leave a comment.

Sometimes on a website we want to link to another section for Google or other robots but we don’t want to distract our users with too many links, how do we do it? Cascading Style Sheets and a little HTML knowledge.

First, when you add a link to your website we want to assign a class to it like so:

<a href=’http://www.thisismyurl.com’ class=’noshow’>

In my case, I’ve labeled this link with the special tag noshow which will let me affect the appearance. Next in the CSS, let’s add a special rule for it:

a.noshow {
     /* this is what we want the normal link to appear as */
     text-decoration: none;
     font-color: #000000; /* (assuming your default text is black) */
}

a.noshow:hover {
     /* when people mouse over the link */
     font-color: #000000; /* (assuming your default text is black) */
     cursor: default;
}

As you’ll see since rules cascade from in a logical order, the text-decoration rule automatically applies to the hover state since it applies to the normal state but since hover states have their own color, we have to redefine it.

There you go … now you can put links on your website that nobody knows are there.