Top Web Annotation and Markup Tools

Ever try browsing the web and came across some content that you wanted to save for later reference? Yes you can easily bookmark a site, but wouldn’t it be awesome if you can select and save the specific text in the content that interests you? You are at a page where you want to leave a comment or note but u can’t because the page does not provide a comment system, what do you do about it? Better example, what do you use when you are working on a document or website of your own and wanting to get feedback from users or collaborate with a friend or group?
web annotation tools
Annotation tools allows you to discuss, exchange ideas or even brainstormwith your colleagues and peers efficiently in shortest time possible. It creates a new level of convenience to communicate if done right. Our huge list of web annotation tools should be able to provide the solution that can be use to accomplish each of the tasks above and many more! Full list after jump.

A.nnotate

A.nnotate is an annotation and collaboration tool that can be use for documents (PDF and Microsoft Office), web pages and images. A.nnotate makes it easy to work in a group-like fashion on single items. What it does is take a snapshot of your document, web page or image and then create a read-only copy. You can then write notes on that copy and share it with whomever you like. They offer hosting solutions for individuals and small groups as well as larger groups. A free account lets you annotate 30 items per month; any amounts larger will require a paid account.

Awesome Highlighter

With this tool you can highlight text on any web page and then get a short URL for your highlighted text, so that you can share it with others. You can also copy the selected text to the clipboard, email it or share it on Twitter, Delicious, Facebook or WordPress. When it comes to highlighting, there is a 2000 character limit per each selection. You can also add text notes to web pages. There are three ways to activate awesome highlighter: by entering the URL into the official website, using the bookmarklet, or using the Firefox Add-on.

Blerp

Blerp is great for starting and participating in conversations right on top of any web page. Since there is no registering required to get started, virtually anyone can join the conversation. You can post things like comments, videos and photos on any web page. Blerp offers social integration with Facebook and Twitter; you can sign in with each account and have your Blerps appear in your timelines. Currently there is an IE Plugin and Firefox Add-on that you can use. You can also add your Blerps to your blog or any website via a widget.

Bounce

Bounce is simple: click on any web page and drag your mouse to create notes. It’s great for writing thoughts and feedback or collaborating with a small group. The notes that you add will be label with your name and you can even share your notes on Facebook and Twitter. Simply enter the URL of the page you want to annotate on the Bounce website and then it will grab a screenshot; your screenshots can also be send to Notable (if you have an existing account).

Crocodoc

Crocodoc is the ultimate annotation tool for document collaboration. You can highlight, strikeout text, add comments and perform other types of revisions on PDF files, Microsoft Word documents, images and many more. All files are stored on Crocodoc’s secure servers and you can even password protect and encrypt them for added security. Each document is given a unique URL so that you can share it with others. Best of all, you can do all of this without registering; yet an account allows you to keep track of the documents that you have uploaded for future reference.

Diigo

Most people are familiar with Diigo and the Diigolet, which lets you highlight, comment and add sticky notes to any web page. Highlights and notes are automatically saved to your Diigo library. You can also choose to view notes from other users as well and add comments to their notes. Notes can be public or private, just like items that are saved to your Diigo library.

Draw Here

The title of this tool says it all; Draw Here lets you draw on top of any web page while browsing via a bookmarklet. If you choose to save your drawings, then other Draw Here users will be able to see them when visiting that page. This tool is currently only supported in Firefox and IE. Draw Here is a great way to show your talent, draw comments on web pages or just doodle out of pure boredom.

FloatNotes

This Firefox Add-on lets you add notes, comments, links and images to web pages. You can also apply basic formatting to your notes with "Markdown syntax." If the notes get in the way, you can minimize them. A small FloatNotes indicator lets you know how many notes are below or above the current view of the page. You can then jump directly to any note on the page. Another great feature is that you can specify whether you want a note to appear on just one page of a site or all of the subpages as well.

Google Sidewiki

You probably have heard of or are familiar with Google Sidewiki. This browser tool lets you add comments and read other user comments about any web page. Sidewiki is available on the Google Toolbar for Firefox and IE, and as an extension in Chrome. A nice feature of this tool is that you can share your entries directly on Blogger, Facebook, Twitter and your Google Profile. You can also see how many comments are on a page by a small badge that appears on the tool’s icon.

iComment

With a single button you can start and participate in conversations on any web page. You can post public or private comments right on the page and see what others are saying. You can also search through comments on a site. One interesting thing about iComment is that you can win prizes just by using the tool. For every 10 comments that you post, you could just win a $25 Amazon gift card. iComment is optimized to work with Windows Vista and IE 8, though you can also get the browser toolbar for Firefox.

Internote

This simple Firefox Add-on is great for adding notes to any web page and customizing your note with background and text; notes can have a modern, glassy, classical or flat look to them. All customizations are done using the flipside of the note. As many of the tools mentioned will not work on special sites like Gmail, Internote is one that will work with Gmail. You can use the note manager to edit, print and delete notes as needed.

Layers

With a name similar to Layerpad, Layers goes a step further by letting you add sticky notes, tweets, maps, videos and images on top of web pages. You can then share your layers across your social networks. It’s also great for posting tweets longer than 140 characters, since there is no limit. Comments can be public or private and you can invite others to participate in your conversations. Notes can be dragged, dropped and moved around, as you like. Along with the Firefox Add-on, there’s also a Chrome extension and bookmarklet that can be used on most other browsers.

MyStickies

If you love sticky notes, then MyStickies is for you. It "allows you to place little yellow squares of digital paper anywhere and everywhere you feel like in the whole wide web." You can browse, search, sort and edit an unlimited number of notes using the mighty user account interface. The fun doesn’t stop there; you can add tags to your notes and organize them for easy reference. There is only an Add-on for Firefox, but you can use the bookmarklet for all other browsers.

Notable

Notable is geared toward teams who are working on websites together and need to provide feedback on designs, content and HTML/CSS code. There are four ways to capture a website for collaboration: a Firefox Add-on, uploading an image to the Notable site, typing in the URL on the Notable site or capturing the site on an iPhone or iPod Touch. You can set permissions and limit your content to only the people you choose. A nice addition is the ability to send email alerts to others on your team in order to request feedback.

Note Anywhere

An extension exclusively for Chrome, Note Anywhere lets you make notes anywhere on the web. You can drag and drop your notes to move them around. Notes get saved in real-time, so there is no need to worry if the page or browser is closed unexpectedly. There is also a badge on the browser icon that will let you know the number of notes on a page (kind of like Google Sidewiki mentioned above). A great feature included in Note Anywhere is the ability to change the style of your notes and also the notes summary feature.

QuickFox Notes

Yet another Firefox Add-on, QuickFox Notes is a is "a multi-tab note taking add-on for Firefox that uses the integrated bookmarks system or a single SQLite database to store notes." It works great with synchronization tools like XMarks, Dropbox and SugarSync. What it does is synchronize your notes via those tools so that you can access them across various computers and mobile devices. QuickFox Note includes some great features like search, spell check, customization options (font size, background colors), note printing, sharing by email, archiving and much more. There is an iPhone app called Simplenote that you can use to import and export notes from QuickFox Notes. FYI: Simplenote will replace the native Notes app.

Reframe It

With Reframe It you can comment (publicly or privately) on any web page via the sidebar and reply to others. You can also highlight text on any page, add your own comment or note and then post it. Comments can be shared across social networks like Facebook, Twitter, Blogger, FriendFeed as well as via Email. There are a lot of features included like the ability to add friends, keep up with RSS feeds, and join groups. It’s almost as if it creates a social network within every website. Updates are displayed in real-time so that you won’t miss a thing. Reframe It stays closed on the page until you click on the tab (on the side of the window) to open it. A badge with the number of comments on the page is also displayed on the tab.

ShiftSpace

Lastly we have ShiftSpace, an open source Firefox Add-on for group annotation and collaboration. This tool is a very unique concept. They offer a set of tools that you can use to annotate, edit, and "shift" the content of a page. As explained on the site, "by pressing the shift and space keys, a ShiftSpace user can invoke a new meta layer above any web page to browse and create additional interpretations, contextualizations and interventions – which [they] call Shifts. Users can choose between several authoring tools we’re working to develop – which we call Spaces." The tools they currently offer are Notes (add post-it notes), Highlights (highlight web text), ImageSwap (grab any image on the web and swap it with another image of choice) and SourceShift (edit the HTML of a web page). More spaces are currently in development.

Honorable Mentions

As if this list wasn’t long enough, I wanted to point out a few others that didn’t quite make the list, but might interest you.
  • Marginize – See what others are saying on Twitter, Facebook and Google Buzz about any web page. Add your own updates to the mix.
  • Stickis – Write sticky notes on any web page and see what others are saying about a site.
  • The Commentor – Leave feedback on others’ images and documents and get feedback on your own content from the people you choose.
  • Trailfire – "A collection of web pages, assembled and annotated by any Trailfire member, on just about anything under the sun."
  • Twiddla – An online whiteboard for groups that want to brainstorm together. You can annotate websites, graphics and images all while browsing the web together.
  • WebNotes – Highlight text and add notes anywhere on a web page. Organize your notes with tags and within folders.
  • Wired Marker – A permanent highlighter for the web. Highlighted text is saved as bookmarks and can be organized into folders.
  • Yawas – An annotation tool for Firefox and Chrome that lets you highlight text and store it in Google Bookmarks.
With all the choices out there, what is your favorite web annotation tool?