There are thousands of websites that offer free fonts, stock images, and a variety of other tools that can greatly simplify a web designer's everyday tasks. Today, in the first installment of an ongoing series of articles, we'll discuss several resources that can help you create a visually stunning website. These are the same sites we use every time we design a web page.
We recommend starting any new website with a black-and-white sketch of how you would like the site to look. If the site doesn't look good in black-and-white, it probably won't look good in color. An ideal layout should maximize simplicity and functionality while retaining its visual elegance.
The next step is to pick a consistent color scheme for the site. We usually try to pick one that goes with the topic of the web site - for our work on the Lopez Farm Labor Contracting site, we chose a color scheme that one would expect to see on the farm (sky blue, earth tones, and green).
In our opinion, the best tool for picking a color scheme is Color Scheme Designer 3. This site provides a traditional color wheel with presets for traditional color schemes such as complement and triad. You can drag the colors around and the corresponding complementary colors are selected. You can also adjust the colors by brightness and hue, or input an existing color by hex value. The site allows you to output the color scheme to a web page or Photoshop palette.
After your color layout is perfected, the next step is to find some good stock photos for the background if you do not already have one. Again, these photos should be relevant to theme of the site and match the site's color scheme (our Lopez Farm Labor site uses a farm field with a very blue sky as the background). We usually use Stock.xchng to find free stock photos, and move on to Morgue File if we cannot find the right image. Stock.xchng requires a free registration while Morgue File does not. Either way, you'll probably want to crop, resize, and optimize any photos you download for the web if they are going to be used as a background image.
Although not required, you can create eye-catching variety by choosing one or more custom fonts for your site. They can be applied to images with text in them, or to headings or other text in the page if you use CSS3 or sIFR for font replacement (we do not recommend sIFR, as it makes your site less accessible to search engines). Our best script fonts favorite sites for finding free fonts are Da Font and 1001 Fonts. Both sites offer a variety of different fonts, but some are only free for personal use or have other strings attached, so be sure to check if you plan on using them for a commercial web site. Either way, be sure to pick a font that is consistent with the look and feel of your website.
