Why I love Readability, with screenshots

add-ons, Design & Usability, Firefox, Innovation, Productivity, Reading, Web, Work 5 Comments

Readability is a Firefox add-on that improves the experience of reading long articles in your browser by getting all the extraneous cruft out of the way. I use it every single day and love it to bits.

Here, for example, is a screenshot of what a typical Harvard Business Review article looks like in Firefox (Persona: Save the Bees Plz by monorail cat):

Old Crufty
before-readability

With the Readability add-on installed, all I have to do is hit a quick keyboard shortcut (alt-cmd-R) and the page will reload and be reformatted by Readability. It looks like this:

New Clean
after-readability

It’s just so, so much better. arc90, you have made a great thing. Thanks :)

Firefox 3.6: Spacer trick for prettier Personas

Browsers, Firefox, Work 1 Comment

So you’ve upgraded to Firefox 3.6 and are completely enthralled by the pretty themes available through GetPersonas.com. If you’re like me, you’re going slightly crazy because there just doesn’t seem to be enough space to really show the Personas properly.

Luckily Rob taught me a trick to open up some space in my Firefox toolbar. Just right-click in the space beside your search bar, select Customize…, then add some “Spacers” where you want some extra space. Here’s a step by step guide, using the Two Little Birds persona:

1. Sad birdies, search bar in the way.

fx36-toolbar

2. Right click beside the search bar and select Customize…

fx36-customize

3. Open up the Customize menu…

fx36-customize-menu

4. Add some spacers, and remove some buttons to free up space…

fx36-spacers

5. Ta dah! No more sad birdies.

fx36-birdies

Feedly – Awesome feed reader add-on for Firefox

add-ons, Firefox, Innovation, Internet, Web, Work 2 Comments

I read a lot of web feeds. Hundreds of feeds bring me thousands of stories on all manner of topics every day — Mozilla stuff, food and cooking, photography, gaming, news, technology, literature, writing, politics, business, innovation, design, etc. Feeds are how I get almost all of my news, whether it be local, national, or international. It’s how I view my friends’ blogs and my Flickr contacts’ photo streams. Feeds keep me up to date on most forums and newsgroups I follow, and they’re the first place I turn when I want to waste some time catching up on my entertainment news or to see what’s up at the renovation/interior design blogs I read. Feeds are, by and large, how I access the vast majority of the Web content I consume.

Until a few days ago I have been using the Vienna feed reader for Mac OS X. It’s a pretty decent workhorse of a reader with a standard email-client-like user interface, the ability to group feeds into folders and subfolders (and sub-subfolders), and all that. It has always frustrated me, however, that my feedreader — through which I consume the majority of my Web content — wasn’t part of Firefox. In fact, I could go so far as to say that Vienna was on close to equal footing to Firefox as my core tool for accessing the Web. This has always struck me as somewhat ridiculous, so I’ve played with all sorts of tools for reading feeds via Firefox, whether they be add-ons or web-applications or what have you. None have ever been compelling enough to switch me away from Vienna until now.

Feedly Screencap

I’ve discovered Feedly, you see, an incredibly slick Firefox 3 add-on that’s been in development for quite some time.

While I’ve only been using Feedly for just over a week now, it has already completely streamlined how I manage, view, and deal with my feeds. Brilliantly, Feedly leverages the existing Google Reader web application as its back end, and throws in added functionality, other service integration points, and a significantly improved UI for good measure. It installs as quickly and easily as any Firefox add-on, displays your feeds in their own tab, and essentially integrates your entire feed reading experience right into your Firefox. Feedly is almost exactly the sort of tool I was hoping to find, and while it does still have a few bugs and rough edges, it’s by far the best feed reader I’ve used to date.

Check it out: Feedly at Mozilla Add-ons.

More translations of the Field Guide to Firefox 3

Browsers, Firefox, Mozilla, Work 5 Comments

The Field Guide to Firefox 3 has now been translated into 6 languages: Simplified Chinese, Traditional Chinese, Argentinian Spanish, French, Japanese, and Korean. A million thank-yous to everyone who has helped out with these so far! Here are the links:

If you’re interested in translating the Field Guide into other languages, see this post. After you have finished and posted your translation somewhere, post a note here and I’ll add a link to the English version of the Field Guide.

Firefox 3′s first 24 hours

Firefox, Mozilla, Work 4 Comments

John Lilly, Mozilla’s CEO, has written a quick blog post about the first 24 hours of the Firefox 3 launch. Mike Schroepfer, Mozilla’s VP of Engineering, has gone a step further and also blogged about What’s next after Firefox 3. There are about a zillion other posts as well, most of which you can find on Planet Mozilla.

In the end, it was an amazing, amazing, amazing day. I’m really happy that I was finally able to be at HQ for a release (I usually work from home in Canadia). It’s been a crazy couple of days and everyone’s super thrilled that it’s all gone so well. Also slightly exhausted.

The final 24hr download numbers looked something like this:

8320331

There are pictures from the release all over flickr: here are some from Mountain View, more from Mountain View, Portland, Toronto, and more from Toronto, and who knows how many others. There’s even a picture of the cake the IE team sent to us at Mozilla Headquarters. Check the ff3downloadday tag — there may be more coming!

I have the privilege of working daily with some pretty crazy awesome people. If you love Firefox, and if you love the idea of preserving and promoting choice and innovation on the internet, you should join us. It’s an awful lot of fun.

8,000,000

Firefox, Mozilla, Work 5 Comments

Eight million downloads of Firefox 3 in under 24 hours. Holy crap.

8000000

Firefox 3 is now available for download

Browsers, Firefox, Mozilla, Work 2 Comments

Go get it. Help us celebrate.

This is gonna be a crazy awesome day.

French translation of the Field Guide to Firefox 3

Browsers, Firefox, Mozilla, Work 8 Comments

Alex left a comment on an earlier post to let me know that he’s translated the Field Guide to Firefox 3 into French. You can find it here: Petit guide de Firefox 3. Thanks for doing this, Alex!

First translation of the Field Guide to Firefox 3!

Firefox, Mozilla, Work 12 Comments

One of the coolest things about being part of the Mozilla community is…well…being part of the Mozilla community. Yesterday I was contacted and asked by the folks at xbeta.info if it would be ok to translate and re-post the Field Guide to Firefox 3. Of course I jumped at the chance and said yes. Here’s the result:

[精品译文] Firefox 3 新功能指南 (v1.53)

To further encourage this sort of awesomeness, and to make it easier for anyone else who would like to translate the Field Guide, I’ve now licensed the Field Guide text and screenshots under the Creative Commons Attribution-Share Alike 3.0 license.

Creative Commons License
Creative Commons Attribution-Share Alike 3.0 License

If you do translate it, please send me a link when it’s ready! I’ll add links to other languages to the English version of the Guide.

Field Guide to Firefox 3

Browsers, Firefox, Mozilla, Work 69 Comments
Translations
* Firefox 3 新功能指南 (simplified)
* Firefox 3新功能指南 (traditional)
* Petit guide de Firefox 3
* Guía de campo para Firefox 3
* Firefox3新機能ガイド
* 모질라 파이어폭스 3 에 대한 필드 가이드
* Firefox 3:n uudet ominaisuudet

FieldGuideToFirefox3sm


We’re done. Firefox 3 is going to be launched very soon. In anticipation of this long-awaited event, the folks in the Mozilla community have been writing extensively about the new and improved features you’ll see in the browser. The new features cover the full range from huge and game-changing to ones so subtle you may not notice them until you realize that using Firefox is just somehow easier and better. The range of improved features is similar — whole back-end systems have been rebuilt from scratch, while other features have been tweaked slightly or redesigned in small ways. Overall the result is the fastest, safest, slimmest, and easiest to use version of Firefox yet. We hope you like it.

Here’s a list of the features covered in this Guide.

Add-on manager

addon-manager

In Firefox 3 the Add-on manager has been expanded to include a new “Get Add-ons” tab where you can view Recommended add-ons, search for new add-ons, see add-on descriptions and ratings, and install add-ons with a simple click. The Add-ons manager is now fully integrated with the addons.mozilla.org (AMO) website, making it easier than ever to find and experiment with new browser extensions and themes.

For more, see Get Add-ons in Firefox 3 by Madhava Enros.

Bookmarks

bookmarks2

Firefox 3 introduces a set of new features to bookmarks that make them much easier to use, more useful in general, and much more useful for the terminally disorganized. The three main features being introduced are Bookmark Stars, Bookmark Tags, and Smart Bookmark Folders.

Bookmark Stars are a quick and easy way to bookmark a page with a single click. Bookmark Tags are a way to add “extra” information to a bookmark, allowing you to organize them in a much more flexible manner than old-style Folders would allow. Smart Bookmark Folders are “saved searches” that automatically update when you add new items matching that search to your bookmarks.

For more, see Firefox 3: Bookmarks by Deb Richardson.

Cascading Style Sheets (CSS)

css

A large number of CSS improvements have been made for Firefox 3, including support for: inline-block and inline-table, font-size-adjust on all platforms, the :default pseudo-class, HTML soft hyphens (­), the ime-mode property, white-space‘s pre-wrap value, and dynamic updating for selectors like :first-child, :only-child, :last-child, and :empty. The Mozilla Developer Center has a full list of and documentation for all the CSS changes in Firefox 3, which you can find here: CSS improvements in Firefox 3.

For more, see Some new CSS features in Firefox 3 by David Baron.

Color profile support

color-profile

Firefox 2 does not include support for color profiles, so the browser renders colors as best it can without doing special tweaks based on your system or custom color profiles. Firefox 3 does include full support for color profiles, allowing for a richer and more vibrant range of colors to be displayed in the browser. For a variety of reasons, however, color profile support is turned off by default and must be enabled through your custom browser preferences. It is likely that a future version of Firefox will see this feature enabled by default, which will be a happy day for photographers and visual artists everywhere.

For more, see Firefox 3: Color profile support by Deb Richardson.

Download manager

download-manager

The Download manager has changed quite a bit for Firefox 3, and now includes the oft-requested ability to pause and resume downloads, both manually and automatically. Other changes include the addition of a download status indicator to the bottom status bar, the ability to search through downloaded files in the manager, an enhanced file display that includes more detailed file information, and the ability to revisit the original download page by right clicking on the file in the Download manager.

For more, see Download Manager in Firefox 3 by Madhava Enros.

Font and text rendering

fonts-and-text

When Mozilla developers decided to incorporate the Cairo subsystem and build a new graphics layer from scratch, they also decided to completely rework the system that renders text in the browser. The result is that Firefox 3 has improved support for font kerning, ligatures, international text, partial ligatures, font hinting, anti-aliasing, font types, and font selection. Firefox 3 represents a huge step forward in font support and text rendering, and Mozilla developers are already working on further enhancements for future releases.

For more, see Firefox 3: Fonts and text by Stuart Parmenter and Deb Richardson.

Full page zoom

full-page-zoom

Page zoom has been completely reworked for Firefox 3 and now includes both full page and text only zoom.

Full page zoom scales the page layout and structure while allowing you complete control over the size of the displayed content. Text only zoom, on the other hand, only zooms the text on a page, leaving the images and page layout untouched.

A new and extremely useful feature of page zoom is that Firefox now automatically remembers the zoom level you set on a per-site basis. Once you zoom in to (or out of) a page on a site, Firefox will remember and restore that zoom level the next time you visit any page that is part of that site.

For more, see Full Page Zoom by Seth Bindernagel.

History

history

Firefox 3 has made browser history astonishingly useful. Not only is History a key source of information for the new Smart Location Bar, it has been improved in several other ways. History now stores sites’ favicons (small, identifying graphics) along with the other location data to make scanning and identifying history entries much easier. The History Sidebar and History Menu have been tweaked as well, and a whole new History Library has been added to the Firefox Library (formerly the Bookmark Organizer). Overall, Firefox 3 has raised History from being occasionally useful to being an absolutely essential part of daily browser use.

For more, see Firefox 3: History by Deb Richardson.

HTML Canvas

html-canvas

Firefox 3′s HTML Canvas implementation has been improved and now includes an experimental text rendering API. This API is described in detail at the Drawing text using a canvas article at the Mozilla Developer Center (MDC). Also new is support for the transform() and setTransform() methods, which are documented as part of the MDC’s fantastic Canvas tutorial. Two-dimensional Canvas performance has also been improved and is faster on all platforms.

To see a couple of great canvas demos, check out John Resig’s Processing.js and Aza Raskin’s Algorithm Ink.

For more, see HTML Canvas in Firefox 3 by Vlad Vukićević.

Location bar UTF-8 support

location-bar

Those who mainly use the US-ASCII Web may not notice one of the big changes in the Firefox 3 location bar: UTF-8 multi-byte support. This is a very large usability win because non-ASCII language URIs were unreadable machine-code in Firefox 2, where now they are rendered in human readable fonts in Firefox 3.

For more, see Firefox 3: UTF-8 support in location bar by Gen Kenai.

Malware protection

malware

“Malware” is what we call web sites that try to install unwanted software or otherwise do unauthorized things to your computer. Firefox 3 keeps track of all reported malware sites, protecting you by blocking them before the pages even load, ensuring that your computer is never at risk. You can ignore the warnings if you want — it’s your browser, after all — but we’re hoping this added security will help protect users and make the Web safer for everyone.

For more, see Mal-what? Firefox 3 vs. Bad People by Johnathan Nightingale.

Microformats API

microformats

Microformats are a set of simple, open data formats that are built upon existing standards. Firefox 3 includes a new microformats API that can be used to build add-ons, but they are otherwise not currently exposed through the Firefox 3 user interface.

For more, see IBM’s new tutorial about how to use the new microformats API in Firefox 3 extensions, and Where are the microformats in Firefox 3? by Mike Kaply.

Offline web application support

offline

Firefox 3 implements online and offline events from the WHATWG Web Applications 1.0 specification. This means that web developers can create web applications that will work in Firefox even when the computer is offline. When in “offline mode”, a web application’s data is stored locally on your computer, which is then synchronized back to the server when that computer comes back online.

For more, see Online and offline events, Offline resources in Firefox, Firefox 3: Offline App Demo by Mark Finkle, Offline Web Applications (Feb 2007) by Robert O’Callahan.

Password manager

password-manager

In Firefox 3 the Password manager features are significantly improved and much more thoughtfully designed. The dialog box asking whether you would like Firefox to save a password has been replaced entirely — instead of popping up a dialog you are forced to dismiss before the login has succeeded, Firefox 3 presents the option to store a given password using an information bar that slides down from the top of the screen after you have logged in. This information bar is non-modal, so you can continue using the Web as normal without being forced to dismiss it first. The information bar will just hang around until you tell it what to do or leave the site you’re on.

Additionally, the Password manager has filtering and searching capabilities, making it significantly easier to find and manage passwords for particular sites. These changes are relatively subtle, but if you have hundreds of stored passwords, these small changes can make a huge difference over all.

For more, see Firefox 3: Password Management by Deb Richardson.

Performance improvements

performance

Firefox 3 is the fastest, slimmest version of Firefox yet. Speed tests are showing a 2-4x improvement over Firefox 2 and 9x over Internet Explorer 7. Memory usage tests measure that Firefox 3 is 2x more efficient than Firefox 2 and 4.7x more efficient than IE7. There’s been a tremendous focus on performance for this release, and an incredible amount of effort has gone in to achieving these numbers.

For more about the memory usage improvements, see Firefox 3 Memory Usage by Stuart Parmenter.

Phishing protection

phishing

In addition to the new Malware protection that has been added for this release, Firefox 3 also has improved Phishing protection. Reported phishing sites are now blocked up front, before the pages are even loaded, so your computer is never in danger. Firefox 2 loaded the page, but warned you that it was a reported phishing site by greying it out and displaying a warning dialog. Firefox 3′s method, which matches the new Malware protection behaviour, is more secure and exposes you to less risk over all.

For more, see Mal-what? Firefox 3 vs. Bad People by Johnathan Nightingale.

Plugins

plugins

Plugins are small third-party programs that can be added to Firefox to manage content that Firefox does not handle itself. Without the Flash plugin, for example, you wouldn’t be able to watch YouTube videos. Firefox 3 offers a new feature as part of the revamped Add-ons manager which you can use to view, enable, and disable any plugins you have installed. You can also use the Plugins display to visit the original source of the plugin (if it is specified) by right-clicking on the plugin name and selecting “Visit Home Page”.

Also, as with other add-ons in Firefox 3, if a plugin is found to contain a security vulnerability, Firefox will automatically disable it and tell you where to get an updated version. This is a significant security improvement for Firefox, which previously had no way to let you know that you had bad plugins installed.

For more, see Firefox 3: Plugins by Deb Richardson.

Site Identification button

site-identification-button

Ensuring that users are safe, secure, and protected while they browse the Web is one of the greatest challenges facing browser makers. Firefox 3 introduces an extremely important new security feature known as the Site Identification button. This button replaces and builds upon the ubiquitous “padlock” icon that has for so long been the primary security indicator used in browsers. Rather than just displaying a little padlock somewhere, Firefox 3 finds out as much as it can about the site you’re browsing and makes that information easily accessible through a button at the left end of the location bar.

larry

The button can be one of three colors — gray, blue, or green — and displays the new Site Identification dialog when clicked. The dialog includes a matching gray, blue, or green “Passport Officer” icon, and shows a summary of the information available about the site’s identity. Now, instead of having a single indicator that a connection is either encrypted or not (the padlock), Firefox 3 provides you with much more information, covering a wide range of different security levels and situations.

For more, see Firefox 3: Site Identification button by Deb Richardson.

Smart Location Bar

smart-location-bar

In Firefox 3 the Location bar has been completely revamped in extremely exciting ways. Affectionately nicknamed the “AwesomeBar”, the new Smart Location Bar lets you use the URL field of your browser to do a keyword search of your history and bookmarks. You no longer have to remember the domain of the page you’re looking for — the Smart Location Bar will match what you’re typing (even multiple words!) against the URLs, page titles, and tags in your bookmarks and history, returning results sorted according to an algorithm that combines frequency and recency.

The Smart Location Bar results also show pages’ favicons, full titles, URLs, and whether you have bookmarked or tagged the site previously. While the change from Firefox 2 to Firefox 3 can be a little jarring for some, once you’ve used the Smart Location Bar for a while, you’ll wonder how you ever lived without it.

For more, see AwesomeBar is awesome by Deb Richardson, and this short screencast by Mike Beltzner.

Tabs

tabs

Tabs haven’t changed a whole lot between Firefox 2 and Firefox 3 except for the addition of new smooth scrolling animation. When you scrolled your tab bar in Firefox 2, the tabs moved back and forth a full tab at a time. This made scrolling a bit choppy and disjointed. With smooth tab scrolling, it’s much easier to understand how the movement is happening, and where tabs are moving to and from. This is most clearly demonstrated with a demo movie, so I created a quick one which you can see here: Firefox 3: Smooth tab scrolling (.swf).

Themes

themes

One of the primary goals of the Firefox 3 visual refresh was to better integrate the browser with each computer platform while maintaining a unique visual identity and presence. Firefox 2 looked more or less the same on Windows, Mac, and Linux, but this is not the case for Firefox 3. There are four distinct new themes for Firefox 3 — one each for Linux, Mac OS X, Windows XP, and Windows Vista — and it touches every aspect of the application. Every button, window, tab, icon, and dialog box now blends in with the native platform, making Firefox feel much more like a natural part of your computing environment.

For more, see Firefox 3 Themes by Alex Faaborg, and Firefox 3 for theme developers by Gavin Sharp.

Video and audio feeds

detecting-feeds

Firefox 3 includes an enhanced feed preview page that now detects and displays enclosures alongside the associated blog entries. Additionally, Firefox 3 has the ability to associate video podcasts with one application, audio podcasts with another, and all other kinds of feeds with a third. These modifications are relatively subtle but fantastically useful once you start taking advantage of them.

For more, see Firefox 3 and enclosures by Will Guaraldi.

Vista parental controls support

vista-parental-controls

Windows Vista includes built in parental controls that help you manage what your children can do on the computer. Firefox 3 includes some support for these parental controls — the Download manager is aware of situations where content gets blocked by proxies, and blocked downloads now display the correct UI message to indicate what has happened. This feature is only available for the Vista platform, and will be expanding and improving in future versions of Firefox.

For more, see Firefox 3: Parental controls by Jim Mathies and Mark Finkle.

Web application protocol handlers

web-application

Web application protocol handlers are a new Firefox 3 feature that gives more power to web applications. When you click on a link with a specific protocol, Firefox can now send that link data to a specified web application, if that web application has added support for this feature. For example, “mailto:” links can now be handled by a web application such as Yahoo! mail instead of by the default mail client on your desktop. Other currently supported protocols include “webcal:”, “tel:”, and “fax:”.

Developers who are interested in adding protocol support to web applications should read the Web-based protocol handlers article at the Mozilla Developer Center.

For more, see Firefox 3: Web protocol handlers by Mark Finkle.

Conclusion

There you have it, a broad (but by no means complete) swath of the new and improved features in Firefox 3 from Add-on management through Web application protocol handlers. Almost every part of the browser has been improved in some way.

Firefox 3 has been in development for roughly three years, all told, and has been contributed to by thousands of developers, designers, localizers, testers, marketers, and documentation writers around the globe. The Firefox browser is produced by one of the greatest open source communities in the world, and we’re all extremely proud of it and excited to finally get it into the hands of millions of people.

If you haven’t yet, you should go to the Firefox Download Day site and help set a new Guinness World Record. Once you’re done there, head over to Mozilla Party Central and find or set up an event to take part in. We hope you’ll all join us and help celebrate the release of the best Firefox ever.



Creative Commons License
Text and screenshots are licensed under a Creative Commons Attribution-Share Alike 3.0 United States License.

Icons by N.Design Studio. Designed By Ben Swift. Powered by WordPress and Free WordPress Themes
Entries RSS Comments RSS Log in