<span class="mt-enclosure mt-enclosure-image" /><img alt="google chrome でnofollow属性を視覚化" src="http://web-marketing.zako.org/images/google-chrome-nofollow.jpg" width="514" height="204" style="" /></span>

<p>Google Chrome既に様々なHackが出てきていますが、今回はちょっとWEB担向けなnofollow属性を視覚化してくれる便利ツールのご紹介。</p>

<!--more-->
<h3 class="header-label">Google Chromeでnofollow属性をチェックできるブックマークレット</h3>

<p>このページをGoogle Chromeで開き、↓の「Nofollow?」のリンクをブックマークツールバーへドラッグ&ドロップしてください。</p>
<p><a href="javascript:function%20highlightNofollow(){var%20newStyle=document.createElement('style');newStyle.type='text/css';newStyle.appendChild(document.createTextNode('a[rel~=nofollow]{border:1px%20dashed%20#852!%20important;background-color:#fcc!%20important;}'));document.getElementsByTagName('head')[0].appendChild(newStyle);};highlightNofollow();" style="background-color: #eef; border: solid 1px #aaa; color: #446; padding: .5em 2em; text-decoration: none; font-weight: bold; text-shadow: 1px 1px 1px #88a; font-size: 1.1em; -webkit-box-shadow: 2px 2px 2px #666;" title="Nofollow?">Nofollow?</a></p>
<p>そしてチェックしたいページでクリックすれば下記のように表示されます。<br />
<a rel="nofollow facebox" href="http://lh4.ggpht.com/sigeos15/SMpqg8s22sI/AAAAAAAAFm8/YJfEb7lLTkU/s800/Fullscreen%20capture%2020080912%20221112.jpg"><img src="http://lh4.ggpht.com/sigeos15/SMpqg8s22sI/AAAAAAAAFm8/YJfEb7lLTkU/s288/Fullscreen%20capture%2020080912%20221112.jpg" /></a></p>

<p>ちなみに仕組みは下記のようにCSSの条件一致で行っているようです。</p>

<textarea name="code" class="css" cols="60" rows="5" id="code">
a[rel~=nofollow] {
border:1px dashed #852! important;
background-color:#fcc! important;
}
</textarea>

そして参考までにブックマークレットのソースはこちら
<textarea name="code" class="js" cols="60" rows="5" id="code">
javascript:function%20highlightNofollow(){var%20newStyle=document.createElement('style');newStyle.type='text/css';newStyle.appendChild(document.createTextNode('a[rel~=nofollow]{border:1px%20dashed%20#852!%20important;background-color:#fcc!%20important;}'));document.getElementsByTagName('head')[0].appendChild(newStyle);};highlightNofollow();
</textarea>

<p>まだまだゴロゴロいろんなものが出てきそうですよね。 ここでも随時ご紹介します。</p>

<p>Via:<a class="web-site-link" href="http://johnmu.com/seeing-nofollow-links-in-google-chrome/" onclick="window.open('http://johnmu.com/seeing-nofollow-links-in-google-chrome/'); return false;">Seeing nofollow links in Google Chrome » johnmu.com</a></p>

<script class="javascript" src="http://web-marketing.zako.org/js/shCore.js"></script>
<script class="javascript" src="http://web-marketing.zako.org/js/shBrushXml.js"></script>
<script class="javascript" src="http://web-marketing.zako.org/js/shBrushJScript.js"></script>
<script class="javascript" src="http://web-marketing.zako.org/js/shBrushCss.js"></script>
<script class="javascript">
dp.SyntaxHighlighter.HighlightAll('code');
</script>