Firefox add-ons for web designers
My brother, who started in computing at the very beginning and spent his
working life programming, was helping me network my computer. I noticed that
he used IE a lot and I asked if he ever used Firefox. No he said. I was surprised,
because apart from Firefox being more secure for the web surfer, it is free
and is very useful for the web designer.
Firefox is now the most significant product of the Mozilla open source project, and is extremely useful for web designers. If it is not yours, you should consider trying it out. Why? Well that's what this article is about. I won't go into the history of Mozilla and Firefox and how it has been developed by an open source community. I'm just going to tell you about the add-ons which are the useful ones for the web designer. Here are some of the most popular Firefox add-ons.
CSS
Aardvark – A cool extension for web developers and designers, allows them to view CSS attributes, id, class by highlighting page element individually.
chromEdit – Alter the appearance of any page by editing CSS and Javascript files with this extension.
CSSMate – Firefox extension to edit CSS files.
CSS validator – Check the validity of your webpage using this CSS validator extension.
CSSViewer – See the CSS properties of page elements with this extension.
EditCSS – Play around
with loaded CSS
IE Tab – Designers
and developers can view their CSS projects on Internet
Explorer using this extension.
Style Sheet Chooser II – Users can pick and choose alternate style sheets for a website.
Debugging and Analysis
FireBug – A console for debugging JavaScript, HTML, and Ajax code snippets.
HTML Validator – Cool extension to validate web pages with HTML standards of W3C.
JavaScript Debugger – JavaScript debugging extension enables a strong debugging environment.
Link Checker – Check the links on a webpage for validity. Color to each link explains its current status.
Load Time Analyzer – View detailed graphs of the loading time of web pages in firefox. The graphs display events like page requests, image loading times etc.
View Dependencies – Find out all files that were loaded in a webpage with the view dependencies tab in page info.
Others
Clipmarks – Easily save portions of webpage with this extension.
Codetech – Excellent extension for web page designers, codetech
is a web page editor with the look and feel of Dreamweaver.
FirePHP – Find out what
PHP
code in the backend does to pages on display in Firefox browsers.
Flash Switcher – Use this extension to avoid reloading between
flash plugins.
Greasemonkey –
Control any aspect of web page behavior by adding Javascript code to
any webpage using this Firefox extension.
Measureit – Users can calculate the measurement specifications
of tables, paragraphs on internet.
Platypus – One of the best Firefox extensions for modifying
a webpage. Users can modify a webpage, save their changes as a Greasemonkey
script and their saved page would be loaded the next time they visit
the page.
Poster – A must have tool for web developers enabling them
to interact with web services and other web resources.
Professor X – Check out the contents of the head of page without
getting into source code.
Screen grab – Capture screenshot of any webpage and save it as an image file with this extension.
TestGen4Web – Save the webpage activities users (entry of text, web page clicks) in xml file. These actions can later on be replayed and converted to scripts for automated test tools.
View Source
Chart – View the source code of any webpage as Firefox sees
it.
X-Ray
– Must have Firefox extension, it allows users to view webpage
code with a right-click and shuffle between the webpage and its code
easily.
Web Developer by Chris Pederick. It adds a toolbar to the browser that is loaded with features to help you develop for the web! Things like outlining various html elements on the fly, enabling and disabling styles, resizing the browser window to various standards, validating your pages, it has a built in ruler tool, options for images, forms, cookies - you name it!
ColorZilla by Alex Sirota. Super little tool that sits tucked in a little corner and when you click on it you can sample any color on the web page and copy it to your clipboard. Did I use the right blue on those links?
IE View by Paul Roub. This inconspicuous little add-on lets you load pages in IE! Perfect for cross browser testing!
SeoQuake by The SeoQuake Team. This extension gives you a ton of information on your page including Google page ranking, Alexa ranking, showing keyword density and META tags, it allows you to see backlinks and so much more! Quite a handy little thing.
I
got a computer way back when. I was linked to the internet, before the
school I taught in had it. So I learned about computers first and then
as I was a teacher librarian I learned a computer system which we used
to computerize the stock. We had to teach students and teachers how to
use it. How to search. At home I was learning to use HTML and images on
the site I had back then. When the school was ready to create a site for
itself I was all for it and wanted to do it. However, the job was given
to the computer techie of course. After I left that school and at another
I had much more access to the internet and collected many sites suitable
for students and teachers to assist with their learning. Then, after retirement
I started learning web design and as I did, being a teacher, I developed
some tutorials, which you will find on this site. I also take photos.
