The last bookmarklet post reminded me that I collected a bunch of really useful web design bookmarklets. So, whilst my christmas spirit is still flowing (aka glenfiddich), I’ll whack these up here as well. The ‘show divs with color’ one is particularly cool. I cannot for the life of me remember where I got them (although zeldman.com was involved somewhere along the line).
Same rules apply – drag them to your browser’s links toolbar:
1) Show’s div’s with red dashed border and spans with a green box:
show divs with color
2) Shows the generated source (great for weirdo javascript and other client side code weirdness)
W3C CSS validator
4) HTML validator on current url
W3C HTML validator
5) Validate HTML, CSS and links all at the same time – in a separate window
‘,fc=ft+’style=\’border:2px%20solid%20#ff0\’%20src=\’http://’,fm=’%3C/frameset>’;var%20h=fs+’\'javascript:document.write(‘+p27+’%3C!DOCTYPE%20HTML%20PUBLIC%20%22-//W3C//DTD%20HTML%204.0//EN%22%3E%3Cbody%20style%3D%22margin:0;padding:2px%206px%22%3E’;var%20h1=’%3Ch1%20style%3D%22display:inline;font-size:18px;margin:0;%22%3E’;var%20e=’%3E%3C/body%3E’+p27+’)\’%20scrolling=\’no\’%20noresize>’;var%20q=String.fromCharCode(34);var%20r=’%20results’,v=’%20validator’+r,w=’validator.w3.org/check’;var%20ds=’%3C!DOCTYPE%20HTML%20PUBLIC%20′+q+’-//W3C//DTD%20HTML%204.0%20Frameset//EN’+q+’>%3Chtml>%3Chead>%3Ctitle>Multivalidator%3C/title>%3C/head>%3Cframeset%20cols=\’50%,50%\’>%3Cframeset%20rows=\’24,*\’>';ds+=h+’%3Cdiv%3E’+h1+’Page:%3C/h1%3E’+d+’%3C/div’+e;e=’%3C/h1′+e;h+=’%3Ch1%20style%3D%22display:inline;font-size:18px;margin:0;%22%3E’;ds+=h+’%3Cscript>document.location=%22′+d+’%22%3C/script>’+e+fm+’%3Cframeset%20rows=\’24,*,24,*,24,*\’>';ds+=h+’HTML’+v+’%3Ca%20title%3D%22Refresh%20to%20remultivalidate.%20Click%20for%20more%20info%20on%20favelets.%20-Tantek%22%20href%3Dhttp://favelets.com/%20target%3Dhelp%20style%3D%22float:right;padding:1px;width:1em;font:10px%20Avant%20Garde,Chicago,Times,Arial,serif;text-decoration:none%22>@%3C/a>’+e;ds+=fc+w+’?uri=’+d+fe;ds+=h+’CSS’+v+e;ds+=fc+’jigsaw.w3.org/css-validator/validator?uri=’+d+fe;ds+=h+’HREF%20checker’+r+e;ds+=fc+w+’link?url=’+d+fe;ds+=fm+fm+’%3C/html>’;document.open();document.write(ds);document.close();void(20020315);”>Multivalidator
7) Resize the current browser window to 1024*768
resize browser 1024×768
8) Resize the current browser window to 800*600
resize browser 800×600