For a long time, Mozilla was more than happy to allow others to create web developer tools for Firefox, Firebug was the gold standard for many years. But last year Mozilla made the decision that it couldn't rely on others anymore and that it needed to step up its game in this department.
And stepped up it has, for the past few releases, Firefox's set of dev tools have gotten significantly better with each iteration.
They've gotten plenty of improvements in Firefox 12, Mozilla lists some 85 changes, and the recently launched Firefox 13 Aurora ups the ante even more.
The Page Inspector has gotten a handy new feature for handling elements that may be hidden during normal navigation. You can now lock elements that are set to be displayed only they are hovered or when they have focused.
"You now have the ability to lock in a pseudo-class for the selected page element in the Page Inspector,"
"Right-click on the page element 'infobar' for the selected element to toggle the pseudo-class lock," he added. There is a menu planned for the feature, but it works via a simple right-click right now.
Another tweak that helps workflow is that the HTML or Style panels in the page inspector now retain their state when you re-open the inspector, they'll be open if they were open the last time.
The Style Inspector has gotten a few improvements as well. You can copy rules from a CSS file directly via the context menu. Invalid CSS entries are now marked as such, with a warning sign and an explanation of the error.
Finally, if you're editing a local file in the Style Editor or the Scratchpad, you can now save it on the fly so any changes you make will be permanent. Of course, Mozilla is not done yet, though the focus will be on improving existing features at least for the time being.
Videos for getting more information about Mozilla Firefox Aurora
Pseudo Class Lock in Firefox 13
Firefox Aurora 13 Style Editor
Firefox 11 is officially here. Regular users have a couple of features to play with, a big one is add-on sync. But developers are probably a lot happier with the latest release, the set of web development tools that Mozilla has been building into Firefox has expanded to contain a stylesheet editor and writer as well as 3D view for the Page Inspector.
"Page Inspector 3D View, nicknamed Tilt, is a brand new WebGL-based website visualization tool that highlights the structure of a page better than a flat view, so anyone can immediately understand the relationship of the code to the page output," Mozilla explained.
Eager users have been able to test the 3D view for a few months now, as Firefox 11 went through the Aurora and then the Beta stage. Then again, developers prefer a stable platform for doing actual work, so this is probably the first change that the 3D view will get to be tested for real work on a large scale.
It should prove useful to designers and especially when debugging glitches or strange behavior. One caveat is that your computer should be able to run WebGL content, meaning up-to-date drivers and relatively modern hardware. Developer shouldn't have a problem with that.
"Firefox now includes the new Style Editor tool, which allows developers to edit CSS stylesheets like a text editor and see changes instantly, entirely within the browser.
It’s a quick and easy way to iterate and test designs on a website. Once changes are made, the Firefox Style Editor provides a simple way to save the file to your computer," Mozilla wrote.
Another touted feature for developers is the full-blown stylesheet editor that enables designers to live edit CSS code. The tool comes in especially useful for adding new elements, or quickly sketching out a new layout. Developers can save anything they write to continue to edit in more powerful tools.
Firefox 11 was released last week and, by now, many if not most Firefox users should be running it. Firefox 12 was graduated to the beta channel soon after that and now Firefox 13 makes its debut in the Aurora channel.
Anyone who's been following Firefox in recent months knows that the Aurora channel is where the action is or, at least, where the latest and greatest features make their debut to a wider audience.
This is true with Firefox 13 as well, the latest Aurora build comes with a New Tab Page (finally) as well as a new homepage.
New Tab Page
It's taken several years, but Firefox has finally gotten a new tab page enabled by default. There have been experiments with the feature for months if not longer, but Mozilla now thinks it's ready for the prime time.
The new tab page is spartan by any measure; it just features nine tiles of frequently visited pages.
The tiles can be pinned, so they don't get removed even if you don't use them that often, and they can be removed if you're not particularly happy with the choice Firefox made. There's also a button to hide the tiles but that's it.
New homepage
Along with the new tab page, Firefox 13 also introduces an updated homepage, the customized Google search page that is the default start page in Firefox.
The new page is minimal but useful, there are tips under the search bar and buttons for quick access to things like bookmarks, add-ons and so on.
For non-technical Firefox users, the ones that use the homepage the most, the buttons should prove very handy.
SPDY by default
Under the hood, Firefox 13 finally enables SPDY by default. Mozilla has been working on this for quite a while and had a number of setbacks, but Firefox is now the second browser to support Google's upgraded HTTP protocol, not counting the Silk browser on the Kindle Fire.
Mobile user agent
Firefox 13 introduces a new user agent for mobile devices, one for phones and one for tablets, for sites that use this to pick between the mobile and the regular version to serve to users.
Developer tools
As has been the norm for the past few releases, Mozilla has continued to improve on its developer tools, which made their debut only a few months ago. The page inspector has gotten some improvements and so has the style inspector. The 3D view in the page inspector now makes it easier to focus elements.
0 comments:
Post a Comment