Five Awesome Design Tools That Will Increase Your Productivity
Posted by admin | Posted in Design | Posted on 31-10-2008
If you are like most web designers, your daily schedule is packed from morning to night. Between communicating with prospective clients, handling work for your current clients and trying to squeeze in time to work on your own personal projects, most web designers I know wish that they could add at least a few more hours to the clock everyday. Although your days are still going to be full of work, this list of great tools can help you increase your productivity and get more work done in a shorter amount of time:
Firebug: If I had to pick one Firefox add-on that I couldn’t live without, it would have to be Firebug. There are a lot of great Firefox add-ons for designers (as you will see as you continue to go through this list), but none of them can top Firebug. For any web page, Firebug allows you to debug, edit or monitor CSS, HTML and JavaScript. Best of all, all of the work you do through Firebug is done live.
Typetester: Working with typography can be an extremely time consuming task. Fortunately, Typetester can help you cut down on the amount of time that you have to devote to this task. Typetester allows you to compare up to three different screen types at once. The Typetester website is made up of three different columns, and you can customize the type for each of the columns. In addition to picking a font, you can choose the size, leading, tracking, alignment, word space, decoration, color and background. Typetester also shows a variety of styles for each column, ranging from bold to uppercase italic to small caps italic.
View Formatted Source: Thie add-on for Firefox allows you to color-code and format source code, along with giving you the option to see the applicable CSS information for a specific element. This add-on also allows you to collapse and expand elements, such as table and span. One of the most time-saving features of this add-on is the ability to choose a block level element directly on the page that you are viewing, and then view the source of it.
Browsershots: As any designer knows all too well, checking to see if a new design is compatible across a wide variety of browsers and operating systems can be a major pain. Fortunately, the free Browsershots tool allows you to see how your website looks in multiple browsers and operating systems. Simply select the browsers in Linux, Windows, Mac OS and BSD you would like to test, and Browsershots will generate a screenshot of your website for each of those browsers.
MeasureIt: This is the perfect example of a tool that is extremely simple, but also extremely useful. With the MeasureIt add-on for Firefox, you can draw out a ruler on any web page and see the pixel height and width of the area you selected. It allows you to complete on-the-fly resizing tasks without the need to open up an additional program.
