With an ever growing number of browsers to make your code compatible with and higher demands placed on web designers and developers there is a requirement for more powerful tools to create and maintain your code. This tutorial will cover a number of methods and resources to help aid you in the escalating demands of your web projects.
Many Developers and designers have their own personal favorite browser for developing and managing their websites. This tutorial will focus on the use of Firefox. This is not to say other browsers put you at a disadvantage, but the addons and enhancements are all supported by Firefox.
If you want to get really clever you can use the powerful break point options which enable you to step through your code line by line, This is very useful if you want to decipher what is happening as your code renders on a page, you can add watches to elements to make debugging your code even easier. If you familiar with C++ and JAVA programming you will take to this like a duck to water.
This simple yet powerful add-on for Firefox appears within the firebug console, when downloaded. It will give you access to information about cookies being stored on your web pages, with the ability to view and remove them as you require, without needing to load up separate tabs, although a similar tool is available on the developer tool bar Firecookie is a convinient option to consider. This is especially useful if you are working on scripts which rely on using cookie data as opposed to session information. It may be simple, but defiantly one I would be lost without.
Web Developer Bar
Most designers and developers are already very familiar with this toolbar, but its always worth a mention. The web developer bar is a useful bit of kit which can do a number of tasks very well. It has a range of tools which make developing your websites much much easier. For web designers you it gives you free range over your style sheets, meaning that you can edit your style sheet on the fly. This is similar in principle to what is possible in Friebug. The CSS options are great if you want to make a lot of changes to your web pages stylesheets, as once they are made and you can see they are working you need only copy all the contents of the stylesheet over the top of the original and update to your FTP, saving the trial and error method adopted by many.
Developed by Yahoo, Yslow is a tool designed to help with website optimisation. Personally I have found you need to take this tool with a pinch of salt. Although It is very useful for measuring page load time, some of the featues such as web page grading are worth overlooking, as the basis of the analysis can conflict with what you may be trying to achieve.
Probably one of the most useful tools out there if you ever need to do anything with form submission. Url Params is yet another powerful Firefox add on, it comes in the form of a sidebar which displays both POST and GET information, making it much easier to see what you are sending through. You can also easily add parameters on both in a GET and POST fields. A very effective and easy to use tools.
The tools I have mentioned will help you if you are a seaoned professional, or just simply a hobbiest. This is not to say there are not more tools out there for you to use. The beauty of this list id that everything on it is free for you to use on commercial project or otherwise. If there are other tools not on the list please comment on them, Im always keen to find out what other developers are using in modern web design.