I regularly share links with friends and colleagues. I use several social bookmarking services, but the vast majority I share via email. Firefox, Safari, and Internet Explorer have a function to create a new message with an email link. The main disadvantage of sending links using the built-in browser methods is that the links they generate are prone to breaking unless the whole message is converted to HTML rather than plain text.

I prefer a bookmarklet for emailing links. Bookmarklets are bits of JavaScript saved into a bookmark that act like simple browser plugins. BetterExplained’s How To Make a Bookmarklet For Your Web Application is an excellent introduction. Opera and Google Chrome browsers do not currently offer functionality for emailing a link, so a bookmarklet is your only option. My version of the bookmarklet has a few improvements over the built-in browser methods, extensions, and other similar bookmarklets I’ve seen. Previously, I constantly made minor adjustments when emailing URLs to reduce the chances that the link would work correctly for the recipient. The new version of the bookmarklet has improved my workflow for sharing links.

The bookmarklet:

    javascript: function trim12(str)
    {
        var str=str.replace(/^ss*/,''),
            ws=/s/,
            i=str.length;
        while(ws.test(str.charAt(--i)));
        return str.slice(0,i+1);
    }
    location.href='mailto:?SUBJECT='+encodeURIComponent(trim12(document.title))
    +'&BODY='+encodeURIComponent(trim12(document.title))
    +encodeURIComponent('n<'+location.href+'>')

To use this bookmarklet yourself, simply drag the following link to the bookmark bar in your browser. [Email link]

The most common way that browsers implement the email a link feature is to create a new email message with the document title in the subject and the link in the body. Most email clients will recognize these links as URLs and turn them into clickable links that you can open in your browser. There are several problems with the built in methods for emailing links.

  • The first problem is that the algorithms that recognize the URLs do not always recognize valid URLs or may only partially recognize the URL leaving the recipient with a broken link. In these cases you have to copy the URL from your email client and paste it into your browser. Certainly not a difficult or time-consuming task, but every bit of additional effort reduces that chance that the recipient will click on the link
  • The second problem is that if a URL is long the email client may wrap the line with the URL. There are several ways that email clients wrap long lines and conflicts arise periodically between different email client line wrapping styles. When links with URLs are wrapped this creates additional complexity for the receiving email client to correctly parse the URL and increases the chance of failure. Dan’s Mail Format Site has a nice description of the URL wrapping issues in his Body: Line Length article.
  • The third problem is that some web pages include additional whitespace in the document title to visually offset the text. The extra whitespace is not desirable when mailing the link as it can make the title line less readable and add unwanted blank lines before the URL.

Safari, works around the first two problems by creating a rich text/HTML email message and turns the URL into a real hypertext link. Safari and Internet Explorer both have the option to email an entire webpage. In this case, the browser simply copies the HTML from the webpage into an email message. This method solves the problems of URLs being incorrectly recognized or poorly wrapped, as the recipient’s email client does not need to parse the text to discover the link. I generally avoid emailing entire web pages as most mail clients parse a very restrictive subset of HTML to reduce security vulnerabilities and the page formatting may not appear as intended.

Most bookmarklets I have seen to email a link mirror the built-in browser functionality and thus have the same problems. Bookmarklets often have an additional problem where ampersands and other meta characters are not properly escaped and may cause the bookmarklet to fail or truncate the titles.

My modified bookmarklet presented above includes the document title in subject and the document title, a carriage return, and the URL in the body. The URL is wrapped in angle brackets < >, which most allows the majority of email clients to correctly interpret complex and wrapped URLs. The World Wide Web Consortium (W3C) recommends this method in Wrappers for URIs in plain text as does RFC2396 Uniform Resource Identifiers (URI): Generic Syntax, the specification that defines the modern URL. Finally, I use the JavaScript function encodeURIComponent to protect page titles from ampersands and other characters breaking them. The n version of the escaped newline character must be used as opposed to %0A. In later revisions of my bookmarklet, I included trim12 from Steven Levithan’s Faster JavaScript Trim, which will trim excess whitespace from the document title so that the subject line is not surrounded by spaces and there are no blank lines before the URL.

The bookmarklet relies on the browser’s default mailto: handler to determine which email application should be used to creat the message with the link. Each browser and operating system has multiple ways to set the mailto: handler. Changing the default mailto: handler is generally straightforward for most desktop email clients, but can be more complicated for webmail clients such as Gmail and Yahoo! Mail. Here are a few options to start with. Changes in Firefox 3.5 greatly simplified the procedure for changing the e-mail program used by Firefox. The Affixa application is a simple way to change the mailto: handler for Windows users to set popular desktop clients, Gmail and Yahoo! Mail as the default handler. The Internet Options settings for Internet Explorer make it straightforward to change the default to desktop another application or Windows Live Hotmail. Clint Talbert’s page Click Testing for Protocol Handling is a quick and easy way to test if your mailto: handler is working correctly.

Updated August 2nd, 2009 to add trim code and including information on mailto: protocol handlers. Fixed problem with CMS HTML corrector breaking bookmarklet code.

* This article originally appeared as A Better Way to Share Links in Email in my Messaging News “On Message Column.”