What are Favelets / How can I modify my browser on the fly?
Favelets, or bookmarklets, are a quick and easy way to add functionality to your browsing experience. Favelets (as I will refer to them from here on) are bookmarks (i.e. favorites) for your browsers, but instead of storing a web or ftp address as a URL they store javascript which executes when the favelet is �opened.� These favelets alter the behavior of either the browser itself or the page you are on� and are easy to use as dragging and dropping to where you keep your bookmarks to save and then opening them to execute.
Some of the functionality these offer is covered by Firefox�s Web Developer Toolbar, Microsoft�s Internet Explorer Web Developer Toolbar Beta, or similar apps, but it never hurts to have things in another form. Most of these will work in IE 5 and above, NS 7+, and other modern(ish) browsers.
Viewing Page Elements
Westcivs XRAY and MRI are amazing for a quick check on page layout and styling.
Slime’s Favelets only has 5 favelets, but all are geared towards developers. You can choose to outline divs in a thin red border and/or tables in a thin blue one (you can customize hex values in the bookmarklet as well as display properties of an object and executing JavaScript code.
Centricle (note there are more here than are specifically mentioned) has a favelet called show specific elements that pops up a dialogue box that will let you choose element(s) to highlight and then ask for a color. In a similar vein you can try highlight element favorite which works somewhat similar but is slightly version. His ruler favelet is also rather handy for non-fluid layouts or confirming box model bugs.
The Page Info favelets collected on Pixy provides some scripts that range from “gee that�s kind of neat” to very useful. The page freshness link could either be presented as a link on a site or adapted to run and echo last altered dates automatically.
Resizing the Window
While JavaScript resizing windows can be something of a nuisance with pop up windows, it is more aggravating when it is applied by a site to the active window upon loading. However being to have your browser automatically adjust to standard resolution sizes in one click is extremely helpful in checking fluid layouts or how font size changes impact elastic (em) based ones.
Tantek is generally credited with coining the term favorites and the favelets page on his site has many favelets dealing with browser resizing. Zeldman has two customized move/resize favelets for 800 and 1024 width and fluid height. If you don�t use sidebars feel free to edit the moveTo values (I did).
Usability
Pixy has the ubiquitous validation favelets as well as some that alter CSS styling that may make the browsing experience easier on sights that don�t have strongly contrasting text or busy backgrounds.
Tantek has favelets for translating pages via babelfish and is pretty easy to modify. At the end of the favelet you will see something like (�&lp=it_en&tt=url’), you can change it_en (Italian to English) to whatever you wish, provided Babelfish supports it en_it would be English to Italian, zh_en would be Chinese to English, etc.
More Resources
In addition to further content at the sites mentioned above, check out bookmarklets.com and Bookmarklets at mvps.org/dmcritchie.