CyberNotes
Web Browser Wednesday

Browsers As websites continue to become more and more AJAXified I believe that bookmarklets are going to become a larger driving force. Some of you may not be familiar with bookmarklets, so I was trying to think of a good way I could explain them. When I stumbled upon the Wikipedia article I thought it couldn’t be said any better:

A bookmarklet is a small JavaScript program that can be stored as a URL within a bookmark in most popular web browsers, or within hyperlinks on a web page. Because Internet Explorer uses the term favorites instead of bookmarks, bookmarklets are also less commonly called favelets by users.

Bookmarklets can be saved and used like normal web page bookmarks. Therefore, they are simple “one-click” tools that can add substantial functionality to the browser. For example, they can:

  • Modify the way a web page is displayed within the browser (e.g., change the font size, background color, etc.).
  • Extract data from a web page (e.g., hyperlinks, images, text, etc.).
  • Jump directly to a search engine, with the search term(s) input either from a new dialog box, or from a selection already made on a web page.
  • Submit the page to a validation service.

There are all kinds of services that provide bookmarks, especially for browsers that don’t support extensions or add-ons, like Opera. The problem is trying to find ones that are actually useful to you. Below I have categorized the different bookmarklets depending on what you are trying to do. I have quite an extensive collection of bookmarklets that I have gathered over the years with my two primary sources being SquareFree and OperaWiki. I’ll be mashing the two sources together to bring you my favorites, and each one will have images signaling which browsers they work with (Firefox 2 Firefox , Internet Explorer 7 Internet Explorer , and Opera 9 Opera ).

Note: To use any of the following bookmarklets just hold down the left mouse button and drag the hyperlink to the bookmark toolbar in your browser. 

–Hyperlink Manipulation–

  • Color code links Firefox Internet Explorer Opera
    Makes all internal links on a site red, external links blue, and links pointing to the current page (internal bookmarks) orange.
  • Hide visited hyperlinks Firefox Opera
    Removes all hyperlinks that you have already visited on a site, therefore making it easier to see which links you still need to open.
  • Rewrite redirects Firefox Internet Explorer Opera
    This script will rewrite all URL’s to point directly to the source instead of routing through a redirect URL.
  • Increment URL Firefox Internet Explorer Opera
    Increases the last number in the URL by 1. This will often work with sites where you go through multiple pages, and therefore simulates pressing the “Next” link.
  • Decrement URL Firefox Internet Explorer Opera
    Decreases the last number in the URL by 1. This will often work with sites where you go through multiple pages, and therefore simulates pressing the “Previous” link.
  • Generate TinyURL Firefox Internet Explorer Opera
    Creates a TinyURL for the current site.
  • Linkify Firefox Internet Explorer
    Make all plain-text URL’s into hyperlinks.

 

–Form Manipulation–

  • View password Firefox Internet Explorer Opera
    Shows password field in plain text instead of asterisks. 
  • Remember passwords Firefox
    Some sites try to block passwords from being stored by using the “autocomplete=off” option in the form. If a website is blocking the storage of a password using this option (such as Yahoo! Mail) then it will remove it from the HTML so that the browser can store the password. 

 

 –Appearance Manipulation–

  • Remove bloat Firefox Internet Explorer Opera
    Eliminates all occurrences of Flash, Java, music, and third-party iframes.
  • Disable StyleSheets Firefox Internet Explorer Opera
    Turns off all stylesheets which might be useful for hard-to-read websites.
  • Slowly load the site Firefox Internet Explorer
    Choose how many characters to load on the site each second. Might be useful to test what your site looks like on a dial-up connection by setting the character limit to something low.
  • Duplicate tab Firefox
    Opens the current site in a new tab. 
  • Highlight search term Firefox Internet Explorer Opera (submitted by “edwest”)
    Prompts for a search term that you would like to highlight on the current page.
  • Ultimate Highlight Firefox Internet Explorer Opera (submitted by “Chad-)”)
    Prompts for a search term to be highlighted. It will also display a box in the upper-right corner of the screen with the number of results on the page and a link to start a new search.

 

–Cookie Manipulation–

  • Remove site’s cookies Firefox Internet Explorer Opera
    Deletes all cookies created by the current site.
  • View site’s cookies Firefox Internet Explorer Opera
    View all cookies created by the current site.
  • Transfer site’s cookies Firefox Internet Explorer Opera
    Transfer cookies created by the current site to a different browser. This bookmarklet will give you the necessary code to re-create a specific cookie in a different browser.

 

–Other Bookmarklets– 

  • Calculator Firefox Internet Explorer Opera
    A popup window where you can enter in a simple calculation such as “7 + 4″ and have it return the sum of those two numbers.
  • ASCII table Firefox Internet Explorer Opera
    Shows the ASCII character table in a new window
  • WebColors Firefox Internet Explorer Opera
    Shows the 216 “browser-safe” colors with their corresponding hex codes.
  • Scroll by Dragging Firefox Internet Explorer Opera (submitted by “Chad-)”)
    Executing this bookmarklet will turn the cursor into a scroller and executing it again will return it back to normal.

 

There you go…now you can start to utilize the power of bookmarklets. If you’re a Firefox user, than many of the bookmarklets mentioned above can also be found in extensions, such as the Linkify. Personally I prefer to use the bookmarklets so that I keep my extensions list to a minimum, and also because I don’t want an extension analyzing every site that I visit when it really isn’t necessary.

There are many more bookmarklets available, so I tried to keep the list concise, yet thorough. If you know of a bookmarklet that you can’t live without, let us know so that we can add it to the list.

Update:
We have written Best Bookmarklets Part 2.

There Are 30 Comments

  1. Thanks for this Ryan!
    I used to be into Bookmarklets a good bit.
    Got out of it after a couple re-formats. Now, I’m back in :lol:
    One I have kept using is called Highlight. It does just that for any term you put into the box that pops up. I may be searching for all instances of a certain word on a page so I hit my Highlight Bookmarklet & input that word & voila!
    Highlight can be found here: [tinyurl.com] (Ha! I used the TinyURL Bookmarklet for this)

  2. [www-ui.is.s.u-tokyo.ac.jp]~kobayash/misc/bookmarklets.html

    ‘Scroll by dragging’ is by far the best I’ve seen :)

  3. Thanks guys, just added both of them to the post. That scrolling one is really cool. ;)

  4. @edwest
    Have you tried the Ultimate Highlight Bookmarklet from this [operawiki.info] that Ryan linked to?

  5. Thanks a lot Ryan!

    I liked the “hide visited hyperlinks” and “rewrite redirects.” Both time-savers for me.

  6. Chad-) wrote:
    @edwest
    Have you tried the Ultimate Highlight Bookmarklet from this [operawiki.info] that Ryan linked to?

    I wonder how I glanced over that one? It is much better than the standard highlight. ;)

  7. Wow, great compilation. I’ll surely bookmark this post

  8. dude, the best bookmarklet i have is “send email”. once you click on it, it composes an email message, with the title of the page as the subject, and the URL in the body.

    whenever you find something worthwhile, you click on it, write your firend’s email, and send it.

    i talk more about it at [blog.nonlinearmatters.com]

  9. Thank you for this excellent recourse. Since I use Opera, but Fx for Y!MB, I need to open links from Y!MB (usually RSS) in Opera. To do this, I use the OperaView ext to open links in Opera. However, Y!MB puts a Y! redirect on links to RSS posts, so I had to view the links in new Fx tab, then view current tab in Opera, then close that tab. Thanks to rewrite redirect, I just run the bookmarklet then all links on the page are fixed, and can be opened directly in Opera.

    The only thing is I have to run the bookmark each time. Do you know if this is available as an ext or a GM script? I wonder if there’s any extension to run certain bookmarklets on certain pages. I kinda doubt it.

  10. I’m not sure how familiar you are with JavaScript, but you should almost be able to copy and paste the code from the bookmarklet into Greasemonkey and have it do the work for you.

  11. I’m personally not very well read when it comes to coding (yet). I’ve only coded BASIC programs at school. I was thinking that, since userscripts are basically just bits of Javascript. I’ll give that a try, using another script for a sample for formatting.

  12. I’m personally not familiar with programming yet, i’m still learning and i was hoping that you are going to help me with that (programming)

  13. mornfuldragon wrote:
    I’m personally not familiar with programming yet, i’m still learning and i was hoping that you are going to help me with that (programming)

    Unfortunately I don’t have much time to help you learn how to program bookmarklets, but I’m sure you can find plenty of resources on the Internet.

  14. Hey Chad, Opera9.5b has scroll dragging built in set to ctrl+alt+Lclick default.

  15. I would like to share one more bookmarklet which shows thumbnail preview of the link on which you moves the mouse. It is at [globefeed.com]

  16. Oh man, I LOVE the “scroll by dragging” bookmarklet!

  17. I wonder about some of these boomarklets…. I am NOT a programmer or creative amateur computer nthusiast….. I am strictly a user and i think that it is really great to have some of these bookmarklets, for instance the scroll one…. But i wonder, would it be possible to make a Function key or any other key combination work the bookmarklet?

Leave Your Comment


Message is the only required field.
Emails are not published.