SBala

I wrote a post not too long ago about Firebug, Dragonfly, and the developer tools the web development community has grown to love and appreciate. Firebug, Dragonfly, Internet Explorer Developer Toolbar, and that thing on Safari all share one thing in common: they are� extension of their corresponding browsers and when testing on a different browser it is often times hard to find the plugin needed, or tedious to get accustomed to a new interface. When things get dry in cross-browser bug fixing and DOM/CSS inspection, the new smaller kid in town is planning on saving the day - Firebug Lite. Unlike it's older brother, Firebug Lite is a chunk of JavaScript intended to be added to a web page that is being developed and provides an interface for debugging without the need of any extensions.

It's rather simple to use Firebug Lite. All you need to do is add in the script at http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js.

There is also an offline method to use Firebug Lite as well as a bookmarklet for use during web development.

There are tons of other little features built into the tool, so go ahead and enjoy another method of debugging.

When doing any form of web development, the end goal is always a smooth interface for a user. When making both the server-side code that generates a page or the frontend interface template, problems are sure to follow. Maybe an accidental typo in the JavaScript bricked the interface, or the small snippet of CSS went horribly wrong; whichever the case, a tool that can show the hierarcheal progression of HTML elements and their associated pieces of CSS and DOM code enable a faster approach to debugging since you will know which chunk of code is creating the problem.

When debugging, there are multiple tools that allow you to take a look under the hood of any web page. My personal favorites are the ones that integrate with browsers. Depending on which browser you use, your choice will vary. If you are using Internet Explorer, I suggest getting Firefox.

For the brave souls developing and debugging for Internet Explorer, Microsoft offers a toolbar with some tools that come as close to the Firefox or Opera debugging experience as you can find on Internet Explorer. The screenshots say everything that needs to be said.

Opera's Dragonfly, which is currently in an alpha stage of development, is a fairly robust tool that provides debugging tools for JavaScript, CSS and DOM inspection, and error detection. Although the Opera browser itself is not released under an Open Source license, the Dragonfly debugging tools are available under the BSD license. It is still a product in Alpha, and there are many features under development.

The second alpha release is the next step towards Opera Dragonfly 1.0. Look forward to new features such as DOM editing, improved JavaScript thread handling, XHR and HTTP monitoring, improved keyboard navigation, and translation into a number of languages in subsequent releases.

*Note: Dragonfly provides tools such as integrated validation in a single extension whilst Firefox requires two extensions for a similar functionality. A single extension provides a further integrated interface and cohesive sets of tools. This is hardly a drawback for choosing Firebug, but merely a slight benefit for Opera users.

Lastly, and most certainly not least, the excellent combination of Firebug and the Web Developer toolbar demonstrate the power of Firefox - its extensions. There really isn't much to say. Firebug provides the similar tool-set of CSS and DOM inspection paired with error detection. The web developer toolbar has many nifty tools such as a ruler for measuring pixels on a page and built in validation for external and local files.

I found this article recently which covers a rather interesting topic. CMS design is much different from normal XHTML and CSS because a CMS involves learning the "rules" so-to-speak of that CMS's templating system. After learning the templating system, you also have to learn the raw markup that CMS generates, the ID and Classes that it uses for each element, and how the CSS you use to design the page can use the variances of the Classes and IDs to consistently deliver the same layout. If a choice of editor is involved, there are also many things to deal with such as a custom style for the editor in use. Also, if dealing with a potential client, posting content through the editor may involve copy and pasting from a word processor - the editor chosen for the job should handle that.The other topic covered by the article is supporting old browsers. I already have a solid stance on the issue.

At first glance at this update from 37Signals, I shrugged and said my usual cynical, "Who cares?" until I realized the drastic progression ensuing the process of companies slowly ditching support for the outdated and bug-ridden Internet Exploerer 6. 37Signals is phasing out Internet Explorer 6 support on every single product they distribute, and is starting a trend that is much appreciated by almost every web developer. If this catches onto more mainstream markets, in which major online players eventually decide to cut Internet Explorer 6 off, more websites will focus on creating semantic and standards-compliant code rather than violating standards and ruining clean code in order to properly display in an outdated browser. The catch, 26.5% of web surfers are using Internet Explorer 6. Although that number may be a minority, it is still a large audience.

Microsoft has updated Internet Explorer to version 7. Many people view this browser with mixed emotions; it heavily improves upon its prior releases, but it still is a far way from true standards compliance.

Firefox, however, is slowly changing the complications commonly associated with technologies surrounding web site presentation. With its 41% market share, Firefox has heavily optimized both resource usage and rendering. The improvements made by Apple and Opera are also putting pressure on the not-so-dominant Internet Explorer for change.

The pressure put on Microsoft by the browser developments made by Opera, Apple, and Mozilla are still not enough to reduce the 26.5% if people still make the web work well on Internet Explorer. What most developers who consider the needs of Internet Explorer users are missing is the fact they they are encouraging the use of an outdated browser that cannot properly handle modern tasks. Programmers are supplementing proper coding with hacks, and hindering the future implementations of CSS3, JavaScript 1.6+, and XHTML 2.0.

Once users see a majority of the web as a disfunctional mess, only to realize it was their own fault for ignoring the pestering Windows Update notifications, they will adopt browsers that give them a better experience whilst also allowing developers to use the web-based technologies they want to implement.