There's nothing like a fresh, clean sheet of screen to design, huh? If you're like most "non-designers" that fresh, clean screen can become like your worst nightmare! Where to start? The Non-Designer's Web Book: An Easy Guide to Creating, Designing, and Posting Your Own Web Site by Robin Williams and John Tollet is for everyone without a design degree in school. What you don't know can hurt you!
If you want some online guidance that matches some of the book, look no further than "ratz cafe," a clever design and tutorial cafe. This book is comprehensive and assumes you know nothing to very little. But unless you're by trade a web designer, you'll find useful information here because it covers the spectrum from beginner to slightly more proficient than your average software coder. (Design and coding are two completely different ballparks.)
The top five things I learned from this invaluable source of information from excellent designers:
- On Google, a more effective search can be accomplished by going to "Google Directory" where you can search by topic. But if you want a really good search, read the directions at the Google Help Center: Basics of Search and Advanced Search Tips. Amazing.
- A good browser like Mozilla Firefox helps with design. Best yet - it's free! They have a web development add-on package that has proved invaluable. And another blogger, Christopher Heng, has written a tutorial to use the free Mozilla Composer for creating websites. One of the hardest parts of website design is that different browsers (Internet Explorer, Safari, Netscape, Firefox, etc.) interpret code differently, thus creating a different website appearance (or breaking your nice appearance). It's important to test your site in multiple browsers before launching.
- Typography. This blog uses "Trebuchet" - which is one example of a "sans-serif" font (aka letter). "Sans" means "without" and it is without the serif (or closing marks at the end of lines). Typically, headlines use a different type of font - "serif." However, on the web, a sans serif for the body text is crucial. It affects our ability to read and not get frustrated trying to read. The screen greatly affects how our brain processes images - fonts being one of those images. Arial is a common sans serif font. It's important to use a common font, as people must have that font on their own computer (without special coding tricks).
- I learned about alignment. Any really good template will be especially careful about alignment. That's why some of the open source cms templating systems are frustrating, although they are improving (in my humble opinion). The open source templates often leave gaps or spaces through their css coding that doesn't allow for proper alignment. Imagine a ruler from every edge on your webpage - down and across text, images, columns, headers. It should neatly align to guide the eye on a feast of discovery. There's a lot more in the book.
- You want to decide before design what the most important things are on your page! Your design revolves around "showcasing" what's most important (especially if people only stay on your site for less than one minute). There are several pieces of design that affect this one fact.
Here are the key components in the book:
- What is the web, a plug-in, a browser, and how do you do an effective web search in a browser anyway?
- The mechanics of actually making a web page
- How to organize your files so you can find them two years later
- How print vs. web affects design: planning, costs, information sharing, file size, etc.
- Basic design principles that MUST be used every time (and worth the price of the book alone)
- How to design navigation that creates flow rather than traffic jams - or worse yet clicks away from your site when people can't find stuff
- How to use color and monitor resolutions
- Understanding graphic formats and their optimal uses
- How to create typography that can be EASILY read online
- Lots of advanced tips and tricks (beyond the basics) - slicing, layers, using photoshop, rollovers, making forms, flash
- How to test your site
- How to market your site
Whew! There's a lot of great stuff in here.
<img alt="Non-Designer's Book" src="http://www.assoc-amazon.com/s/noscript?tag=sandyboone.com-20" />