Well since Fire fox got updated and I have got the universal package browser for web design I thought why not share it to those who do not know about these tools so here we go. I will explain each tool and what it is used for and then give you the simple instructions on where to get it and where to find it. First download Firefox http://www.mozilla.com/products/download.h...&lang=en-US then install it and your set from there, Now for the plug-ins and add-ons. ColorZilla What this program does is that once you select it a small ink dropper icon will show up and when you move it around it gives you the hex and the RGB code for that color. So if you want to use that color you can copy it down and use it for your web design. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/271/ You can find it at the bottom left corner next to MeasureIt or you can right click and select it from there as well. Firefox Update It works for FF 2.0 Next Add-on/plug-in CSSViewer This next Add-on/plug-in does exactly that, In the last few years web designers have been switching from hard coding their design to css. With css designers are able to design 1 page of coding that will be universally use through out the whole website. So what does CSS viewer simple, you get to see what that css code looks like for that website. The benefits of this well you get a better understanding how CSS design works and how to effectively use it. Downside is that people can copy it down and then modify it to there news thus saving the hard work of doing it by scratch. When you download it and install it you will see it up top under the url bar and the navigation bar as well. It is a simple drop down menu in which has options on who you want to view it. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/2104/ Install it from your desktop and it will appear under the navigation toolbar or if right click you can select it there as well. Firefox Update Is not been updated but a substitute for it is under the Web Developer plug-in CSSViewer. Next Add-on/plug-in Html validation Name says it all with this Add-on/plug-in, you click on the drop down menu to what you want to validate, HTML, CSS, RSS Feeds, Links, Section 508 (security), find out how fast the page loads and more. The validation is done by w3.org who's validation is supreme as to what it check. Although sometimes there are errors that are not errors, but thats another story. So where do I download it, install it and find it to be used. Best part about it if you look at your your url bar you will notice that it is yellow if you do that means the website is 100% valid in html and css and whatever else you can think of. Download it here https://addons.mozilla.org/firefox/249/ After installing it from your desktop you will see it under the navigation toolbar. Firefox Update It works for FF 2.0 Next Add-on/plug-in MeasureIt Basically this little Add-on/plug-in measure the width and height of your website in pixels. Meaning you could get proper measurements for you site and be able to use them in your div tags alot better without the need to trial and error it to make sure everything lines up correctly. From the info page they do mention that the ie tab Add-on/plug-in doesn't work well with it. Maybe in a future update it will. So Where do I download it and install and then use it. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/539/ Install it on your computer, open Firefox and you will see it on the bottom left corner right next to colorzilla Add-on/plug-in. Firefox Update It works for FF 2.0 Next Add-on/plug-in View Source Chart This Add-on/plug-in basically is another way to view the website source code, but in a more structured way, it could be useful or it could be a waste of space depending how you want to use it. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/655/ install it from your desktop and all you have to do is right click somewhere on the website and select View Source Chart Firefox Update It works for FF 2.0 Next Add-on/plug-in Web Developer By the time you have installed most of the Add-on/plug-ins you have most of what you need. But if want the ultimate package then you need to download this Add-on/plug-ins. This has so much stuff on top of what I mention it would take a while to type it all down but once you download it you never go back. So where do I download it, install it and find it to be used. Well to Download it go here https://addons.mozilla.org/firefox/60/ Install it from your desktop and then when you open Firefox you will see it under the navigation tool bar you can't miss it, since it is a series of drop down menus and what not. Also if you right click as well you can select the tools in those sub-menu's Firefox Update It works for FF 2.0 Next Add-on/plug-in X-ray This Add-on/plug-ins basically is another way to look at the source code of the website. But it's usefulness is like beyond your imagination. Because it saves the time and effort of trying to look at the source code and then back to the website and then back to the source code again. It also shows you how that part of the page was set up as well. So where do I download it, install it and find it to be used. Well to download it go here https://addons.mozilla.org/firefox/1802/ Install it on your computer and then to use it right click and select X-ray and your set it's that easy. Firefox Update It works for FF 2.0 Next Add-on/plug-in FireFTP This basic add-on/plug-in is simple, if you webmaster and you want to move multiple files and you don't have enough Hardrive left on your computer to download ftp software then this little add-on/plug-in is all you need to move all those files instead of uploading them one at a time. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/684/ Install it on your computer and to use it click on toe Tools menu and then select it from there and your set to load up all those files and what not. Firefox Update It works for FF 2.0 Next Add-on/plug-in IE Tab So you want to create the ultimate site that is both fluid in FireFox and Internet Explorer? well with this add-on/plug-in you can do exactly that. This add-on/plug-in also saves the time of you going back and forth between browsers when all you have to do is go back in forth in tabs, this not only saves you the time but computer resource usage as well. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/1419/ Install it from your desktop then right click on the tab and then select Switch rendering engine and then BAM you have you website on what it will look like in IE. Side note like I mentioned about MeasureIt doesn't seem to work with this add-on/plug-in at this time So I will keep you update when and if it happens. Firefox Update It works for FF 2.0 Next Add-on/plug-in Window Resizer So you want to test out out you newly create website in different computer resolutions and you don't feel like right clicking and changing your resolution every time you change the code to the site. Well have no fear this little add-on/plug-in will do the trick with this you will be able to change the way firefox looks at different resolutions with out spending 3 minutes everyitme going through each setting just to make sure your fluid design stays fluid. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/1985/ Installs automatically and to use it click on tools menu in the browser and select resize window and your done. Firefox Update It works for FF 2.0 Next Add-on/plug-in Opera View Same concept as the IE tab but you can view what your site will look like in the Opera Browser. So where do I download it, install it and find it to be used. Download Here https://addons.mozilla.org/firefox/1190/ Install automatically, then to use it just right click the page and select opera view Firefox Update It works for FF 2.0 Next Add-on/plug-in Load Time Analyzer With this extension you be able to optimize your coding and images by seeing how long it takes for your web page to load in different aspects. Like css style sheets, scripts images and other stuff. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/3371/ installs automatically you will find it on top of the tabs you can't miss it. Firefox Update It works for FF 2.0 Next Add-on/plug-in Offline Validator So you don't feel like uploading your page to your website and then test it's validation and then reedit it from there then upload the page over and over. With this extension you will be able to validate it offline from your computer and be able to make any changes you need to without all that hassle. So where do I download it, install it and find it to be used. Download it here https://addons.mozilla.org/firefox/2520/ Install automatically, to use it go to tools and select validate page and it goes through it's little process and bam there you go. Firefox Update It works for FF 2.0 So with all these add-ons and plug-ins you will be set to design websites without all the hassle and stress that goes with it and using different programs just to get it right. So enjoy these tools and use them well and you could be designing just as well. Also I as go through the add-ons/plug-ins I will let you know about them through updates and what not. Also if I am missing anything that web designers could use drop a post or pm and I will make sure to add it and what not.
Thanks I haven't gotten though all the extensions for designers, So this will be updated as time goes by and what not.
:| one of them buggered up my browser :s . It wouldn't load up, just crash on start-up. I had to do a system restore <3
OH shiz lol. I just updated to FF 2.0, and css viewer doesn't work with 2.0! I really want css viewer.. ;( Nice list though, rep for sharing. Very useful mate! ~NMX Merged Post: Btw: https://addons.mozilla.org/firefox/60/ That does most of all that in 1 add on, just added and its gr8. Now for the color picker thing! xD ~NMX
The WebDeveloper does add pretty much most everything I mention but call it a back up for some strange reason.
I downloaded; MeasureIt X-ray Window Resizer Load Time Analyzer But after system restore I downloaded Measure It and Window Resizer and its working fine now
it could be the load time analyzer due to fact when you use it, it goes through the process of each page you load or go to and what not. But instructions on that are on the download that could help prevent the freeze. Just out of curiosity what are your computers systems specs, so I have an idea just in case this pops up somewhere else. Posted this across a few dozen sites :lol:
hmmm :| All I'm going say is that I'm surprised as its by Google. Fasterfox displayed the load time of the whole page anyway, but then I don't think fastefox has been updated for v2 yet
but fasterfox is geared more towards making firefox more faster with the caching of pages and what not. With Load Time Analyzer it is gear towards optimizing your html coding so slower connections can download the websites at a better speed.
another small bump by now all the the add on have been updated for Fire Fox 2 so use them and enjoy them.
