Web Design Tips, Tutorials & More!

Useful Designer Firefox Extensions

Firefox has come out with several very useful extensions, which will aid firebug.  If you are a designer, and you are not yet using firebug I suggest you download it and also install the extensions.

There are several extensions available each of which has its own advantages. Pixel Perfect is one of these.

This is a layout add-on which you can use to work out your web design by coding your HTML and CSS. There is a video that you can use to see how it works.

Another add-on is Page Speed.

This has a user guide, and it has a large quantity of features which you can use and I suggest you read the guide which is chock full of interesting and useful information.

An add-on which has been released by SitePoint is Codeburner.

This gives you a built in reference to both HTML and to CSS. This helps you both with compatibility issues and also with W3C compliance.

If you write a lot of code you know how useful code highlighters are and the next extension does this in firebug. It’s called FireRainbow.

Codes like java CSS and Html all are made easier to read by highlighting them with any of the 20 or more themes which you can choose from.

Firebug has an add-on which was created by Robertnyman.com called Inline Code Finder.

This can be especially important when looking for speeding up your pages.

Cookies for tea anyone? Cookies can be developed and improved inspected and turned upside down and inside out with Firecookie.

There are many things that cookies can be used for and this add on can deal with most, if not all of them.

Checking how much code is being used and executed at any one time can be illuminating at the least, and FirebugCodeCoverage will do just that.

This will be able to test your code extremely thoroughly.

Search Engine Optimization is always extremely important and doing it in what some call a white hat manner is even more so. Black hat methods tend to be frowned on heavily and usually tend to lead to you been booted rather heavily but search engines if they are discovered. The firebug extension to analyze this is called SenSEO.

This will check your page and see how well you are doing. It looks for all the normal little things like a title, Meta tags and headings.

One of my favorite tools is YSlow.

This checks your WebPages performance on the net and takes it apart and sees where you can make improvements. You can get stats on various parts of your page and thus make useful improvements for speeding it up. If you also include Smush.it and JSLint to optimize further you should end up with a very fast page.

The last item I am going to suggest here is Firefinder.

This will help in finding items in search which will enable web page elements to be found relating to items you are looking to match with your CSS and or Xpath Selectors. Your CSS style rules can be tested with this. It will highlight matching elements.


Leave a Reply