Web Development

6 Incredibly Useful Tools I Have Been Using for Web Development

Written by Kevin Liew on 05 Oct 2010
30,449 Views • Shares
8 comments

Introduction

As a full time web developer, I always find myself hanging around or using the same tools/plugins again and again on different projects. The main reason behind this? I tried a few of plugins/tools and a lot of them are not stable, buggy and lack of features. I have been building a lot of commercial websites, and I really need a stable tools/techniques/plugins to speed up the development time.

So, in this post, I will summarize a list of tools, plugins and techniques that I have been using.

  • Flowplayer
    Flowplayer
    I've limited knowledge in flash let alone building a flash video player. I found this free flash player, easy to implement and it can be configured easily.
  • Zen Coding
    Zen Coding
    If you have to build website from PSD to HTML/CSS. This could be your life saver. It allows you to generate long and repetitive HTML code just with short syntax. Well, you'll have to learn a bit of "zen coding" but believe me, it's pretty intuitive. It saves me heaps of times, and actually make it more fun! However, you have to make sure your text editor is supported. Follow by a video to demonstrate the power of zen coding
  • FancyBox
    FancyBox
    Kudos to the author of fancybox, great jQuery plugin that is free for personal and commercial use. There are million of lightbox/multibox/thickbox/thinbox....... out there! In my own opinion, fancybox is the one that has the most balanced features and it even supports the worst browser - IE6. Other great features like - youtube popup, ajax, iframe, swf etc. Oh, not to forget, it's easy to style too.
  • Ultimate IE6 cheatsheet
    Ultimate IE6 cheatsheet
    Fixing IE6 bugs can be really annoying. I found this website few months ago when I was looking for the flickering background solution. I like it because it basically documented most of the IE6 bugs and solutions, which can be really handy if you know what you want. I hope I don't have to visit this website next year.
  • Firebug Lite
    Firebug Lite
    Firebug, a extremely useful tool for web developers to debug html, css layout, ajax and optimize your website. It comes out a lite version now, imagine yourself in client site, and there is no firebug install in their computer, what we going to? use Firebug Lite! It has a really handy bookmarklet that basically allow you to launch a lite version of firebug, of course with very limited capability and good enough to solve layout issues.
  • Kick Ass
    kick ass
    Haha, this is a time waster kick ass javscript bookmarklet that allow you to turn the entire web page into a game of Asteroids, destroy the div, paragraph and mess up the layout. It would be really funny if your client ask you to remove a DIV and you launch the space ship and blow it up right in front of them. Just kidding, be professional. Oh yea, just like the website says, "it’s cooler if you make your own sound effects."
Join the discussion

Comments will be moderated and rel="nofollow" will be added to all links. You can wrap your coding with [code][/code] to make use of built-in syntax highlighter.

8 comments
Gaylord 6 years ago
Totally useless list. You just wasted 5 minutes of my life. I should have known it: All good lists are 10+, "nobody does it in 6".
Reply
Kian Ann 6 years ago
Thanks for reminding me of flowplayer - am building a video site now and I guess this player will really come in handy!
Reply
Karen Cayamanda 6 years ago
Those are all must-have tools for every web designer. Anything the democratizes the process and makes it easier is a welcome development in the industry.
Reply
james 6 years ago
Great sharing! thanks.
Reply
tribal 6 years ago
awesome!
Reply
conflict 6 years ago
Realy enjoyed the site and all this great things u have here keep it up
Reply