How to Email a Complete Web Page From Any Browser

Email is still one of the most convenient ways to quickly share links to friends and colleagues. Unfortunately, there are two major problems. First many people’s browsers are not configured to work correctly with their email client, especially for webmail. Second, many browsers only support emailing a link to the web page and not the entire web page. Furthermore, native support to email links is inconsistent and often formatted in a way that may break links for the recipient. I my Messaging News article a Better Way to Share Links in Email described these problems as well as a solution based on the free Readability bookmarklet that should work in nearly any browser and typically produces better results.

Native Options

This article looks at your options for emailing full web pages from nearly any browser. Unfortunately, there are few native options for emailing full web pages. If your primary email client is Outlook 2007 you can select to View -> Toolbars -> Web then open your web page in the built-in browser and finally select “Send Webpage by Email” from the Actions menu. In Internet Explorer version 6 and higher you can click on the “Send Page by Email” button. If you use both Apple Mail and the Safari browser you can select the “Mail Contents of This Page” from the File menu.


The next most simple option is to use the EmailTheWeb service, The service requires that you sign in with Google Account and uses your Gmail account to send out the message. The service is free for up to 25 messages a day. Email the web will also archive your pages for a limited time and mirror the original web page for the recipient in cases where the HTML was too difficult for the application to send correctly. Paid plans range from $20 to $80 a year. Paid plans include longer archiving and mirroring periods. You can use the service by entering your URL on the web site, with a browser bookmarklet, as a Google Toolbar button in IE, or as a Firefox extension.

Limitations of Email Web Pages

All of the above methods of email a full HTML page have limitations. In particular, complex HTML pages will likely look different to the recipient as the application sending the web page may modify contents when sending and the recipient’s email client may further modify the page when rendering it. Web mail clients typically have strict limitation on style sheets in email and many block images by default. The Campaign Monitor Guide to CSS support in email clients is an excellent overview of the limitations. Campaign Monitor has more details on other aspects of HTML in email in their resources on designing and building emails. In some cases it is possible to simply copy and paste the entire email message, but the results are typically far from satisfactory, especially since the style sheet is often not copied along with the HTML. Some pages have a print link that produces a simplified version that works better with cut and paste.

Readability Offers a Better Solution

In general I recommend that people first use the Readability bookmarklet to clean up the page and send the new version via email. Unmodified web pages will often not look like the original and may in fact be far less readable if an essential element is modified or removed. I regularly see pages that have text which becomes mashed together, hidden beneath images, and is otherwise unreadable. The page may also contain many unnecessarily elements such as page navigation and embedded items such as Flash that will not typically arrive correctly. Web pages that processed by Readability often fare much better.

Readability is an excellent tool from Arc90, that reformats web pages, strips out extraneous elements/ads, turns the text into a single column, and generally improves the typography. I find it makes nearly any web page significantly easier and more pleasant to read. I find several advantages to forwarding pages processed by readability. First, Readability inserts a reload button into each page so the recipient only needs to click on the button to see the original in the browser. Second, Readability includes a print link with a stylesheet customized for printing. Third, the pages greatly simplified, easier to read, and have less HTML for any email client to screw up. From all reports, it is also very helpful for people with limited vision as it increases accessibility. Pages processed with Readability make it far easier for recipients with mobile phones to read the content and typically load faster. I tested reading emailed pages on both iPhone and Android devices. Finally, since you are mailing the entire page to the recipient the well be able to read it offline.

To use Readability, just drag the bookmarklet to your toolbar and click on the bookmarklet for any page you want to improve. Readability offers a selection of fonts including two licensed from TypeKit, options to change the size of the text, modify the width of the margins, and optionally convert all links to footnotes. You can find more information about readability in the Arc90 blog posts Introducing: Readability 1.5 and Readability Updated: An End To The Yank Of The Hyperlink. Finally, the most recent update to Readability includes the long-awaited feature to automatically stitch together multi-page articles, which is a feature that none of the native clients offer. The service is free and the Readability source code is available under the Apache license. For users of Safari 5 on the Mac, Safari Reader is based on Readability and offers much of the same functionality, but does not have any customization options. The “Mail the Contents of This Page” option works from Safari Reader.

There are a few limitations, first Readability will not work on every web page. It is specifically designed for longer articles and does not fare well on complex home pages. Second, the process adds an extra step, which is decidedly less convenient. Finally, in testing I found that ad blockers caused Readability to over block images in some cases. In cases where Readability fails, I find that the Instapaper Mobilizer service is a good alternative, but it is not designed for high volume use.

A Better Way to Share Links in Email

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*/,''),
        return str.slice(0,i+1);

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.”