This is a simple (“simple” hah, it’s pretty complex for a simple annotation) implementation of a bounce URL for adding rel=nofollow support to a static HTML site. (More on other nofollow approaches) Overview We’ll modify 3 things: Add a /nofollow/ URL which redirects as appropriate Add the /nofollow/ URL to the site’s robots.txt. Modify the render-link.html code to swap in the rel=nofollow Passing mechanism: We’ll use URL anchors (/folder/page#anchor) to pass the destination URL.

I touched on nofollow for Hugo-sites recently, but thinking about it a bit more, I wonder if it needs some kinda of failsafe setup. What happens if Hugo stops injecting the link parser? What happens if I move to a different setup and forget the link processor? What happens if … (insert paranoia here) The goal of nofollow links is to avoid having search engines use them, but still to allow users to use them.

I seem to have more posts about nofollow links than actual nofollow links, but here’s one more. Markdown doesn’t support nofollow links by default, so you either have to write them in HTML or tweak your template to handle them. Update: after reviewing the options, I ended up using a bounce-URL instead. Nofollow links with HTML This is kinda simple. Just write HTML directly in markdown: anchor <a href="https://example.com" rel="nofollow">anchor</a> Nofollow links with markdown There are probably easier ways to do this, but I didn’t spot any off-hand.

Here’s a simple trick to view nofollow links in Google Chrome. Just drag and drop the following link to your bookmark bar and hit it whenever you want to see links with the rel=nofollow HTML microformat: Nofollow? This bookmarklet inserts a tiny bit of CSS into the top of the page you’re currently viewing. The CSS is similar to that which is used in other nofollow highlighting methods (archive.org): a[rel~=nofollow] { border:1px dashed #852!

The next step after adding CSS to highlight links with rel=nofollow is to give the user some information about what the symbol and the dashed line mean. Since CSS will not allow you to add tooltips and links, we have to resort to some javascript trickery. The up-side to this is that it will also display the markup on older browsers like IE 6. Adding this kind of markup to your site is pretty easy to do.

The “rel=nofollow” HTML microformat (archive.org) is a way to mark links which might be problematic, whether they’re clearly spammy, just not checked or even just sites that I don’t really want to link to (but still want to provide a link for others to use - you know, “don’t look, but that guy’s got a giant nose (archive.org)!”). I understand that it is important for search engines to recognize these kinds of links and to treat them differently.