Coming to the end of a site redesign - comments appreciated

[eldad]

We going from this (http://www.bethel-clydach.co.uk/) to this (http://bethel.markbarnes.net/).

The site is not quite finished yet, but I wanted to get some feedback whilst we are still able to make some changes. Before we go live we'll remove and replace any temporary images and complete the odd empty/half-empty church. We need to upload lots of sermons. We also want to add some testimonies, but we'll probably do that later.

Some pointers to help you. (1) We're a small (40 members) UK-based church in a fairly traditional part of the country. We're deliberatly not going for high-impact, "in your face" presentation. (2) I'm the minister of the church, but I happen to enjoy dabbling in web design. I'm a firm believer in web-standards, so fully understand CSS and HTML. I have a poor knowledge of PHP. (3) The site is developed in Wordpress, based on a theme we purchased (http://essence.ithemes.com/) and modified, with a custom plugin to handle the sermons (I got someone else to write the plugin). The software I used to make my changes is Photoshop, Firebug and Notepad++. (4) I've read the tips several times (and forwarded them to others). I think they're terrific, but I don't follow them slavishly. On some things we'll perhaps agree to disagree.

Currently I'm experiencing problems on the sermons page, which makes that page very slow (approx. 30s load time). I may have fixed it by the time you look. If not please be patient. It only affects that one page.

Thanks for looking. All comments will be appreciated and useful.

Mark

[flutem3]

Hi, Mark,

I just took a quick look at the index page and have a question. Are your menus in JavaScript? If so, anyone without JavaScript enabled will not be able to read them unless you have provided another method which I don't know about. And that is certainly possible.

The navigation on our website is mostly in JavaScript. It completely disappears when someone without JavaScript looks at it. I might add that tour website looks strange without the menus...and is useless.

When I update, all the navigation will be text links.

I like the fact that you greet the person who may not have been in your church. Can you address the person who accidentally ends up on your website and knows nothing about churches at all? I am trying to figure out how best to do that on our website.

I think you have a good-looking site. And I like the faces which are greeting me instead of a church building only.

Bless you in your ministry,

Carol

[eldad]

Thanks for the comments. The menus are done almost entirely with CSS, and don't require javascript. They are stolen from this tutorial (http://htmldog.com/articles/suckerfish/dropdowns/).

[siamnaulak]

Dear Mark,

Your site is great! Thank you so much for providing that Son of Suckerfish Dropdowns (http://htmldog.com/articles/suckerfish/dropdowns/) links, this is what I needed. It is easy to understand and good.

Thanks

[StubbyD]

We going from this (http://www.bethel-clydach.co.uk/) to this (http://bethel.markbarnes.net/).

Nice one butty!
From a bach in Penybont-ar-Ogwr :)

[StubbyD]

I might add that tour website looks strange without the menus...and is useless.

I got to ask as Mark didn't .... why is it strange and useless Carol. CSS is perfectly valid as means of producing effects such as Mark has whereas javascript (as you have discovered) isn't.

The only oddness about it might be that one doesn't like the colours but ..

When I update, all the navigation will be text links.


Which is effectively what Mark has done but by using CSS one gets them to be fancier.

[eldad]

I might add that tour website looks strange without the menus...and is useless.

I got to ask as Mark didn't .... why is it strange and useless Carol.

I assumed that was a typo from Carol and she meant "our website looks strange without the menus". Her website menus were javascript only with no fall-back for non-supporting browsers, so some users could literally see no navigation at all. Strange and useless.

[flutem3]

I might add that tour website looks strange without the menus...and is useless.

I got to ask as Mark didn't .... why is it strange and useless Carol.

I assumed that was a typo from Carol and she meant "our website looks strange without the menus". Her website menus were javascript only with no fall-back for non-supporting browsers, so some users could literally see no navigation at all. Strange and useless.

Sorry about that. I meant our website. You are right...strange and useless.

I really must be dense about some of this. Are all people who build websites knowledgeable about what JavaScript does? And do they know what happens when JavaScript is disabled?

It seems to me that the WYSIWYG software programs use JavaScript for menus.

Is there a way to make a multi-layer navigation menu without the use of JavaScript? I mean like drop-down menus...fly out menus and the like. I have seen some creative menu's, but most of them are not too clear to me. The one at www.umc.org (http://www.umc.org) is an example. I can seldom find what I want to find of that website. :confused:

Carol

PS How do you create "fall-back" for people who do not have JavaScript enabled...and will they realize it is there?

[eldad]

Carol: Check the link to Suckerfish menus I gave above. That's just about the best way of doing them, but you need a reasonable understanding of CSS.

Fall back simply means that there's more than one type of technology that works. So perhaps a feature uses Javascript. If that's not supported it will automatically fall back to (say) CSS. If CSS isn't supported (for example on a mobile phone) then you fall back to standard lists markup. The user does nothing. It's all about the way you code.

The two images below show my site in a browser with javascript disabled (there's no difference) and in a text-based browser (looks ugly, but everything still works).

http://512.png.browsershots.org/aaed4dc1476bfa5c8d468bdc21c6eda1.png

http://512.png.browsershots.org/2341f871a0d8c5ebdb99076c776be99b.png

[flutem3]

Hi, Mark,

Thanks for the illustrations. I have seen the text thing before. How do people know to find it?

Mark, I hate to tell you this, but I know very little html; therefore, I don't know anything at all about CSS. I can use html "snippets" on our website, but I can write very few.

Html looks to me just about like Chinese characters do...except that I can read the words which are in-between the characters. :)

However, I do know more about html than I used to which was zero.

Carol

[eldad]

People don't find it. It's exactly the same page. The second screenshot just shows what exactly the same site looks like with the styling and images turned off.

Good web-designers always code like this. The same is true for flash. For example, on my site, the header is done in Flash. But what about people who don't have flash? Well behind the flash is an image - so if you don't have flash, you see the image.

You'll find that the more knowledge you have of HTML and CSS, the better websites you'll be able to design. Otherwise you can't do what you want to do! If you've got the time to learn, this is a good place to start: http://www.w3schools.com/html/default.asp

[flutem3]

People don't find it. It's exactly the same page. The second screenshot just shows what exactly the same site looks like with the styling and images turned off.

Well, bless my soul. I didn't know that. Live and learn. I have the W3 stuff on my desktop. I go there from time to time. I can make a <b>very</b> basic page with html...very, very basic. But it is more than I could do two months ago. I actually am try to learn a bit of it. Don't tell David. :D

I also found an excellent page on the W3 stuff on colors...check one against the other. I have that on my desktop as well. The only problem with something of that nature is that no matter how many colors they have on a list like that, they never seem to have the color a person wants. :-) And that's the truth.

Carol

[JackWolfgang]

It looks good. I have not looked at the entire site, but I'd like to make the following two suggestions:


On the our beliefs page, buy the stock photo you used instead of using the thumbnail. That way, the company won't come after you for stealing their work.
On the history page, transcribe the memorial. Most people can read faster than a speaker can speak.

[JackWolfgang]

Could you also tell us about the plugin or system you are using to create the calendar on the site?

[dnuttall]

I'm joining this fray a bit late perhaps, but after taking a short look, I wanted to comment on your banners!

The upside is you (or photographer supporting you) have a very good "eye" for composition of the photos used, although in a couple of cases I'm not too keen on allowing the text to overlay portions of faces or even the person's body when in most cases the humans are nicely positioned with respect to the text. (David may have suggestions since I believe part of his life-experience/expertise is photo-journalism, etc)

I'm about to begin brainstorming with a Baptist pastor here in San Antonio and I have just added your prototype site to the short list of examples to help him visualize what we can do, solely because I like the banners you've implemented! I think we'll be using Joomla but it's the visual effect that is worth emulating!

Thanks for sharing.

Dave Nuttall
San Antonio, Texas