200+ Resources for Freelance Web Designers

Posted by Steven Snell

Most
freelance designers use an impressive number of tools and resources in
their daily and weekly lives. After all, they have to deal with the
design and development as well as all of the aspects of running a
business. I've decided to create a large list to clump as many
resources as possible all in one place. The post is broken down into two major sections, business resources and design/development resources,
and tons of smaller sections. I hope it can be helpful for you. Of
course, this is not by any means an all-inclusive list, so feel free to
ad some of your favorite resources in the comments.

Business Resources

Become more efficient and more take better care of your business with these resources.

Invoicing:

Whether
we like it or not, being a freelancer involves dealing with sending
invoices and collecting payments. As you can see, there are plenty of
choices to help you get organized with this task. Some are free, some
aren't, but most have free options or trial periods so you can see how
you like it before paying anything.

FreshBooks - Very popular choice. They have a free option as well as a paid option.

Billing Manager - From the makers of QuickBooks, Quicken, and TurboTax.

Zoho - Handles invoices and quotes, manage payments, work with multiple currencies, create reports and more.

Simply Invoices -
Several different pricing plans based on the number or templates you
need, plus the ability to use a customized logo. Free option is
included.

Invoice Place - Easy Invoicing And Quotes

Blinksale - Offers free and paid options according to how many invoices you need to send each month.

Invotrak - Easy invoice and time tracking.

Invoices Made Easy - Send invoices and accept online payments. 30 day free trial.

Bill My Clients - Send invoices via email or regular mail.

Billing Orchard - Maintains hourly time billing, along with flat fee and recurring billing. Starts at $14.95 per month.

SimplyBill - Aims to make invoicing simple. Free trial offered.

Time:59 - Time and expense tracking, online invoicing, and more.

Bill4Time - Web-based time billing and project management. Free trial offered.

Pay Simple - ACH processing and merchant account services.

Cashboard - Free estimate, invoicing and time tracking software.

Invoice2Go - Over 300 ready-made form designs.

Invoice Creator for Excel - Another option is to create your own invoices in Excel.

Free Invoice Templates for Excel - Some basic templates.

Finances and Accounting:

Invoicing
isn't the only dreaded financial task for freelancers. These resources
will go a step further than creating invoices, they'll help you to
manage your finances more effectively.

Less Accounting - Invoices and a simple accounting system created for freelancers.

QuickBooks Online - Online version of popular software.

Xero
- An online accounting system that gives you and your advisors easy
access to your most up-to-date financial figures – bank transactions,
invoices, GST – anytime you need it, from anywhere in the world.

WORKetc
- Are you using one application to record time? Another application to
manage projects, another application to share documents and more
applications all in the name of efficiency? Consolidate all your apps
into WORKetc.

Accepting Payment:

Many of your clients may prefer to pay via credit card. You don't need an expensive merchant account to accept these payments.

PayPal - The leading choice for online payments.

Google Checkout - A PayPal alternative.

Contact Management:

As
a freelancer you will come in contact with a lot of potential clients
as well as other service providers. Keeping everything straight can be
a challenge.

Big Contacts - A web-based tool to help you to organize all of the information and activity about the people you work with and live with.

Highrise - Track contacts, leads, customers, vendors, and others with Highrise.

Zoho CRM - Complete relationship lifecycle management solution for managing sales, marketing, customer support & service.

Finding Freelance Work:

These are some of the best places online to find and bid on freelance work (not all of them are bidding-style sites).

Elance - The largest site for bidding on work.

Guru - Currently more than 5,00o projects to bid on.

oDesk - Find and apply for work.

Get a Freelancer - Not as many listings as some of the others, but still a good resource.

Smashing Jobs - Job board from Smashing Magazine

Freelance Switch Job Board - Leading freelance blog has a great job board.

Time Management Tools:

Freelancers
often struggle with managing their time effectively. Better time
management will mean more productive days and more income or less hours
worked. These tools can help.

Google Calendar - Keep track of your appointments and deadlines.

Backpack - Calendar, small business organizer, to-do lists, and more.

Ta-da Lists - Simple tool for creating and managing to-do lists.

RescueTime - Web-based time management and analytics tool for knowledge workers who want to be more productive.

Tick - A simple and friendly time tracking application focused on helping you hit your budgets.

Slim Timer - Create tasks, track your time, and run reports.

Harvest
- Track time, log expenses, invoice clients, keep track of account
receivables and revenue. Harvest lets you do it all, so you can run
your business with style and ease.

Dejal Time Out - A break-reminder tool.

Jott - Converts your voice into emails, text messages, reminders, lists and appointments.

Project Management Tools:

Sometimes freelancers will be working with others and may benefit from some assistance with project management.

Basecamp - A tool for collaborating on internal or client projects.

Project2Manage - A free hosted project management solution that virtually anyone can use.

Document Storage:

You may need to store some of your documents online. Here are some great options.

Google Docs - Create and store docs.

Zoho Writer - Online word processor with sharing capabilities.

Box.net - Online file storage.

Xdrive - 5 GB of free storage.

DivShare - Also 5 GB of free storage.

Hard Drive Backup:

Security
is important to every freelancer for obvious reasons. Avoid losing your
work by using any of these automated backup tools.

Mozy - A few different types of accounts offered. Mozy is my personal choice.

First Backup - Prices start at $5 per month and go up from there.

Intronis - Home and Business options. Prices start uner $10 per month.

Carbonite - Similar services to the others for $50 per year.

Communication:

Freelancers
will need to communicate with clients and other freelancers. These
tools can help for phone calls and video conferencing.

Skype - Leading choice for making calls from your computer.

Vonage - a leading provider of broadband telephone services

Gizmo5 - Save up to 98% on international calls from your computer or mobile phone.

Yugma - Free online video conferencing.

VoipStunt - Based in Germany.

Design and Development Resources

Use some of these tools to help you create more attractive, more effective websites.

Typography and Fonts:

Of
course, one of the most important elements in design is typography.
These resources can help you find the perfect choice for your next
design (or maybe they'll keep you up all night looking at all of your
options).

80 Beautiful Typefaces for Professional Design from Smashing Magazine.

40+ Free Fonts for Professional Design from Smashing Magazine.

101 Typography Resources for Web Designers from Vandelay Design.

Dafont - One of the leading sites for free fonts.

Urban Fonts - Another leading source for free fonts.

Better Fonts - Over 10,000 fonts for download.

TypeTester - Compare fonts on screen.

Font Tester - View and compare fonts easily.

What the Font? - Upload a file and it will identify the font.

CSS Menus:

Navigation
is not only a critical element of design, but it is also an area that
is often used to create a more visually-appealing design. While you can
always create your own menus from scratch, there are plenty of free
scripts that can save you some time or at least give you a starting
point that you can customize.

Listamatic - A nice, big collection of scripts to choose from.

Dynamic Drive - Another solid collection.

Alvit.de - Several choices from Vitaly Friedman.

Exploding Boy - A nice collection of horizontal tabbed menus.

CSS Play - Another collection of menus.

List-O-Matic - Tool for creating your own menus.

CSS Menu Generator - From Webmaster Toolkit.

Tabs Generator - Create tabbed navigation.

Color Tools:

Finding
the right color scheme can be one of the biggest challenges when
designing a site. The tools listed here can help you in a variety of
different ways to find the right color combination quickly.

ColorSchemer Gallery - Color palettes.

COLOURlovers - Color palettes and more.

Kuler - Adobe's resource for helping you with color palettes,

ColorJack Sphere - A pretty cool resource for exploring color combinations.

DeGraeve Color Palette Generator - Get Colors from a picture.

WhatItsColor - Find the colors of a picture.

I Like Your Colors - Get the colors of a web page.

Colour Tools, Palettes, Schemes and Theory - A more complete list from David Airey.

Layouts:

The
resources listed here may be able to help you save some time in
development by giving you a starting point that you can work from.

Blueprint CSS - CSS framework from Google.

CSS Creator - Quickly creates a layout for you.

Layout Gala - Collection of 40 CSS layouts.

DynamicDrive - 12 CSS layouts.

Intensivstation - 16 CSS-based layouts.

Layout Reservoir - 3 basic layouts.

Code Sucks - Over 90 layouts.

Generators:

Here
we have a collection of various generators that will give you some cool
things that you can use at your sites for different purposes.

Stripe Generator - Create background images with stripes.

Web 2.0 Badges - Easily and quickly create a web 2.0 style badge.

RoundedCornr - Rounded corner and gradient generator.

ThrashBox - A semantically correct CSS Box.

Spiffy Box - Simple rounded corner CSS boxes made easy.

Web 2.0 Logo Creator - Easily create your own logo.

Gradient Image Maker - From Dynamic Drive.

Favicon Generator - From Dynamic Drive.

Button Maker - From Dynamic Drive.

Button Maker - From Adam Kalsey.

CSS Sprite Generator - From Website Performance.

Lorum Ipsum - The best tool for creating dummy text.

Stock Photography:

The
choice and quality of images will have a huge impact on your end
result. Here are some places to find free or low cost photos and
graphics. Even those that are not free are very reasonably-priced, and
they'll usually save you some time as compared to browsing through the
free sites looking for something of quality.

iStockphoto - The leading choice for low-cost photos.

Stock Xpert - Low cost stock images.

Big Stock Photo - Low cost stock images.

Stock Xchng - Huge site of free photos.

Flickr - Creative Commons section is a great source for designers and bloggers.

Vector Stock - Purchase stock vector images.

Vecteezy - Vectors for download (not really stock photos).

Icons:

There are tons of free icons available. Here are some of the best, and some places to help you find others.

96 of the Best Ever Free Icon Sets - This roundup from Specky Boy is about all you need.

Icon Finder - Icon search engine.

FamFamFam - Some of the best free icons.

Feed Icons - The standard RSS icons.

Web 2.0 Icons - UtomBox provides icons for common web 2.0 purposes.

Validators:

Validators can be great for creating more accessible sites and for finding some coding mistakes.

HTML - From W3C.

CSS - From W3C.

RSS and Atom - From W3C.

CSS Tools/Resources:

Stylesheets can easily become overgrown or messy. These tools will help to get your CSS cleaned up and optimally-sized.

CSS Tidy - A parser and optimizer.

Clean CSS - Optimizer and formatter.

CSS Analyzer - A validator plus.

CSS Mate - Online CSS editor.

CSS Compressor - From CSS Drive.

Browser Add-Ons:

Free
browser add-ons can often save loads of time and sometimes perform the
actions of a standalone program. Here are some of the best.

Web Developer Toolbar for Firefox - Adds a menu and a toolbar with various web developer tools.

Firebug for Friefox
- 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

Internet Explorer Developer Toolbar - Provides a variety of tools for quickly creating, understanding, and troubleshooting Web pages.

FireFTP - An FTP client within Firefox.

Dust-Me Selectors - Finds unused selectors.

Load Time Analyzer - Firefox add-on for testing page loads.

Firebug - Popular Firefox add-on for editing, debugging, and monitoring CSS, HTML, and JavaScript live in any web page.

EditCSS - Allows you to edit the stylesheet right in your sidebar.

YSlow - Another popular Firefox add-on that can help you to build faster pages.

Internet Explorer Developer Toolbar - Variety of tools for working in IE.

DebugBar - A variery of tools for debugging.

Tools for Building Grids:

These tools can help you to build a grid-based layout quickly and efficiently.

CSS Grid Builder - From Yahoo!

Blueprint - A CSS framework from Google.

960 Grid System
- The 960 Grid System is an effort to streamline web development
workflow by providing commonly used dimensions, based on a width of 960
pixels.

Grid Designer 2 - A simple, helpful tool for building grids.

Grid Calculator - Another easy way to quickly create grids.

Coding Resources:

This
section is kind of random, but it includes a number of tools and
resources that can help you with some aspect of coding a website.

Snipplr
- Snipplr is a public source code repository that gives you a place to
store and organize all the little pieces of code that you use each day.
Best of all, it lets you share your code snippets with other coders and
designers.

AJAX, DHTML, and JavaScript Libraries - Smashing Magazine's extensive list of over 60 Ajax, Javascript and DHTML libraries.

80+ AJAX Solutions for Professional Coding - Another huge and helpful list from Smashing Magazine.

jQuery
- A fast, concise, JavaScript Library that simplifies how you traverse
HTML documents, handle events, perform animations, and add Ajax
interactions to your web pages.

Subversion - Version control system.

Screenshots:

Here are a few tools that can make life easier if you're looking to get a lot of screenshots.

Super Screenshot! - Enter a URL and get a screenshot.

Screengrab! Firefox Add-on - Easy tool for Firefox users to get screenshots.

Better Screenshots - For Windows. Several features, costs $15.

Statistics and Analysis:

Every website needs some type of statistical analysis. There are countless options, but some of the best are listed here.

Google Analytics - Leading analytics tool.

Clicky - Paid option that provides some different features than Google Analytics.

Mint - Helps you identify where the most interest is being generated and over what.

ClickHeat - ClickHeat is a visual heatmap of clicks on a HTML page, showing hot and cold click zones.

Crazy Egg - Create tests to figure out what people are doing on your website.

clickdensity - Real-time user behavior analysis.

SEO Tools:

Building search engine-friendly sites should be a goal of every designer. There are tons of tools out there to help with SEO.

Google Webmaster Tools - A variety of tools that help you to understand how Google sees your site.

Dead-Links.com - Enter your URL and it will check for dead links.

Spider Simulator - Tests your page's ability to be crawled.

Search Engine Rankings Checker - See your rankings for a particular phrase in a few major search engines.

Rank Checker Firefox Add-on - Aaron Wall's helpful add-on for watching your rankings efficiently.

WordTracker - Leading keyword tool.

Online SEO Tools - The Ultimate Collection - Nice, comprehensive list from Search Engine Journal.

Content Management:

More
and more websites are being built on some of the most popular CMS's.
You've got lots of options and plenty of ways you can improve your
clients' sites with these.

WordPress - The most popular open source platform, particularly popular for blogs.

Joomla! - Joomla! is one of the most powerful Open Source Content Management Systems

Drupal - Also open source, Drupal supports a variety of websites ranging from personal weblogs to large community-driven websites.

Expression Engine - Flexible, feature-rich content management system.

Pligg - An open source CMS that's popular for social media sites.

Textpattern - Another open-source option.

Source Code Editors:

There
are a variety of different types of source code editors and each has
it's own set of features. This is a short list of what's available.

Coda - Popular choice from Panic.

Aptana - Develop and deploy Web applications with ease - for AJAX, Ruby on Rails, PHP and more.

TextMate - TextMate brings Apple's approach to operating systems into the world of text editors.

UltraEdit - Text, HTML and HEX editor, and an advanced PHP, Perl, Java and JavaScript editor for programmers.

Komodo Edit - A free, open source editor from dynamic language experts.

BBEdit - Professional HTML and text editor for Mac users.

EditPlus - A text editor, HTML editor and programmers editor for Windows.

TopStyle - Edit XHTML, HTML and CSS (Windows).

CSS Editors:

You may find that your stylesheets are kept cleaner or more efficient with an editor. If so, try one of these.

CSS Vista
- A free Windows application for web developers which lets you edit
your CSS code live in both Internet Explorer and Firefox simultaneously.

CSSEdit - Real-time styling of absolutely any web page (Mac).

Style Master - From beginner to expert, Style Master will make working with CSS more efficient, more productive, and more enjoyable.

Rapid CSS 2008 - Quickly and easily create and edit cascading style sheets of any size and complexity.

Eric Meyer's CSS Sculptor - A Dreamweaver extension.

WYSIWYG Editors:

Some
designers love WYSIWYG editors while others hate them . If you're going
to use one, try to stick to the more professional options and get used
to working with the code as well so that you can be sure you know what
code is being created. They can save you a good bit of time in many
cases.

Dreamweaver - The most popular choice.

Expression - Microsoft's competitor to Dreamweaver.

RapidWeaver - For creating websites on the Mac.

Backgrounds and Textures:

Background
images and repeating patterns/images can help you to create the look
you want. FOrtunately, there are some tools and resources that can
spare you the need to create them from scratch.

BgPatterns - A handy and simple tool for quickly creating patterened backgrounds.

TextureKing - Free stock textures.

Stripe Generator - Easy striped backgrounds.

Grunge Textures - More free stock textutres.

400+ High-Quality Patterns - Useful list put together by Design Reviver.

300+ Vintage Style Textures and Photoshop Brushes - Another list from Design Reviver.

Free High Res Grungy Paper Textures - Excellent giveaway from Bittbox.

Ornate, Floral, Swirly and Curly Vector Roundup - A list with some nice options for backgrounds.

COLOURlovers - The pattern section at COLOURlovers.

36 Cool Free Textures - Nice collection from Abduzeedo.

CSS Galleries:

If
I listed all of the galleries here this post would be even longer than
it already is. Instead, I'll point you to a few resources that will
help you find what you're looking for.

Ranking 80 of the Top CSS Galleries - A list that gives some detail like Alexa rank and frequency of posts (a few months old).

The Ultimate Web Design Gallery Resource - Lots of info on the galleries.

Inspiration Overload: 100 Galleries You Need to Check Out - Lists galleries by category.

The Great Web Design Gallery Roundup - Great for comparing the galleries.

Forums:

If
you're looking for an answer to a question or just looking to interect
with some other designers, here are some of the more active forums to
visit.

Webmaster-Talk - Coding, design, SEO, hosting, etc.

SitePoint - Popular forum with lots of topics.

WordPress - Get support from the WP forum.

Digital Point - Internet marketing and SEO.

DesignersTalk - Primarily focused on design with a few additional topics like advertising and SEO.

Web Design Forum - Variety of different topics from design to affiliate maketing.

TalkFreelance - Topics relevant to freelancers.

Photo Editing/Graphic Design:

Photo editing and graphics are obviosly a big part of design. Here is a short list of the leading programs.

Photoshop - Adobe's market leader.

Illustrator -Leading Adobe product for illustrations.

Photoshop Express - Free online version of Photoshop.

Picnik - Free online tool with a good number of features.

GIMP - A popular and free option.

Aviary - A suit of tools including photo editing.

Fireworks - Another Adobe program, formerly from Macromedia.

Other:

Here are a few resources that didn't fit perfectly into another category.

YouSendIt - Securely deliver large files.

Brusheezy - Photoshop brushes for download.

Will Mayo - Add speach bubbles to blockquotes or blog comments.

Bubblesnaps - Add speach bubbles to your photos.

Originally Published July 29th, 2008