WebsitesMadeRight.com
Awesome Bookmarklets + Tutorials and Resources
I have quite an extensive collection of bookmarklets that I’ve presented here for your convenience, I recommend all of them. There’s also a round-up of tutorials and resources at the bottom.
To save a bookmarklet, click and drag it to your bookmarks bar.
-
Google
-
- Note in Reader
- Opens a box with options to add it to Google Reader. Also works in iOS Safari.
- Google Dictionary
- Opens the selected word in Google Dictionary.
- Google Cache
- Opens Google’s cache of the current page.
- Mobilize Me
- Converts the current page to Google’s mobile version.
- New Doc
- Opens a new document in Google Docs.
- Translate to English
- Translates either the page to English from the detected language or the selected text using Google Translate.
- Add event
- Opens a prompt with the selected text to create that event in Google Calendar.
- Google Highlighter
- Highlights the search query text on a page that resulted from your Google search. (UserScript: googlesystem.blogspot.com/2010/01/highlight-google-search-keywords.html)
- Google Search
- Does a Google Search of the selected word(s).
- Google Blog Search
- Does a Google Blog Search of the selected word(s).
- Subscribe in Google Reader
- Subscribes to the default RSS feed provided for that page in Google Reader.
- Map this
- Does a search in Google Maps for the selected address or business.
- Google Scribe
- Enables Google Scribe for the current page. Google Scribe is auto-complete for grammar and spelling.
- Definitions
- Does a search in Google for the definition of the selected word using the “define:” command (i.e. “define:plethora”).
- GMail This!
- Grabs the selection and opens Gmail with it in the body in a pop-up window.
-
Twitter
-
- Tweet This Page
- Pops-up a tweetbox to enter a tweet into with the selected text or with the default text of the page title, it also converts the URL using bit.ly. (http://moopz.com/2009/04/twitter-bookmarklet-and-tweet-button.html)
- TweetThisPage
- Opens a pop-up window with Twitter’s tweetbox to enter a tweet. (via Carrer web log)
- FastTweet
- Takes you to Twitter.com with the default text of the page title and the full URL.
- Twitter Klout Score
- Searches the selected text for the user’s Klout score on Twitter. Klout measures a user’s influence across their social network. (http://www.moretechtips.net/2010/12/twitter-score-bookmarklet-klout-edition.html)
- Twitter Score
- Searches the selected text for the user’s popularity on Twitter. (http://www.moretechtips.net/2010/12/twitter-score-bookmarklet.html)
-
For Fun
-
- Katamari!
- Makes your page a Katamari game. (http://kathack.com/)
-
Page Formating
-
- Readability
- Converts the page to a more readable format. (readability.com)
- Readable
- Converts the page to a more readable format using your predefined styles. (readable.tastefulwords.com)
- ViewText
- Converts the page to a more readable format. (http://viewtext.org/)
- Instapaper Text
- Converts the page to a more readable format. (http://www.instapaper.com/extras)
- GReadable
- Converts Google Reader to a more readable format. (via Carrer web log)
- WikiReader
- Converts the page to a more readable format. (via Carrer web log)
- ClipR
- Lets you select which page section to convert and make more readable. (code.google.com/p/clipr)
- Print Friendly
- Converts the page to a more readable format and lets you select which elements and containers to remove. (printfriendly.com)
- QuickRead
- Pops-up a lightbox containing the main content of the link.
-
Developer
-
- Mobile Perf
- Provides tools for inspecting, profiling, and debugging the page, intended for mobile devices. (via stevesouders.com)
- Firebug Lite beta
- Open a JavaScript version of Firebug. Works in iOS. (getfirebug.com/firebuglite)
- DOM Monster!
- Opens a pop-up performance profiling data. (mir.aculo.us/dom-monster)
- Display Stats
- Opens a box that shows JavaScript performance info. (https://github.com/mrdoob/stats.js)
- Statsy
- Pops-ups a box with performance profiling data. (via ajaxian.com/archives/statsy-find-those-wasted-bytes-with-a-bookmarklet)
- Aardvark
- Lets you do various commands to study the document source. (http://karmatics.com/aardvark/)
- Holmes.css
- Puts colored outlines around potentially invalid, inaccessible or erroneous HTML markup.(red-root.com/sandbox/holmes)
- Refresh CSS
- Refreshes the external style sheet.(https://gist.github.com/649650)
- ReCSS
- Refreshes the external style sheet. (david.dojotoolkit.org/recss.html)
- Maki
- Opens the Maki toolbar that lets you overlay a mock-up over the page for pixel perfect tweeking. (makiapp.com)
- Canvas Grid
- Overlays 10px by 10px grid on the page. (vcarrer.com/2010/09/canvas-grid-js1k-entry.html)
- Wirify by Volkside
- Creates a wireframe of the current page. (www.wirify.com)
- Window Size
- Displays the viewport size in the top left.
- ffffallback
- Finds the web fonts used and lets you try alternative fonts. (ffffallback.com)
- WhatFont?
- Identifies the font in a tooltip when you hover over text and pops-up info when you click. (chengyinliu.com/whatfont.html)
- FontFriend
- Pops-up a toolbox for exploring and editing page fonts. (somadesign.ca/projects/fontfriend)
- Kern.js
- (kernjs.com)
- RedDIV
- Puts a red outline around divs.
- autoPopulate
- Auto-populates form fields for quick testing. (dom111.co.uk/files/autoPopulate)
- Dojo Toolkit API Bookmarklet
- Opens a prompt to lookup the term in the Dojo reference.
- Phantom Limb
- Puts an image of a big hand pointing over the page to simulate a touch screen user. (vodori.com/blog/phantom-limb.html)
- Screen readers
- Turns the screen black so you can tab through and see what screen readers see. (felipe.wordpress.com/2010/01/15/accessibility-usability)
-
Other
-
- Quix App
- Opens a prompt that responds to text commands. It has 109 commands. (quixapp.com/help)
- Shortwave
- Opens a prompt that responds to text commands. It has 21 commands. (shortwaveapp.com)
- Shorten with X.CO
- Opens X.CO with the URL of the page in the input box. (x.co)
- Short URL
- Opens to bit.ly to get the shortURL (bit.ly)
- Get Long URLs
- Converts ShortURLS to LongURLS
- TinyURL
- Opens a prompt with the TinyURL provided by the page owner. (revcanonical.appspot.com)
- Capture Screenshot
- Open kwout.com with a screenshot (kwout.com)
- Take Screenshot
- Opens webshotspro.com to get a screenshot of the URL. (webshotspro.com)
- Urban Dictionary lookup
- Looks up the selected slang term in Urban Dictionary. (urbandictionary.com)
- Confusing Words
- Opens ConfusingWords.com and looks up the selected word in their database. (confusingwords.com)
- Acronym lookup
- Looks up the selected acronym. (acronymfinder.com)
- MarkUp
- Opens a drawing UI for drawing on the page which can be visible to others who use MarkUp. (markup.io)
- Goggles
- Let’s you draw on the page. (goggles.sneakygcr.net)
- Bespin
- Replaces a textarea with a Bespin editor. (https://bespin.mozillalabs.com/bookmarklet)
- Syntaclet
- Beautifies the code on the page with prettyprint. (syntaclet.com)
- View passwords
- Changes the password fields to text fields.
- User Style Bookmarklet
- Replaces the CSS styles with your own predefined styles.
- Showyou
- Sends the video to Showyou to share it on Showyou or add them to your Watch Later queue.
- Instapaper Offline Reading
- Sends the URL to Instapaper for offline reading.
- PrintWhatYouLike
- Opens a tool panel with options to format and save the page. (.printwhatyoulike.com)
- joliprint
- Converts the page to PDF (for easier printing). (joliprint.com)
- Print Friendly
- Makes any web page print friendly. (printfriendly.com)
- Set up at ToRead.cc
- Sends the web page to your email. (toread.cc)
- Send 2 Zamzar for Conversion
- Takes any YouTube video and converts it into another downloadable format using Zamzar. (zamzar.com)
- FLV Resources Downloader
- Redirects the page to a service that lets you grab the FLV and convert it. (flvresources.com)
- Alexa site profile
- Opens up the website’s profile in Alexa.com
- doj.me
- Takes you to doj.me and tells you if the site is down or if it is just you. (doj.me)
-
iOS/Mobile
-
- Snoopy
- Pops-up a tool for viewing the source and related info. (snoopy.allmarkedup.com)
- Change font size
- Opens a prompt to specify font size.
- Find in this page
- Opens a prompt to specify text to find.
- Dictionary
- Opens a prompt to specify word to look up. (dictionary.com)
- Thesaurus
- Opens a prompt to specify word to look up. (thesaurus.com)
- vv Scroll to Bottom vv
- Scrolls to Bottom.
- Display all images
- Displays only the images.
- List all links
- Lists all the links in a new window.
- Wikipedia
- Opens a prompt to specify terms to look up. (Wikipedia.com)
- Google Translate
- Translates to English using Google Translate
- Movie times
- Opens a prompt to specify zipcode using Google Movie Search
- Rotten Tomatoes
- Opens a prompt to specify what movie to find reviews for in Rotten Tomatoes. (rottentomatoes.com)
- Post with Twitterrific
- Opens the Twitterrific iOS app. (http://twitterrific.com/)
- Readability
- Formates the page to a more readable format for mobile. (readability.com)
- Tidy Read
- Converts the page to a more readable format for mobile. (tidyread.com)
- Show RSS Feed
- Shows the RSS feed in the SavantTools.com RSS feed reader. (SavantTools.com)
- Show Password
- Converts password fields to text fields.
Bookmarking Services
Sign-up with these to get their bookmarklet.
- http://ffffound.com/
- Image sharing
- http://svpply.com/
- Ecommerce sharing
- http://zootool.com/
- Bookmark, organize and share your favorite images, videos, documents and links from all over the web.
Bookmarklet Development Tutorials
- Create Bookmarklets – The Right Way (Nettuts+ | Feb 17, 2011)
- Make Your Own Bookmarklets With jQuery (Smashing Magazine | May 23, 2010)
- Bookmarklet’s Foundations (Internet.com)
- How to Create a jQuery Bookmarklet (Latent Motion | May 20, 2010)
- How to Create a jQuery Bookmarklet Easily (WebAppers | May 20, 2010)
- jQuery Bookmarklet Generator (Ben Alman | June 26, 2009)
Bookmarklet Generators
- boo.kmarked.com
- Bookmarkleter
- Bookmarklet maker
- jQuery Bookmarklet Generator (Ben Alman | June 26, 2009)
Greasemonkey Stuff
Greasemonkey scripts (aka user-scripts) are like bookmarklets except they run automatically from the Greasemonkey browser extension for their specific website.
- The Complete Beginner’s Guide to User Scripts (1stwebdesigner | Aug 23, 2010)
- 15 Fantastic Greasemonkey Scripts for Better Browsing (Web.AppStorm | July 8, 2010)
- Greasemonkey and jQuery easier than ever (taw’s blog | May 22, 2010)
- Quick Look: Better Facebook (Web.AppStorm | July 23, 2010)
- How to Start Using Greasemonkey in Under 5 Minutes (ReadWriteWeb | Dec 26, 2008)
Bookmarklets Directories
Bookmarklets Round-ups
- Useful Google Bookmarklets (Google Operating System Blog | July 11, 2007)
- 15 Must-Have Bookmarklets For Web Designers And Developers (Web Resources Depot | Nov 25, 2008)
- 32 Incredible Bookmarklets for Chrome, Firefox, Safari and Internet Explorer (Maximum PC | June 2, 2010)
- 10 Useful Bookmarklets for Web Designers and Developers (Inspect Element | Nov 19, 2009)
If you found this post helpful, please donate by clicking an ad.
No related posts.
If you enjoyed this article, please consider sharing it!
Great site of bookmarlets and resources. How do you manage to make use of all these? Dragging these to my browser (chrome) would be kinda crazy..I just keep a few that I really do use often..it would be great if there was personal bookmarklet homepage for people.
Thanks. I’ve collected these over the years, so I understand if it’s a bit daunting. I keep them organized in folders. I just like to have them handy incase I need them.
[...] Here’s a really nice roundup of a ton of bookmarklets floating around out there. [...]