Register now or login here to start promoting your blog and your favourite articles.
22 Extremely Useful Tools for Web Designers and Developers
1 Jul 2009 - 13 Comments
I have a list of firefox plugins, adobe air apps and some freewares (mac and win) that able to boost web designers and developers productivity and efficiency.
Author: kevin | Source: queness

Introduction

As a web designers or/and developers, I believe we all have our own favourite tools. For me, I have heaps of them and some of them are extremely useful. Because of these plugins, air apps and editors, I able to finish my projects on time, going back home on the dot. :)

To all the fellow developers who have make all these wonderful plugins/applications.

A HUGE THANK YOU!

 

Firefox Plugins

A lot of Firefox plugins have changed web designers and developers' life. :) For myself, I'd be least efficient if I work without firebug and web developer. Debugging html, css layout is so much easier with all those plugins. The following is my favourite plugins:

  • Web Developer Tools

    The Web Developer extension adds a menu and a toolbar to the browser with various web developer tools. It is designed for Firefox, Flock and Seamonkey, and will run on any platform that these browsers support including Windows, Mac OS X and Linux.
  • ColorZilla

    Advanced Eyedropper, Color Picker, Palette Viewer and other colorful goodies for your Firefox
  • Screengrab!

    Screengrab! Firefox Extension is a handy web development tool with 6 excellent options. Screengrab! saves or copies to clipboard web pages as images.
  • 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. The details of the errors are seen when looking the HTML source of the page.
  • Firebug

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

    FireRainbow brings javascript syntax highlighting to Firebug.
  • Live Header

    View HTTP headers of a page and while browsing.
  • Dust-Me Selectors

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

    CSS Validator is a Mozilla Firefox extension which Validates a page using the W3C CSS Validator.
  • IETab - windows only

    IE Tab, an extension from Taiwan, embeds Internet Explorer in a Mozilla/Firefox tab.

Adobe Air Applications

Adobe Air application is like mac widgets. They are small but extremely useful. The following are the apps that I think can be very inspiring for designers and helpful to developers.

  • colorPicker

    colorPicker is a widget-like AIR application that lets you either choose a "web-safe" color from a color grid or design a color using sliders to adjust the red, green, and blue values of the color.
  • Color Browser

    This application is a simple way to create and organize your favorite color palettes. Sets of colors are easily viewable in a clean interface. Edit them, rearrange them, create new sets, make them your own.
  • Kuler Desktop

    Browse, search, and save themes directly from your desktop with this Adobe AIR™ application. Drag individual themes to your desktop, where they can be scaled to any size
  • Em based layout

    A calculate to save the hassle in calculating the em of any give px.
  • Polaris Google Analytic Reporting

    Polaris is a cross-platform desktop widget for Google Analytics. With 8 standard reports it's the easiest way keep your data always instantly available. The rich interface and swift navigation make it a pleasure to use.
  • Pixus

    Pixus is a tool to measure the screen objects in pixels using both mouse and keyboard control and preview your design with skins and presets.
  • JustResizeIt!

    JustResizeIt! introduces a brand new way of resizing images – just drag and drop them!

My favourite Mac & Windows Tools

For me, I have two different working environments - windows and mac. Therefore, I have the chance to try out different kind of softwares. In my opinion, I think notepad++ is the best editor I ever used. I have been trying out all kinds of solution out there, forexample, coda and textmate, none of them can give me the robustness that notepad++ offered. The rest of the software I find myself has been using it, and I'd like to share it with all of you.

  • Notepad++ - win

    I have to admit, this is the BEST web development editor! Unfortunately it's only available on windows! It comes with tabbed interface, configurable syntax highlighting, syntax folding, line numbering, multi-view, bookmarks and regular expression search and heaps of useful features.
  • Putty - win

    PuTTY is a free implementation of Telnet and SSH for Win32 and Unix platforms, along with an xterm terminal emulator.
  • Filezilla - mac, win

    FileZilla is free and powerful cross platform FTP solution.
  • Clyppan - mac

    Clyppan is a free and Open Source clipboard history application for Mac OS X that’s always at your fingertips.
  • TextWrangler - mac

    TextWrangler is the powerful general purpose text editor, and Unix and server administrator’s tool.

Don't forget to share this article to show your support! :)

Copyright & Usage

The effects and techniques demonstrated in tutorials on Queness can be used in whatever manner you wish without attribution. You cannot copy whole tutorials (unless permission is given), either in English or translated to another language.

Share This Post to Support Me! :)



Comments

dlv on 1 Jul 2009 says:
great list!
i discover "Dust-Me Selectors", but it doesn't work in FF 3.5 jeje, i have to wait...

I agree with Notepad++, excellent software, and it become with an FTP client out the box

Pehaps, you should add the new Google's PageSpeed utility :)

thanks, adeux from argentina
Rubens Mariuzzo on 1 Jul 2009 says:
I agree that n++ and putty are two powerfull apps. Also, FireRainbow is new for me, I'll give it a try.

Thanks for this article.
Mike Kivikoski on 1 Jul 2009 says:
@dlv to get Dust Me to work try doing:
Open about:config,
right-click new boolean ´extensions.checkCompatibility´,
set false,
restart.
(via @jeresig)
dlv on 1 Jul 2009 says:
oh yes, i forget that solution
thanks Mike to tell me that !
now "Dust-Me Selectors" is working in FF 3.5

adeux!
Ben Burleson on 1 Jul 2009 says:
Filezilla is also a Linux app.
choen on 1 Jul 2009 says:
before i use Filezilla, now i use FireFTP - Firefox.
Phaoloo on 1 Jul 2009 says:
Awesome useful tools. They boost your productivity
Ewout on 2 Jul 2009 says:
Great list. I love Notepad++, it's the best editor out there.
Ryan on 3 Jul 2009 says:
Thanks these are very handy indeed!
Muhammad Siyab on 3 Jul 2009 says:
Great tools. I especially like Em based layouts.. :)
saiful103a on 18 Jul 2009 says:
I had no idea.This is great.Really really great.Bookmarked...
e-antz on 27 Jul 2009 says:
nice..I use some..
drain cleaning on 2 Oct 2009 says:
I am a web designer...new to this proffession and your tips are really useful for beginners like me.

Leave a comment

Subscribe RSS Subscribe RSS, Keep yourself updated with queness latest posts!
Pixel Crayons
  •  
  •  
  •  
  •  
  •  

Community News

Random Posts


View all posts and news Back to top

About the Author

A web designer and developer who is passionate and keen on contributing to the web development industry. Feel free to say hi to me, or follow me on twitter.

Kevin Liew