12 Awesome Web Design/Development Tools You Shouldn’t Live Without

Web Design Tools
It is a great time to be a designer/developer of websites. While it is 2010 and we still don't have flying cars at least we have many great (and free) tools to hold us over until we are traveling in style like the Jetsons. Some of my favorites are the web based tools you see popping up all the time. I don't find all of them useful, there are many that make my life easier. Today I am going to run down the list of web based design and development tools I find myself using on a regular basis.

It is a great time to be a designer/developer of websites. While it is 2010 and we still don’t have flying cars at least we have many great (and free) tools to hold us over until we are traveling in style like the Jetsons. Some of my favorites are the web based tools you see popping up all the time. I don’t find all of them useful, there are many that make my life easier. Today I am going to run down the list of web based design and development tools I find myself using on a regular basis.

1. 0 to 255

This is a site that helps you find lighter and darker shades based on any color you choose. Simply enter the hex code for your preferred color and find the perfect color for that link or hover.

2. XML-Sitemaps.com

This is a very handy sitemap generator that creates ans XML sitemap you can submit to Google, Yahoo, and many other search engines.

3. resizeMyBrowser

Easily and quickly resize your browser to see how your latest design will look in a specific resolution. Has resolutions already for you to use and allows you to create your own if you don’t see the one you want.

4. Lorem Ipsum Tool

There are many Lorem Ipsum tools available but I like this one because it generates readable dummy text that I think looks more natural. You can select several different formats including the ‘Kitchen Sink’ which has several different styles.

4. WhatTheFont

This tools has saved me a lot of aggravation trying to figure what a font is. If the tools is unable to determine the font you can easily make a post in the forum where someone is sure to know.

5. W3C Markup Validation Service

Sometimes it can make your life harder but having valid code is good because it makes you look more professional and is easier for search engine spiders to crawl.

6. NameChecklist

You have the next big idea, use this tool to make sure the domain is available along with the username on popular social networking sites like Twitter in a single search.


7. BrowserShots

BrowserShots can sometimes be super slow at bringing you results but it is hard to complain since this is such a useful free tool. Of course you can get priority processing for a fee, which is worth it if you design a lot of sites.

8. gridr buildrrr

Creates a grid based on your specifications and then email it to yourself. Makes creating grids for CSS super easy.

9. LaunchList

Not only is this site a great design inspiration in and of itself it is also a very useful tool when getting ready to launch a new site.


10. RegExr

Like high voltage electricity, regular expressions can be intimidating. Use RegExr to experiment with regular expressions while not having to worry about losing your mind.

11. CSS Type Set

Simply format the text the way you want it, including font size, color, and more then paste the generated CSS into your stylesheet.  This is a great timesaver.

12. PXtoEM.com

Math is hard and thanks to PXtoEM.com you won’t have to do any when converting pixels to EMs.

There you have my list of favorite web based tools for web designers and developers. What web based tools design/development tools to you find yourself using all the time? Please share them with us in the comments.

 
Add a comment

Comments (18)

  1. tom16i Thursday - 04 / 11 / 2010 Reply
    Thanks for the list, will hopefully come in handy
    • Andy Crofford Thursday - 04 / 11 / 2010 Reply
      Thanks, I am glad you liked it. There are a lot of tools out there but I find myself using these on a regular basis.
  2. DTX Studios Thursday - 04 / 11 / 2010 Reply
    Thanks for sharing the useful list of tools. It will be really helpful.
    • Andy Crofford Thursday - 04 / 11 / 2010 Reply
      I hope these tools save you some time. Thanks for the comment.
  3. Larry Lim Thursday - 04 / 11 / 2010 Reply
    Thanks! Will be using some of these sites in the future :)
    • Andy Crofford Thursday - 04 / 11 / 2010 Reply
      Sounds good, I hope you like them and they make things easier for you.
  4. zerolux Thursday - 04 / 11 / 2010 Reply
    That 0 to 255 site is awesome, new to me. Noticed a small typo "W3C Marukup Validation Service".
    • Andy Crofford Friday - 05 / 11 / 2010 Reply
      I do not see the typo for which you speak...oh, and thanks for pointing it out.
  5. Steven Saturday - 06 / 11 / 2010 Reply
    Cool, thanks for the list - very useful.
  6. Julie Beckham Sunday - 07 / 11 / 2010 Reply
    Thanks for the heads-up! Looking forward to using the new tools, which look awesome indeed.
  7. strexy Tuesday - 09 / 11 / 2010 Reply
    Hi all, great article. Does anybody know about timesaver tools for speed up web banners creating and updating for different specifications? My team spend 70% of weekly time on web banner routinely activity. Does anybody know this tool http://www.flashbannerking.com ? Cheers, |strexy
  8. Jimbo Alba Tuesday - 09 / 11 / 2010 Reply
    Many thanks. I bookmarked almost all of them.
    • Andy Crofford Wednesday - 10 / 11 / 2010 Reply
      Good plan. I highly recommend these tools.
  9. sivakumar Wednesday - 24 / 11 / 2010 Reply
    Thanks for sharing the useful list of tools. It will be really helpful.
    • Andy Crofford Wednesday - 24 / 11 / 2010 Reply
      You are welcome. Thanks for reading TechKing.
  10. Yasir Imran Sunday - 23 / 01 / 2011 Reply
    Thank you Andy for sharing this great article, I am developer myself and I usually need few tools to improve my work. I hope PX to Em is great thing for me.
  11. Brett Widmann Monday - 07 / 02 / 2011 Reply
    These are amazing tools! I can't wait to start using them.

Add a comment