77 Resources to Simplify Your Life as a Web DesignerPublished in Design
As a web designer, achieving efficiency in your workflow will have a significant impact on your success. Fortunately, there are a number of great resources that have been created with the intent of making your life easier and your work quicker and more effective.
Choosing the right color combination can be a difficult task. Try some of these tools to make it an easier decision.
For more color-related tools, see Find the Perfect Colors for Your Website.
Free CSS Navigation Menus
CSS-based navigation menus are used by most websites now, but they don’t need to be created from scratch. There are hundreds of menus already created and available for your use. You can use them as is, or customize them to meet your needs and match your website.
DHTML Navigation Menus
Xtreeme DHTML Menu Studio is a great tool for quickly creating dynamic navigation menus (cost: $49).
Photos for Your Website
Quality images greatly enhance the look and appearance of a website. You can find photos for free or buy higher quality photos for as little as $1.
- Stock.Xchng – free stock photos.
- Stock Expert – Low cost stock photography.
- iStockphoto – Low cost stock photography.
- Big Stock Photo – Low cost stock photography.
Blank WordPress Templates
If you design WordPress themes you can save yourself a lot of time by downloading these blank themes (from Tomorrow’s Laundry). The blank themes provide you with a very basic starting point to work from (UPDATE: the link has been removed because this site is no longer available).
CSS-Based Design Templates
You may be able to save time by starting with a basic CSS-based template. Most websites are built off a one of several different layouts that can be started from a template.
- Layout-O-Matic – A tool that lets you create your own CSS-based template.
- CSS Creator – CSS layout generator.
- Layout Gala – Collection of templates.
- Open Designs – Open source templates.
- Open Source Templates – More open source templates.
Eric Meyer’s CSS Sculptor
One of the leading CSS designers has created CSS Sculptor to speed up the creation of CSS-based layouts. If you design a lot of websites this $149 software may be very helpful.
Dead Links Checker
Dead links are extremely frustrating to visitors, but checking them manually is not realistic. These tools will do it for you.
Testing in Multiple Browsers
Adequate testing is a part of the design process, and unfortunately that means testing in a variety of browsers.
For more information on this subject see Effectively Testing Your Website in Multiple Browsers.
Valid code is generally more accessible and it should be one of the first things you test when you encounter a problem.
There’s no need to re-invent the wheel. Save yourself some time by using free scripts that others have created.
- PHP Freaks
- PHP Open Source Scripts
Favicons are very popular right now, and they don’t have to be difficult to create. Try these free tools to create your own and help brand your website.
- Dynamic Drive
- Favicon from Pictures
- Favicons with text instead of images
- Graphics Guru
Typography and fonts can make or break a design, but it can be time consuming to try a number of different options. Try some of these resources.
- 80 Beautiful Typefaces for Professional Design (Smashing Magazine)
- Urban Fonts
- 1001 Free Fonts
Web 2.0 Tools
Most of the modern web 2.0 and social media sites have several design features in common. Help to make your designs look more modern by incorporating some of these design tools.
Buttons are everywhere. Easily and quickly create your own buttons with these tools.
Gradient Image Tools
Gradient images are another staple of web 2.0. If you don’t have Photoshop there are some other ways to create gradients.
Rounded Corner Boxes
Creating boxes with rounded corners is easy when you have the right tools.
CSS Speech Bubbles
Speech bubbles will give comments and quotes some variety and add to your design.
If you’re looking to clean, optimize and compress your CSS code, here are some choices.
- CSS Tidy – a CSS parser and optimizer.
- Clean CSS – a CSS optimizer and formatter.
- CSS Optimizer
- CSS Analyzer – a validator plus.
- CSS Mate – online CSS editor.
- CSS Compressor
- Web Host Uploader – A simple FTP tool that eliminates the need to manually upload changes with an FTP client. This tool uploads changes with a single click.
- Web Standards Checklist from Max Design.
- Web Developer Firefox Add-On – Adds a toolbar with a number of features and web developer tools.