在「Usability: Don't Make Me Think and a Bookmarklet」這篇文章裡作者在讀了「Don’t Make Me Think, Revisited」之後有所啟發,寫了一小段 javascript code,可以將網頁上所有文字都變成同樣長度的亂碼,藉以測試許多 usability 特性。
我把程式碼丟進 yui-compressor 後變成這樣,比較容易貼到 bookmarklet 上使用:
javascript:(function(){var a=" ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";$("*:not(iframe)").contents().filter(function(){return this.nodeType==Node.TEXT_NODE&&this.nodeValue.trim()!=""}).each(function(){var c="";for(var b=0;b<this.nodeValue.trim().length;b++){c+=a.charAt(Math.floor(Math.random()*a.length))}this.nodeValue=c})})();
不過這段程式碼假定頁面上有 $
這個 object (i.e. jQuery),所以我把程式碼改成吃 jQuery
這個 object,這樣確保 jQuery.noConflict() 後的網站還是可以動:
javascript:(function(){var a=" ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";jQuery("*:not(iframe)").contents().filter(function(){return this.nodeType==Node.TEXT_NODE&&this.nodeValue.trim()!=""}).each(function(){var c="";for(var b=0;b<this.nodeValue.trim().length;b++){c+=a.charAt(Math.floor(Math.random()*a.length))}this.nodeValue=c})})();
效果如下,還蠻有趣的: