Joe Maller: Translation Bookmarklets (Favelets)

Translate a web page with one click, plus an explanation of how these bookmarklets work

This page contains several bookmarklet translation tools. With these in your toolbar, any web page can be translated in one click.

So far I've created two sets, one for Google and one for AltaVista. I suggest creating a toolbar folder and dragging the translation links you want directly into the toolbar folder.

Google Altavista
French to English (Google) French to English (Altavista)
Spanish to English (Google) Spanish to English (Altavista)
German to English (Google) German to English (Altavista)
Italian to English (Google) Italian to English (Altavista)
Portuguese to English (Google) Portuguese to English (Altavista)
English to French (Google) English to French (Altavista)
English to Spanish (Google) English to Spanish (Altavista)
English to German (Google) English to German (Altavista)
English to Italian (Google) English to Italian (Altavista)
English to Portuguese (Google) English to Portuguese (Altavista)

About Bookmarklets

The first bookmarklet I'd ever seen was Blogger's "link this" tool, which automatically built a complete URL for whatever page was being viewed. The purpose was to make it easier for Blogger users to link to other sites without having to learn HTML. It's incredibly convenient, and I used it constantly before building my own.

Recently, Paul Bausch of onfocus site wrote a bookmarklet to send whatever page was being viewed to the W3C validator. This not only got me to correct all the errors on my home page, it got me thinking about bookmarklets and what was possible. Ironically, Paul co-created Blogger, and probably wrote the Blogger bookmarklet.

Other Bookmarklets

After starting this page, I discovered many other sources of bookmarklets:

Steve Kangas runs bookmarklets.com, referred to by another site to him as the grandfather of bookmarklets. The site has over which is a clearinghouse of bookmarklets, with over 150 avaialbel to download fro free. I alsomst stopped creating this page when I found these, but the translators didn't seem to be working so I kept on going.

Apparently Gazingus wrote a set of validation bookmarklets in March 2001, but the site seems kind of dead (or too fancy for it's own good), so I doubt onfocus knew about them. I'm sure someone's already made a set of translation bookmarklets as well, but I couldn't find them so I made my own.

JavaScript Bookmarklets

How they work

The key to these bookmarklets has little do with JavaScript and everything to do with dissecting the URL output of the translation services. These bookmarklets do not perform the actual translation, they just send the address of whatever page is being viewed to the Google or Altavista translation services.

Below is the Google URL to translate this page into spanish (should be all on one line):

http://translate.google.com/translate?u=
http%3A%2F%2Fwww.joemaller.com%2F
translation_bookmartlets.shtml&langpair=en%7Ces

These might seem confusing at first, because many of the characters have been escaped. %2F is a forward slash, %3A is a colon and %7C is a pipe. The main arguments break down like this:

URL: u=http://

Languages: langpair=en|es

The Altavista is very similar:

http://babel.altavista.com/urltrurl?lp=es_en&url=
http%3A//www.joemaller.com/translation_bookmarklets.shtml

URL: url=http://

Languages: lp=es_en

I haven't tried these with unescaped URLs yet so I don't know if all the funky ASCII codes are completely necessary.

Both Google and Altavista use a subset of the standard ISO 639-1 two-letter language codes which made it easier to build new bookmarklets. At the time I wrote this Altavista offered more translation options, but Google is still beta testing their translation services and will probably catch up sooner or later. These are the language codes used by Google and Altavista:

Language Google Babelfish
English en en
Spanish es es
French fr fr
German de de
Italian it it
Japanese -- ja
Russian -- ru
Korean -- ko
Chinese -- zh
Portuguese pt pt

Browser Stuff

I've never liked it when popup windows force a configuration on the user, but now I think I understand why they do. There doesn't seem to be any working means of detecting the user's browser configuration, so duplicating these features is impossible. The next best thing is to pop open a plain window and keep it clean. I have some ideas about how this might be able to work, I hope to try them out soon.

Altavista bookmarklets show the page in a window with no branding information for Altavista. I would rather they did show where they came from, but since they show their results in a frame and the top page URL doesn't contain the tranlation string, my solution was to use the URL from the bottom frame.

This page is a mess

This page was thrown together in a few hours, and is definitely incomplete. A shambles in fact. I know this and I will fix it someday. The bookmarklets work and that's why I posted it as is rather than sitting on them until I get a chance to flesh out the whole thing. When I get time, I plan to add all translation options for Google and AltaVista, as well as a more complete listing of other bookmarklets and JavaScript explanations.

What happened to Babelfish?

Babelfish was the original name for Altavista's translation engine, however it seems to be the name of an independent consulting company.

Free Online Translation Services

Other Bookmarklets

After creating the translation bookmarklets, I had ideas for several others. These will eventually get their own pages, but for now here they are with not much explanation:

GoogleText! (Searches Google with selected text, kind of an interesting way to browse when bored.)

URL check (URL reassembly test...)

The following two HTML link generating bookmarklets will do some encoding of the URL for better page validation and compatibility. If text is selected on the page, that text will be used as the link text. If no text is selected, the page's title will be used.

LinkHere! (links target current window/frame) *

LinkThere! (links open in a new window/frame) *

* These now work with Safari and Explorer

Two at a time?

I think this will work, I'll clean up the window placement later...

French to English (Both)

Other useful Bookmarklets:

Sam-I-Am: Work: Bookmarklets

Accessibility-checking favelets

page last modified: