Log In Sign Up

Useful Firefox Add-Ons for Web Designers

Forum: Graphic and Web Design


Welcome to the JustMommies Message Boards.

We pride ourselves on having the friendliest and most welcoming forums for moms and moms to be! Please take a moment and register for free so you can be a part of our growing community of mothers. If you have any problems registering please drop an email to [email protected].

Our community is moderated by our moderation team so you won't see spam or offensive messages posted on our forums. Each of our message boards is hosted by JustMommies hosts, whose names are listed at the top each board. We hope you find our message boards friendly, helpful, and fun to be on!

Reply Post New Topic
  Subscribe To Graphic and Web Design LinkBack Topic Tools Search this Topic Display Modes
April 15th, 2009, 09:24 PM
CeiCei's Avatar Platinum Supermommy
Join Date: Jul 2005
Location: Mobile, Alabama
Posts: 9,482
Send a message via AIM to CeiCei Send a message via MSN to CeiCei Send a message via Yahoo to CeiCei
I am a very big fan of Firefox browser. One reason is because websites are viewed with more accuracy than with Internet Explorer. Each version of Internet Explorer tends to have it's own set of issues when it comes to CSS, Javascript, Flash, and other webpage coding. Another reason is because Firefox has many helpful add-ons for web designers to use that can help them improve the site's looks, search engine optimization, and debug errors.

Here is a list of add-ons I use (and most of my co-workers) everyday that seem to help us greatly when we update client websites. The ones marked with the red askerisk (*) are the ones I use personally. All others are those I have been told work good, but have not used yet.

If you have any add-ons that might be helpful, please do not hesitate to post to this thread with the name, link, and description.

* Accessibar
Accessibility toolbar enabling easy manipulation of web page display and text-to-speech output... Web page fonts, links and background colors can be changed from a selection of 70 colors on current session

* Firebug
Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page... Firebug 1.3 requires Firefox 3.0.

* Fireshot
FireShot is a Firefox extension that creates screenshots of web pages (entirely or just visible part). Unlike other extensions, this plugin provides a set of editing and annotation tools, which let users quickly modify web captures and insert text annotations and graphical annotations. Such functionality will be especially useful for web designers, testers and content reviewers. The captures can be: - uploaded to FREE public screenshot hosting - saved to disk (PNG, GIF, JPEG, BMP) - printed - copied to clipboard - e-mailed - sent to configurable external editor for further processing.

* SEOQuake
Seoquake is a Mozilla Firefox SEO extension aimed primarily at helping web masters who deal with search engine optimization(SEO) and internet promotion of web sites. Seoquake allows to obtain and investigate many important SEO parameters of the internet...

* ShowIP
Show the IP address(es) of the current page in the status bar. It also allows querying custom information services by IP (right mouse button) and hostname (left mouse button), like whois, netcraft. Additionally you can copy the IP address to the clipboard.

* TimeTracker
Do you spend too much time on Firefox? Do you open tabs faster than you can close them? Cannot get things done? Keep track of how much you browse with TimeTracker.

* https://addons.mozilla.org/en-US/firefox/addon/1985
Resize your browser to various standard resolution sizes

* Save Session
With Save Session, you can choose to save the current session and close Firefox for the next startup. This works best if you USUALLY want to launch Firefox with your default homepages or blank page but SOMETIMES want to start with the previous session.

* MeasureIt 0.3.8
Draw out a ruler to get the pixel width and height of any elements on a webpage.

Abduction! 2.026
Useful for showing people bugs in a website, creating snapshots of design progress, or perhaps even creating a gallery of websites.

Chrome View 0.1.5
View a page in Google Chrome on Windows: This extension allows you to quickly open the currently viewed page in Google Chrome.

* CleanHide 1.0.9
If you find some web page use Hidden Text insert in normal articles,try this.

* Codetch 0.4.2
Get the feel of Dreamweaver in a Firefox extension. Edit your documents right next to your web pages as you surf.

* CodeBurner for Firebug 1.1
CodeBurner is a Firefox add-on that integrates with Firebug, to extend it with reference material for HTML and CSS.

* CoolPreviews 2.7.3
Browse faster -- Preview links and images without leaving your current page or tab. Just mouseover any link, and a separate preview window immediately appears to show you the content. (TIP: The fastest way to view many links on a webpage, such as Google, is by mousing over subsequent links while the preview window is still open or locked.)

CSSViewer 1.0.3
A simple CSS property viewer.

* Dust-Me Selectors 2.11
Dust-Me Selectors is a Firefox extension (for v1.5 or later) that finds unused CSS selectors.

It extracts all the selectors from all the stylesheets on the page you're viewing, then analyzes that page to see which of those selectors are not used. The data is then stored so that when testing subsequent pages, selectors can be crossed off the list as they're encountered.

You can test pages individually, or spider an entire site, and you'll end up with a profile of which selectors are not used anywhere.

* Font Finder 0.5d
Simply highlight a single element (e.g. a paragraph or a strong tag ), right-click and select `Font Finder`, then marvel as the full CSS text styling of the selected element appears.

* GA? - Is Google Analytics Installed 1.0.1
This extension checks the current page you are on to see if Google Analytics is installed. It'll automatically detect and report back to your browsers status bar.

* Html Validator
HTML Validator is a Mozilla extension that adds HTML validation inside Firefox and Mozilla. The number of errors of a HTML page is seen on the form of an icon in the status bar when browsing.

* JSView 2.0.5
All browsers include a "View Source" option, but none of them offer the ability to view the source code of external files. Most websites store their javascripts and style sheets in external files and then link to them within a web page's source code. Previously if you wanted to view the source code of an external javascript/stylesheet you would have to manually look through the source code to find the url and then type that into your browser.rnrnWell now there's a much easier way. You can use the JSView extension to solve the problem. You can access it from the context menu, from the toolbar, from the view menu, or from the status bar. If the website you are viewing contains any external js/css files, an icon will appear that says "SS", "JS", or both. Each individual file can then be viewed by clicking on the filename. The file will be opened in a new window. You can also choose to open all external files by clicking on "View All".rnrnWith the latest version you can now view the embedded css and js as well (FF2 and SM2 only). Just open the "Page Info" window from the context menu or tools menu. There will be 3 new tabs in that window. One for scripts, one for stylesheets, and one for frames. You can open them by double clicking or by using the context menu.rnrnYou can also right click on the 'view page source' menu item and open the url of the current page with jsview. This allows you to open the source code of any web page in a new tab or in an external editor.

* KGen 0.4
KGen (Keyword Generator) is an extension that allows you to see what keywords are strong on visited web pages. Than, you can retrieve them for social sharing (tag filling) or webmastering/SEO.

So, you can easily know how to optimize your pages, know what's the secret of your competitors or simply know what's the main subject of a webpage.

You can also select some words and transfer them to your clipboard and paste them on tag fields on your favorite social network or fill meta-keywords of your web pages. You can also generate a tag cloud for your blog.

To open the KGen sidebar : View>Sidebar>KGen. You can also add the KGen button to your toolbars with the toolbar customization tool.

* IE Tab 1.5.20090207
This is a great tool for web developers, since you can easily see how your web page displayed in IE with just one click and then switch back to Firefox.

LinkChecker 0.6.3
Check the validity of links on any webpage.

* Site Information Tool 1.2
Provides information about a webpage (or website) including rankings, domain registration data (whois), IP information, server response and page data, thumbnail and more.

Kassia's Blog | Kassia's Family Blog | In My Purple Passion | The Food Travel Enthusiast

My Three Princes: Cordell (23 y/o), Ernest (5 y/o), Robert (4 y/o)

Reply With Quote

Topic Tools Search this Topic
Search this Topic:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are Off
Pingbacks are Off
Refbacks are Off

All times are GMT -7. The time now is 12:15 PM.

Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Search Engine Optimization by vBSEO 3.6.0