Oh, it's your first website. I was about to go in guns blazing, haha. Now I get to be all "helpful" and whatnot. So I'm gonna skip my usual style, and start with design basics again.
(note to self - write a post on this so I can just link to it in the future...) So your design isn't bad, compared to some newbie attempts. The link colors on this page (
http://www.mobile-settlements.com/MSS_sitemap.htm) work very well, and you should consider keeping them for your color scheme, which is where I'll start.
Color Scheme
Color Schemes are one of the main elements (and the most important in my opinion) of web design. In my personal method, I make a logo (I'll talk about that later) and then use the colors from that to generate my scheme. You can go about it various ways, but basically it comes down to this:
1. Pick a base color.
2. Decide on contrast, complimentary, or monotone.
3. Now pick your other colors (maybe 5 extra)
4. Give each color a function in your design.
5. Add "polish" with matching graphics in your color scheme.
What I use to help me with my colors (because I'm not a HEX coloring genious) is
http://chir.ag/phernalia/name-that-color/. It helps you with shades, and assigns the colors names, which makes it easier to remember what color you were using.
Color Theory
Every website has a niche, and every niche develops its own color scheme. I don't know much about home improvement websites, but lowes goes for blue, and home depot goes for orange, and then nurseries have greens, so I suppose any colors in that range might work out fine?
You're going for brick and mortar, so you're in a touchy area. Bricks are generally red, and red is the easiest color to see. This means if you use too much of it, or have big areas of it, it will kill your visitors eyes. A few ideas:
1. Actual bricks aren't as taxing of a red, so use patterns.
2. Use the "gravel" approach. Not all bricks are red, and there's nothing wrong with a gray scale site with some red accents.
3. Use red here and there, as a complimentary or accent color.
Structure
A few basics for structure. All of your elements should be inline, as if on a grid. (see grid based design:
http://www.smashingmagazine.com/2007...ased-approach/) Once they all line up reasonably well, and each piece of content is assigned an area, then you can begin working on breaking the grid, and exploring experimental design. A few tips for structure creation:
1. Websites are usually centered, unless you put a design or navigation on the side.
2. All websites have a clearly presented footer. This is what ultimately ties the whole page together with the background and logo (or header, there's a difference!) so you should put as much work into this as into the top.
3. Each element of your structure should have a color assigned (and in more advanced approaches: it's own typography. In even more advanced approaches, it's own color scheme!)
Logos And Banners (Headers)
Logos and banners are different. Generally, forums and fan-sights have banners. These are graphics that probably using already licensed images, or that are much too complex to warrant branding. Some examples of banners:
http://www.supersophomore.com (uses a banner because snoopy is a licensed image)
http://www.squawkdesign.com/weblog (uses a header, no obvious branding, and it's complex)
http://www.blabolnik.cz/ (uses a header)
Logos are simpler, and used to recognizes companies/individuals/brand names. They're used for branding your content. Some examples of logos are:
Webmaster-Talk's logo.
http://www.papelcontinuo.net/
http://www.problogger.net
Think of it this way, what can you put on a T-shirt? Now, don't fool yourself thinking it's one or the other. Once you get better, you can use both!
http://www.elitistsnob.com/
http://www.therissingtonpodcast.co.uk/
http://www.schneeballschl8.de/
Quick note: I'm not gonna go into backgrounds right now, but I can expand on those as well if you'd like.
Packaging
Usually, for beginners, this entails learning how to use borders around boxes. However, once you start to become confident in your abilities, there are plenty of cool things you can do to "package" elements of your content. A quick example of what I mean could be date boxes on blogs. Check out smashing's compilation. (
http://www.smashingmagazine.com/2008...and-calendars/)
Whew! Okay, if you want me to expand on content, let me know, but there's a quick lesson on designing web pages.
