Here’s a question for you: what do you get if, instead of bookmarking a link, you bookmark a snippet of javascript code ? If you answered “browser crash”, you’re wrong (hopefully). The right answer is “a bookmarklet”.
Bookmarklets are small bits of javascript that get executed every time you click on a bookmark. They have multiple advantages over extensions and plug-ins:
- No install: you don’t need to download or install anything, and you don’t even need to relaunch your browser. Just drag the bookmarklet link to your bookmarks bar, and you’re done !
- Hosted for you: bookmarklets code is almost always hosted on somebody else’s server. While this can have its downsides, it also means you don’t need to worry if you switch machines or don’t have hosting space.
- Cross-browser: since bookmarklets are written in javascript, they should work perfectly across all browsers. Of course there are exceptions due to some browser’s javascript quirks, but most of the time you’ll be fine.
Here are a few bookmarklets that will come in handy for web design and development.
1) ReCSS
ReCSS is an extremely useful bookmarklet that lets you refresh the current page’s stylesheets without reloading all the markup. If you add up all the time saved everytime you click “refresh” over a lifetime, you would probably find out you’ve saved a few days !
2) Syncotype
Syncotype overlays a baseline grid over the current page. This lets you adjust the page’s vertical rythm with maximum precision, and saves you the hassle of checking the dimensions of every element.
3) Shortwave
When you use shortwave, a javascript prompt comes up and lets you enter a pre-defined code, for example “g” to go to google, or even “img flower” to search google images for pictures of flowers. What’s best is that you can customize it and add your own codes !
4) Firebug Lite
Everybody knows and loves Firebug. That’s why it can be pretty frustrating to end up working with a browser that doesn’t support it (I’m looking at you, IE). Thankfully, Firebug Lite is just a click away. It might not support all of firebug’s features, but it’s much better than nothing.
5) Jash
Jash is a javascript shell for your browser. Once you load it, you can apply any javascript command you want to the current page. Very handy !
More bookmarklets resources:
