User stylesheets to show nofollows

April 05th, 2008 – 21 Comments

I’ve recently switched back to Safari as my main browser because good ol’ Firefox kept crashing on me, and I must say that it’s been a smooth experience so far. Safari is a great browser, of course, and 3.1 is very fast as well. One of the things I like to see for every site though is where they use nofollow, so I had to find a way to do that in Safari.

The easiest way of doing that, in my opinion, is using a user stylesheet. You can specify it in your Safari preferences, under Advanced:

User Stylesheet Selection

(BTW, you can use user style sheets on Firefox too.)

Then put the following in the stylesheet you selected:

a[rel~=nofollow] {
background-color: pink !important;
color: black !important;
font-weight: normal !important;
text-decoration: underline !important;

And after that, all nofollow links (even the ones marked external nofollow) you encounter should look something like this.

If you want to make sure you see nofollowed image-links as well, add this:

a[rel~=nofollow] img {
border-bottom: 3px solid pink !important;

That will add a small pink bottom border to the image that is linked. Download the entire stylesheet here.

21 Responses to User stylesheets to show nofollows

  1. DoFollow
    By DoFollow on 14 July, 2008

    I’m glad to see other users promoting dofollow. Success with your blog !


  2. Sam Daams
    By Sam Daams on 5 June, 2008

    ps. as mentioned in my earlier post, note that any webmaster wanting to fool you into seeing a link as if it doesn’t have any nofollow on it, can enter a more specific rule in their stylesheet and overwrite for example the Firefox plugin (add in wrapper id or some such). If you have a personal stylesheet like this set, it can’t be overwritten (at least I haven’t managed to in brief testing).

  3. Joost de Valk
    By Joost de Valk on 5 June, 2008

    @Sam that [code] was their for a plugin I threw away ;)

  4. Sam Daams
    By Sam Daams on 5 June, 2008

    Decided to come back to this after using safari a bit more. I added the following stylesheet which matches Firefox so bit more normal for my eyes :)

    a[rel~=nofollow] {background-color:#ffc8c8 !important;border:1px dashed #b22222 !important;}

    Works for images too although 2px height off compared to FF but that might just be a safari/ff difference anyway. Didn’t add the [code] either; guess that was just for descriptive purposes?

  5. Bull Gang Tactical
    By Bull Gang Tactical on 10 April, 2008

    Thanks for the heads up. I have never looked into such things as this. Now that you pointed this out it is good for all sorts of little functions. Thanks for pointing out a feature i have overlooked.

  6. Ziz
    By Ziz on 9 April, 2008


    Thanks for the Safari CSS – just what I was after! Does anyone else know of any other SEO plugins for Safari?

    In response to a couple of people’s comments: I’ve heard so many people complaining about Firefox’s instability and lack of speed recently. In fact, I was one of them until mid February; In my frustration I posted on the forum and my faith in FF was restored shortly afterwards.

    If you use plugins not built by the people who built FFox can you expect solid performance from FFox?
    I went here ( and created a new user profile that I use just for browsing the web – FF’s never crashed on me since, on either profile. I use the original FF skin for both my SEO and normal browsing profiles, again – anything not built by FF developers can’t be expected to have zero effect on FF’s performance themes included.

    Thanks for such an informative site Joost.


  7. Sam Daams
    By Sam Daams on 9 April, 2008

    Haha, interesting to see this post. I was actually wondering a few weeks how many webmasters add this into their stylesheets to throw off link buyers that are too lazy to look at the code:

    a[rel~=nofollow] {background-color:#fff !important;border:none !important;}
    a[rel~=nofollow] img {border:none !important;}

    Now before everyone gets their panties in a bunch over people starting to use this (surely I’m not the first to think of this!), there is a really good reason to add this imo and that’s design. I’ve seen navigations that hang together to the last pixel. Throwing a pink background and border at nofollows like the searchstatus addon in FF does, screws with that big time.

    Of course if you’re doing it to fool link buyers, be prepared to also suffer the consequences of fooling Google manual reviewers who come and check out your site based on reports filed. I’m sure those reviewers use tools like this rather than sifting through code!!

  8. Henning
    By Henning on 7 April, 2008

    Ok, now it’s officially cool ;-)

    Some weeks ago I had to find that most nofollow bookmarklets don’t work with such combinations of “external” and “nofollow” so I made one that does:
    It’s the link that says »nofollow?« (page is in german).

  9. Annagram
    By Annagram on 7 April, 2008

    I love safari for some reason, I guess I should appreciate FF more – it performs better but I’ve all my bookmarks now in safari!!!

  10. Joost de Valk
    By Joost de Valk on 7 April, 2008

    @Henning fixed!

  11. Joost de Valk
    By Joost de Valk on 7 April, 2008

    @Henning: hmm it would if I fixed it to ;) let me have a look at that

  12. Henning
    By Henning on 7 April, 2008

    This would not work for e.g. wordpress links that go rel=”external nofollow”, would it?

  13. Copes Flavio
    By Copes Flavio on 6 April, 2008

    Nice one, thanks :) It’s something strange but Firefox keeps crashing also on my Mac, I think it’s the load of addons I’ve put in it :| BTW I switched to the newest FF 3 b5

  14. Scott Johnson
    By Scott Johnson on 6 April, 2008

    For those who use <a href="; rel="nofollow">Stylish</a>, I setup <a href="; rel="nofollow">a userstyle that contains this same code</a>.

  15. PublicRecordsGuy
    By PublicRecordsGuy on 6 April, 2008

    Again, you cease to amaze. I’ve learned more from your blog postings than most of the research on various forums, etc. I guess you get what you pay for. Thanks for sharing this tip.

  16. Brian W
    By Brian W on 5 April, 2008

    Thanks for this tip. Its very useful when I don’t want to have the SEO for Firefox plugin turned on. One thing I notice tho, is that it doesn’t highlight the name of the commenter when it is a link. Wonder why that is?

  17. Justin Goldberg
    By Justin Goldberg on 5 April, 2008

    I like seoquake over the red outline because it strikes through nofollow links, which is more noticeable to me.

Check out our must read articles about Analytics