New Design - Small Cheyenne Church - Feedback?

[sstress]

Hey guys! I was invited to Cheyenne last weekend and worshipped with the wonderful people at Calvary Baptist. I snapped some photos, and now I am developing a small website for them. I don't have direction nor content definition, so I'm starting with what I think will work, and of course, place holder content.

I was wondering if you could throw some critical/fresh feedback my way. I've been looking at it for too long and I can't "see" anymore.

Here's the comp, its just a static jpg! Thank you ahead of time! Keep in mind, its a tiny church of about 65 weekly attendees, and the content will not be super deep. However, I pray that it will grow as people come on board to add more information/photos/video!?/etc....

God bless y'all! And thank you for your help!!

http://www.firstbaptisttorrington.org/cheyenne/comp001.jpg

Michael

[JackWolfgang]

Visually looks great, but when I am designing, the first question I ask, is does it validate?

Of course, this might be a prelim design done in Photoshop, which means the first question doesn't apply (yet)...

[sstress]

Visually looks great, but when I am designing, the first question I ask, is does it validate?

Of course, this might be a prelim design done in Photoshop, which means the first question doesn't apply (yet)...

What does validate mean? And yes it is a prelim design.. just a psd saved as a jpg.

[JackWolfgang]

What does validate mean? And yes it is a prelim design.. just a psd saved as a jpg.

Validate means the HTML (HyperText Markup Language) or XHTML (eXtensible HyperText Markup Language) and the CSS (Cascading Style Sheets) are valid code per the World Wide Web Consortium, who create the standards for (X)HTML and CSS. One may validate pages using the following links:


http://validator.w3.org/ for (X)HTML
http://jigsaw.w3.org/css-validator/ for CSS


Validation is a huge first step towards cross-platform compatibility and accessibility.

However, given that what you showed us is a preliminary design in Photoshop, it can't validate yet.

[StubbyD]

Visually it looks clean and crisp - not really my thing but I like the nice touches of the spire and the sign overlapping into the surrounding framework.

The only bit I don't really like is the 'empty' field and sky section at the top - is that left that way for a masthead to be fitted in? If so ignore me, otherwise I think it requires something. Their logo, a masthead, anything would be better.

Other than that, good first shot. Now code it.

[sstress]

Ahhh yes... "validate" :) I've not heard the term before. Now I got new vocab to throw around... heheh... thanks guys! From your responses, I must believe that you think its a complex design that won't validate. Its not. Its square... if you examine the layout you can see the cut lines running in columns and rows.

Yes, I designed it so I could validate. File size is my only concern. I'll optimize it as best as possible, but I think it'll work.

I was playing with the background in the header so that no matter what the screen size it'd stretch the sky/ground across the entire screen.

I'm going to use a 100% a table, bgrd the header into a repeating pattern, and then bgrd the rest of the page with the solid blue.

The rest of the page will just be a simple html cut and paste into tables.

The only bit I don't really like is the 'empty' field and sky section at the top
As for the header design..... have you ever been to Wyoming? I left it that way on purpose. There is a lot of pride here in the land, the vast endless big-sky, and the freedom that goes with the lifestyle. I think it'll work, but I'll see how the pastor responds.

Thanks for the responses! I'll let you know how it validates across platforms, browsers, etc.

Peace be with you!

[sstress]

Ok y'all... initial site is cut and coded. I only saw one validate error in Dreamweaver. Bgrd image in table wasnt compatible with older browsers < 4.0.

But, I think its safe. http://www.abcfortcollins.org/calvary/

Content is on its way, including homepage text. In the meantime, any ideas on what I should keep in mind as I continue to build this out?

Thank you all very much for your experienced feedback :)

Michael

[JackWolfgang]

Ok y'all... initial site is cut and coded. I only saw one validate error in Dreamweaver. Bgrd image in table wasnt compatible with older browsers < 4.0.

However, the official validator (http://validator.w3.org/) says there are more problems (http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fwww.abcfortcollins.org%2Fcalvary%2F) with your HTML than that. The major one is lack of alt tags on your spacer images. Spacer images should be alt tagged with an empty string as in the following example:
<img src="spacer.gif" alt="">

All other images should be given appropriate descriptions in the alt tag as in this example:
<img src="images/bottom.gif" width="773" height="116" alt="American Baptist Churches of the Rocky Mountains">

Viewing the site in Lynx (http://www.yellowpipe.com/yis/tools/lynx/lynxview.cgi) shows why this is important:

[spacer.gif] [spacer.gif] [spacer.gif]

[spacer.gif]

[nav01.jpg] [1][nav02.jpg] [2][nav03.jpg] [3][nav04.jpg]
[4][nav05.jpg] [5][nav06.jpg] [6][nav07.jpg] [7][nav08.jpg]
[8][nav09.jpg] [nav10.jpg]

[spacer.gif]

[spacer.gif] [02.jpg] [spacer.gif]
[spacer.gif]

[03.jpg] [03a.jpg] [03b.jpg]

[spacer.gif]
[spacer.gif]

[04.jpg]
[9][home_tour.jpg] Welcome to Calvary Baptist Church of Cheyenne.

In this wonderful community we are glad that you
have made the choice to get to know what God is
doing among us. We are a community of believers
who have Jesus Christ as the center of our lives,
faith, worship, and service.
[spacer.gif]
This week at Calvary Baptist Church:
- Adult Sunday School
[spacer.gif] Classes are offered for adults on Sunday mornings at 9:15
a.m.
Topics include Bible Study, Christian history and theology, or
contemporary Christian issues.
- Men's Breakfast
[spacer.gif] Saturday Dec 12, 8:00 a.m. Open to the public!

[04a.jpg]
[04_under.jpg] [05.jpg] [05a.jpg]

[06.jpg]

[spacer.gif]

[bottom.gif]

Not to mention that assigning alt tags would take care of 36 of the 37 validation failures.

[sstress]

Very cool... easy to handle. Should I ALT tag EVERY image? I mean, I have some really useless images that hold space, but they are not relevant to the information. Or should I only focus on relevant images?

Thank you again for that run through! Thats a real help and lets me know that I'm doing ok with the code.

[mickmel]

Should I ALT tag EVERY image?
Yes.

I think it's a beautiful design. However, don't have the focus of the site be a building - have it focus on people. (blog post of mine about this subject (http://www.churchwebsitehelp.com/20061215/show-people-not-buildings/))

Also, why is the location information at the bottom buried in an image? Make it plain text so the search engines can use it to give you a bit more traffic.

[sstress]

Should I ALT tag EVERY image?
Yes.

I think it's a beautiful design. However, don't have the focus of the site be a building - have it focus on people. (blog post of mine about this subject (http://www.churchwebsitehelp.com/20061215/show-people-not-buildings/))

Also, why is the location information at the bottom buried in an image? Make it plain text so the search engines can use it to give you a bit more traffic.

I agree with the emphasis on people... that's all that a church is ;)

I guess that I typically work hard to create image galleries within the site to bring the experience to life but I've utilized the place to create local recongnition on the homepage. For some reason I've been reluctant to use a person on the homepage.. maybe it has to do with my ad agency experience with talent permissions and releases.

I really like it though. I cant imagine someone at the church wouldnt want to be part of the online mission! It wont happen on this site yet, since I dont have any available people-images to use right now, but I'm going to attack my next site design with a people approach (keep it in mind when I'm shooting my intial pics). I can see it now... very strong emotions.

Good point on the text utlization for the footer. I'll recut and get that revised soon!

Thanks a bunch!!!

[JackWolfgang]

Should I ALT tag EVERY image? I mean, I have some really useless images that hold space, but they are not relevant to the information. Or should I only focus on relevant images?

You don't have to alt tag every image, but this is what people using text browsers/screen readers can expect if you don't:

[spacer.gif] [spacer.gif] [spacer.gif]

[spacer.gif]

[nav01.jpg] [1][nav02.jpg] [2][nav03.jpg] [3][nav04.jpg]
[4][nav05.jpg] [5][nav06.jpg] [6][nav07.jpg] [7][nav08.jpg]
[8][nav09.jpg] [nav10.jpg]

[spacer.gif]

[spacer.gif] [02.jpg] [spacer.gif]
[spacer.gif]

[03.jpg] [03a.jpg] [03b.jpg]

[spacer.gif]
[spacer.gif]

[04.jpg]
[9][home_tour.jpg] Welcome to Calvary Baptist Church of Cheyenne.

In this wonderful community we are glad that you
have made the choice to get to know what God is
doing among us. We are a community of believers
who have Jesus Christ as the center of our lives,
faith, worship, and service.
[spacer.gif]
This week at Calvary Baptist Church:
- Adult Sunday School
[spacer.gif] Classes are offered for adults on Sunday mornings at 9:15
a.m.
Topics include Bible Study, Christian history and theology, or
contemporary Christian issues.
- Men's Breakfast
[spacer.gif] Saturday Dec 12, 8:00 a.m. Open to the public!

[04a.jpg]
[04_under.jpg] [05.jpg] [05a.jpg]

[06.jpg]

[spacer.gif]

[bottom.gif]

If you see my post above, the spacer images get empty-string alt tags, and everything else gets a logical description.

[GuruGreg]

Should I ALT tag EVERY image?
Yes.

I think it's a beautiful design. However, don't have the focus of the site be a building - have it focus on people. (blog post of mine about this subject (http://www.churchwebsitehelp.com/20061215/show-people-not-buildings/))

Also, why is the location information at the bottom buried in an image? Make it plain text so the search engines can use it to give you a bit more traffic.

mickmel,

Interestingly enough, I had a similar post (http://www.ifjesushadawebsite.net/index.cfm/module/story/story/20060206-Three-Ways-To-Make-A-Good-First-Impression)!

Looks like we're on similar missions!

[mickmel]

Interestingly enough, I had a similar post (http://www.ifjesushadawebsite.net/index.cfm/module/story/story/20060206-Three-Ways-To-Make-A-Good-First-Impression)!

Looks like we're on similar missions!
Wow, very similar. Cool!

[sstress]

This will be the site that "greatchurchwebsites.org" built :) Great feedback.

The pastor likes the design, and I think I'll create a way to introduce "people pics" to the homepage. Maybe some photos that are a little larger that will reside in the homepage copy area will help bring emotion to the front.

I could also do some kind of layover on top of the church... that might work.

You guys rock! I'm so glad I found you! And thank you David for your efforts to bring this group together :)

[StubbyD]

Interestingly enough, I had a similar post (http://www.ifjesushadawebsite.net/index.cfm/module/story/story/20060206-Three-Ways-To-Make-A-Good-First-Impression)!

Looks like we're on similar missions!

I tried to leave a comment but I didn't want to be remembered and the website threw a wobbly because I hadn't ticked the 'remember me' box.

EDIT: Though I note the comment has taken.

[GuruGreg]

Interestingly enough, I had a similar post (http://www.ifjesushadawebsite.net/index.cfm/module/story/story/20060206-Three-Ways-To-Make-A-Good-First-Impression)!

Looks like we're on similar missions!

I tried to leave a comment but I didn't want to be remembered and the website threw a wobbly because I hadn't ticked the 'remember me' box.

EDIT: Though I note the comment has taken.

Hey, thanks for letting me know...I'll have to take a look at that. I must've missed that case when I was testing my blog software.

FYI, the 'Remember Me' box simply puts a cookie with the information entered into the name, site and e-mail fields on your computer. It then pulls the information if the cookie exists to repopulate those fields so you don't have to type them again. You can always clear the cookie in your browser as well.

[GuruGreg]

Ok, I've fixed the problem. Thanks for the help StubbyD!