NetHosted Blog

Do Your Own Real-Time Editing

Web Developer 1.1.8 is a “What You See Is What You Get” (WYSIWYG) – website editing, debugging, and validation tool. This add-on for the Firefox browser has been in use since 2004, making it a seasoned web developer’s tool. The age of this resource, can assure users that most of the development bugs that can plague newer software, have already been remedied by creator Chris Pederick and Team.

When you download and install Web Developer (WD), it adds a menu option and toolbar to your Firefox browser for easy access. Keep in mind, as you read this article that you do not need to be a design guru to use the tool – it’s designed so users of all levels can start using it quickly. Many people have relied on their Content Management System (CMS) in the past to make changes, however, using a tool strictly designed to edit, debug, and validate can simplify your task when you need to make a few quick changes.

Following are my favorite standout features that the Web Developer toolbar has to offer:

Disable Menu Features

The “Disable Menu” allow you to get to the bare code of various elements on your web page. When you click on the Disable Menu, your given options to temporarily or permanently disable your sites:  Cache, java & javascript, meta redirects, minimum font size, page colors, pop up blocker, and referrer links – just to name a few. I found the ability to disable my cache, so I could keep track of changes as I made them each of them very helpful. Without this option, it’s easy to get clipping along with your edits, and overlook a change because of files stored in the cache.

You can individually disable any item on your page, allowing you to concentrate on what you set out to do, without having the confusion of irrelevant code and other attributes you don’t wish to focus on. All of these disable features are invaluable. My other favorite disable option was the one-click option to disable referrers – this  is an excellent security measure to prevent unauthorized access to your site while editing.

Cookies Management

The “Cookies Menu” allows you to manage cookie usage for both your editing session, along with adding or manipulating visitor cookies. Menu options include the ability to:  Disable all cookies, disable external site cookies, clear session cookies, delete domain cookies, delete path cookies, view cookie information, and add cookies.

All of these options provide you with added security and tracking abilities. Being able to delete your admin session cookies is essential, to protect your server from unwanted visitors who try to gain access to your data. On the other hand, if you’re in the process of tweaking a campaign then you will have the option to clear out older cookies, that aren’t relevant to the changes your making. The View Cookie Information option offered in WD, is an excellent quick reference while debugging/editing, so you can see what what users are clicking on and how long they are viewing certain page elements.

CSS Editing

When you click the “CSS Menu” in WD, a side-bar window opens up allowing you to see your source code, then edit and debug the CSS, while viewing the the changes in real time. You’re given the option to: Add, View, or Disable various CSS elements. Many of us don’t have time to learn the intricacies of the coding so a WYSIWYG view, with the ability to make changes and see how they will be shown to the end user, takes the guesswork out of CSS editing.

I love this feature! You can easy brainstorm possible changes instantly: Maybe you want to see how a color change might look in a certain area, and decide it doesn’t fit – the changes are deleted as soon as you close your CSS side-bar. If you like the changes you can save the file, and upload it instantly.

Other Web Developer 1.1.8  Features

Web Developer 1.1.8 also has other features that come standard on other editors such as window resizing, site form filling & debugging, image debugging & resizing, links to WC3 validation, and you can even test your site against varying monitor sizes;  so you can determine what’s best for your users. You can optimize every element on your web page – In fact, too many to mention in this post! As mentioned earlier there is something for beginners, straight up to the most advanced user. The software is free, and is an essential item for anyone that needs to do maintenance on the go!