All posts tagged ‘firefox’

File Under: Browsers

Mozilla Shows Off Powerful New Developer Tools for Firefox

A mockup of what it might look like to author your pages right inside Firefox. Image: Paul Rouget.

You asked for them and now Mozilla’s Firefox developer tools team is hard at work building a slew of new tools for web developers.

A few weeks back Mozilla’s Paul Rouget asked developers what they’d like to see in future versions of Firefox’s developer tools. The resulting thread on Hacker News is quite extensive and full of some great ideas that Rouget and others have been hacking on ever since.

The result is a bunch of new tools that are mostly still at the experimental mock-up stage, though a couple are available now in the Nightly Channel if you’d like to try them out.

The most popular request, and by far the coolest of the bunch, is the ability to do live edits in the text editor of your choice — effectively controlling Firefox with your editor. The video below shows an example of live editing via the popular Sublime Edit. This would essentially eliminate the need to jump from your editor to the browser, hit refresh, jump back to your editor, and so on. A dance that most of us are all too familiar with. Perhaps the best part, Rouget says this will work with the mobile version of Firefox as well.

Mozilla is also working on the opposite idea — authoring in the browser. That means putting an editor inside Firefox’s Dev Tools suite. Thus far this idea is less fleshed out, but the possibilities include putting in something like jsFiddle or perhaps a more traditional file-based editor.

Other new tools include some catch up features that bring Firefox’s Dev tools up to speed with what you’ll find in WebKit browsers. Examples include a new network panel prototype and the ability to doc the tools to the right side of the screen — great for wide monitors (this is already available in Nightly). There’s also a new “repaint” view that shows what gets repainted on the page, very useful if you’re trying to improve performance. Rouget has also been working on a new, dark theme for the Firefox dev tools.

Rouget recently added a font inspector panel (available in the Nightly Builds) that makes it easy to see which fonts a page is using, including details like whether or not the font file is local or served through a service like Typekit, as well as the actual @font-face code used.

In what appears to be an unrelated effort, Mozilla developer Dave Townsend has been hacking on Firefox’s Tilt View Tool. Tilt View offers a 3D look at a page that can be very helpful for visualizing the structure of your code and spotting bugs you might otherwise miss. Townsend has come up with a number of ways to extend Tilt, including showing only links and only elements that change on hover.

Townsend even suggests that in the future you might be able to pair Tilt with your site analytics to see which links are most frequently clicked. Unfortunately you’ll have to wait a while before these features are actually available in Firefox; Townsend’s hacks rely on some core Firefox features that aren’t ready for prime time just yet.

While many of these coming features are, as yet, only prototypes, things are clearly looking up for Firefox’s dev tools. For more details on everything that’s new, be sure to check out Rouget’s post, as well as the related Hacker News thread that Rouget has been posting to with some follow up info.

File Under: Browsers

Curvy, Chrome-Style Tabs Coming Soon to Firefox

So, so round. Image: Screenshot/Webmonkey.

Firefox’s tabs will soon sport a sleeker, rounded design.

The new design will likely arrive in the Nightly Channel in the next few days, but if you’d like to test it today, you can download the Firefox UX branch. Retina MacBook Pro users should note that, thus far, the new curvy tabs don’t support high-DPI screens.

The new curved tabs look like slightly over-sized, more rounded versions of the tabs Google Chrome has always used. Unlike Chrome, tabs in the background are nearly invisible.

The big question is why? Mozilla’s answer seems to be little more than “because we can”. On the plus side, the re-skinned tabs will bring a bit of a speed improvement thanks to new graphic elements and faster “paint” times.

For more details on the speed improvements see Firefox developer Mike Conley’s write up on the new curvy tabs.

File Under: Browsers

Firefox 20 Beta Brings Better Private Browsing

Firefox’s new per-window private browsing mode. Image: Screenshot/Webmonkey.

Firefox 20, currently six weeks away from a stable release, brings two nice new features to the popular open source browser — per-window private browsing and a new downloads manager.

If you don’t want to wait six weeks for the final version of Firefox 20, head on over to the Beta Channel download page and grab a pre-release copy today.

The per-window private browsing mode mirrors what you’ll find in Google’s Chrome browser and is, frankly, how it should have been all along. When you want to start a private browsing session in Firefox 20 you simply select the new “New Private Window” menu option. That will open a new window noting that Firefox will discard any history, search history, download history, web form history, cookies, or temporary internet files for sites you visit in that window. Obviously files you download and pages you bookmark will remain.

The new per-window model is much more intuitive than the old method of private browsing which put your normal browsing session on hold, hid it away somewhere and opened a new, private session. Now it’s easy to have private windows right alongside normal windows, very handy for those who, for example, need to log in to two different Gmail accounts simultaneously.

The change does have some potential consequences for Firefox add-ons using the new(ish) SDK. If you’re an add-on developer, head over to the Mozilla Add-ons blog for more details.

The other big change coming in Firefox 20 is the revamped downloads window. Mozilla proposed this download toolbar button and overlay window design so long ago that Apple’s Safari has already long since copied and released its own version.

The new downloads overlay. Image: Screenshot/Webmonkey.

While Firefox might not be the first to get its new downloads interface to the web, it’s welcome nonetheless and alleviates the need to cycle through windows or hit keyboard shortcuts just to see if your downloads are done. If you want more info than is shown in the new overlay (which comes up when you click the toolbar button), the old, separate-window style downloads panel is still available.

For more details on everything that’s new in Firefox 20, be sure to check out Mozilla’s beta release notes.

File Under: Browsers, privacy

Firefox 22 to Stop Eating Third-Party Cookies

If advertisers gave you actual cookies while you browsed there would be less resistance. Image: scubadive67/Flickr.

Mozilla has announced that, starting with Firefox 22, the popular open source web browser will begin blocking third-party cookies by default. That means only websites you actually visit will be allowed to set cookies; advertisers on those sites will no longer be able to easily track you by setting a cookie.

While there has long been the option to block third-party cookies, by default Firefox has always allowed them.

Apple’s Safari pioneered the on-by-default approach to third-party cookies and indeed its third-party cookie policy is still more strict than what Mozilla is proposing. Google’s Chrome browser, not surprisingly, allows third-party cookies by default, as does Internet Explorer.

Mozilla developer Jonathan Mayer says the change will “more closely reflect user privacy preferences.” Mayer has set up an FAQ for users and developers, but for the most part, given that Safari has always behaved this way, the changes for developers should be minimal.

The main thing to note as a Firefox user is that the change won’t affect your current settings, nor will it remove any third-party cookies already set. So to get the benefit of the new policy you’ll need to clear out your cookies after you update.

It’s also worth noting that, while blocking third-party cookies is a step in the right direction, if you’re serious about not being tracked while you browse the web you’ll need to take stronger action, installing third-party plugins like Ghostery or DNTMe.

Currently available in the Nightly channel, Firefox 22 is set to arrive in final form in roughly 18 weeks.

File Under: Browsers

Firefox 19 Brings Built-in PDF Viewer, Faster Startup Times

Mozilla has released Firefox 19, which features a few modest improvements including a built-in PDF viewer, faster startup times and support for some new web standards.

Firefox users will be automatically updated to the latest version. If you’d like to take Firefox for a spin, head on over to the downloads page.

The biggest news in Firefox 19 is the new, baked-in PDF viewer based on PDF.js. It may not mean the end of those annoying (and untrue) buttons that say “you need Adobe Acrobat to view this file,” but at least you don’t, well, need Acrobat just to view a PDF.

This release will also be a welcome update for anyone who’s ever double-clicked on Firefox, seen nothing happen, double-clicked again and so on until Firefox suddenly comes to life with twenty blank pages open. As of Firefox 19, the browser will not execute any code before the initial window is made visible, which means you click Firefox and you see an open window much faster.

While there are not many new features in Firefox 19, web developers do get some love with support for several new CSS features, including @page, full width text transforms and the new viewport percentage units like vh, vw, vmax and vmin — handy for sizing elements or adjusting type based on viewport size. Just don’t try to use vh and the like with @page because the W3C still hasn’t quite settled how that will work.

For a full list of all the other smaller changes and bug fixes in Firefox 19, check out Mozilla’s release notes.