Nonprofit Front Page Draft

Good start, here are a few points I've picked up on, hope they help!

• The primary market for this is donors, make that donate button bigger and more prominent. It's not just the colour that matters, it's also positioning. There's a big blank space beneath that large image that could fit a nice big attention grabbing donate button.
• Stick with one alignment. If your content paragraphs are left aligned, leave the titles left aligned as well.
• I'm not sure about the guy in the image. I'm not sure if that's an image of the guy who provided the quote, or just something you've taken from a stock photo website, but he doesn't look like he's happy. 'Centerforce gave my sister hope when she was in prison, I'm really pleased about this, thank you Centerforce!' At the moment it looks like he's staring at the user with contempt. It also looks a bit too stock to me, which could potentially undermine the quote. If the image is stock, is the quote real?
• The grey background is a bit basic, spice it up a bit, either a gradient, pattern or image. Also is there any reason for the light grey bars above and below?
• The way the site carries on after the footer looks a bit pointless. I like it, it balances the page out, but maybe find some very simple use for it. eg. a centered light grey copyright notice?
• Consider the sizes of margins and padding and try to keep them equal and consistent. On the two column section the padding is bigger on the left side than it is on the right. Also the left hand column has more left padding than the right column.

Other than these points, it's a good start, and has good potential. Hope some of my ideas help :)

(Edit: Not sure why my Purpose, Originality and Engagement are coming up as zero, think that may be a bug with CF!)

Hey Josh, overall I like the colors and the originality. It's dealing with a serious issue but not being too somber about it.

It's feeling a bit left heavy to me and I'd be curious how you see this working on wider screens. I suggest always designing for a 1024px viewing window while ensuring the design left and right expands to at least 1400 or even 1500px. It's a bit boxy right now, but maybe how you handle wider screens will solve this. It's tough to tell right now

My second point would be the typography being used. Google has released a new Font API that's free and super easy to use. There is a font that looks a lot like what you used up in the two upper level buttons that you could bring into your h1 and h2 tags to help the titles not feel so clunky and really take this up a notch

I'd also rethink the footer bar with the white underneath it. It's a bit of an awkward way to complete the site. Maybe allow the orange to continue down?

May good points made already, just wanted to add that I also did not spot the Donate button at all. Not because of its color, but because of its placement.

I think this is a really good start. First impressions are that the colours and structure work well. However I think there are a lot of small areas that could be tidied up.

Working from top to bottom

• The donate button doesn't look very buttony. I would give it a bit of a border, and add some 3dness to make it stand out more. Also strengthen the call to action. Adding now would help - Donate Now! sounds a lot more urgent, and is more of a command than a suggestion.
• I would make the tagline a lot shorter, and move it up into the white header area with the logo. You need to make it obvious what the site is for
• A bit more margin around the image in the blog would help add breathing room
• I wouldn't center align any text. Make it all left aligned so that it's consistant and structured
• Look at your margins and padding. Keep the vertical lines going. For instance the horizontal margin on the website tag line is not the same as the one on the blog or articles below. Also the margin on the left side of the Children & Family article column does not match the margins on the peer education article column
• The footer needs some more breathing room above the links, and between the links.
• Choose uppercase or lowercase for the navigation. Looks a bit funny having one in the header and the other in the footer.
• I like the large image on the left and don't think you need to fill the space underneath. There's nothing wrong with a bit of white space :)

Hi Josh,

This is a good start and i only have a few points to pick up on.

1. The Orange pixel border on the left is too overpowering, it looks like it is cutting the left half of that picture off...
2. The color orange throughout the page need to have some consistency - If the "make a difference" at the top of the page is a button then it doesnt look like one, as with the "Donate" button.
3. The Navigation should probably indicate which page you are currently on...
4. The quote on the picture is a bit meaningless without maybe a label as to who wrote it...
5. The background is a bit dark, maybe lighter tone.
6. Padding should be consistent throughout the site, where all the blocks of text should have the same padding around them.

Nothing wrong with the general layout and setup.

The "make a difference, donate" button/link I would make a bit smaller or maybe a PayPal button would be better so they can go directly to the paypal checkout page and enter an amount they wish to donate.

Menu is good and logo is pretty cool and goes with the overall design. I dont know if there is 2 much orange but it does look ok.

• Peter

SUGGESTIONS:

1) "Centerforce gave my sister hope when she was in prison"...that sounds good. But who said this? And does he have a story to that may interest the users? Then put a link for that too.

2) Also pick an image which shows more empathy...the look of this guy does not convey that he is grateful for what he says.

3) The tiled vertical strip background that you have used on the left does not go well with an organization that is improving lives of others. Put something smooth...subtle...

4) Please remove white area at the bottom of the page.

5) Your message of "We advocate on behalf of incarcenrated..." is too heavy and too long for someone to understand. Can you simplify this into a one line without using words that are difficult to understand?

6) I believe "Make a difference" on right top is just text and not a button. If that is the case then you need to differiate it...because "Donate" is a button and user may get confused with seeing both together.

7) Again you are using "donate" in menu. Why? I feel its not needed. Avoid repetition.

8) You want the users to get interested by what you right on the home page...so say what you want to say with less words. No one is going to read paragraphs on home age.

Hope this helps.

Hello Josh. I agree with the comment about the mosaic tiles on the left being too much. It initially caught my attention, but I keep focusing to the left rather than looking at any of the main content.
However I do like the logo and main image with the orange gradients. I think the following could be improved upon:

• The Donate Button doesn't look like a button way up at the top. Bring it down front and center and make it its own button.
• the footer links look a bit crowded. and I'm just curious as to why you chose all caps compared to the main nav being all lower case.
• If you're going to have a search link, maybe make it an actual search input field and place it in upper right corner of page.
• maybe change the header copy to left align rather than center align.
• For consistency, use the same font for the sub-headers that is used for "Centerforce gave my sister....."

Overall, I like this concept, it caught my eye right away. Looking forward to seeing next version of draft.

Overall this is a nice site, but here are some ways it might be made better...

The donate button is important, but it was perhaps the 7th thing that I looked at. It is also out of place because it is light blue and nothing else is. Make it bigger, more prominent and a color that is shared by other elements on the page.

The far left column and arrows in the upper left project a south west native american feel to the entire page. I think corn. Unless this project is in Arizona or New Mexico I would find more appropriate design elements.

I like the image and quote, the mission statement is also very strong and communicates the message well. The other text is hard to read and very few people will hit "read more"

I would simply remove the strange bar on the left side (it reminds me the Supercar eye), let the design flow all over the horizontal width.