Please review new vet clinic website Options Rating

[vanne]

Hi there, I have no clue what I'm doing, lol. Help me out: is this site decent and how can I improve?

Thank you in advance!

http://www.chetekvetclinic.com

[pandy]

I like it very much. Friendly colors and the information is easy to find. I especially appreciate the placement of Clinic Hours. Often you have to search for that and you've placed it in the most prominent place. Great.

Only one thing strikes me as a little odd, design-wise. The top of the page. The rather large empty area makes me think something is missing. I waited for an image to load, but there wasn't one. Maybe it's just me, but I'd either use a background image (depicting something) or reduce the height of that area.

HTML is fine too. Good use of headings and so on. But you should also make it valid.
http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

[Frederiek]

I agree with Pandy in every aspect.

And I'd add to slow down the image rotation. I know you changed it from 2,5 to 3,5 seconds (about which you asked in another thread), but I still feel it's too fast.

One nice touch could be to use a toggle mechanism (e.g. jQuery) on the FAQ page to give people a quicker view of the topics and related questions. Mind you, that's only a suggestion.

[pandy]

We agree about the slide show too. I just had time to think "oh what a cute kitty" and then it was gone when I actually wanted to take a closer look. Fast slide shows are also a little stressful, I think, no matter if you want to look at the pictures or not. Many of your visitors are probably stressed enough as it is.

[Christian J]

I've used this one: http://www.dynamicdrive.com/dynamicindex14...inslideshow.htm it fades in images, which feels more pleasant than abrupt changes, and it pauses while you hover an image.

I also agree the space above the top logo could be reduced.

[newwebseo]

I must appreciate that you have designed your site very well.
Color combination that you have used are very nice. You have done the seo very well but you should improve the title of your page.
They look simple.

Anyway you have done a great job, you have not used any high fi techniques but used the color combination very well ..

[pandy]

The title is the company name. How could that be improved? When it comes to SEO I predict this site will be very easily found with google without any gray hat tricks. Fact is, it already is. It's in third place for "veterinary Chetek". On second place is their FaceBook page. Follows directories and sites that link to them. Not much to improve.

[Darin McGrew]

The title is the company name. How could that be improved?

I think the title says almost everything that needs to be said: the location (Chetek) and what kind of business they are (a veterinary clinic). They might add the state (Wisconsin), but that mostly helps people like me who have no idea where Chetek is. There aren't a lot of cities named Chetek for search engines to get confused with. And anyone who is likely to patronize the clinic will know where Chetek is.

It might help to add the byline "50 Years of Compassionate Care" to the title. And in the page template, it might help to make that byline a heading of some sort, instead of a paragraph.

There's more info about microcontent like page titles here:
http://www.useit.com/alertbox/980906.html
(Be sure to check out the links to related resources at the bottom.)

[vanne]

Wow, that is a lot of information! Thank you!

I can slow down the slideshow. I was thinking someone would click off of the page, and if the slideshow would change right before they left it would keep their interest on the page? I'll slow it down some more in a few minutes here.

Pandy - where is the blank spot? I looked on ie and firefox, at home and work computers (different screen sizes and resolutions), but I don't see it. Is the blank on the tan background? That would be where the slideshow is. Are you seeing that? It is java, so will some people not be able to see it?

Can I put a background image in so people that can't view the slideshow still see a complete website? How would I do that?

I'm off to check out the links y'all posted.

newweb - it's simple for a reason. Small rural farming community. Fancy could bite us in the backside.

One change coming up: we have a new front entrance at the clinic. I'm going to put a photo of the entrance right under "location" on every page. Many people confuse the 2 vet clinics in town. This will hopefully cement our website with the right clinic!

[vanne]

OK... I can't make the header space shorter. I edited the images down, but the logo text is out of place. I can't find anything about vertical alignment on the page or css. I remember trying this before with no luck.

[vanne]

Working on that validating thing. Wow! Lots of typos and mistakes! I have my mistakes fixed. But there are some things in the script and iframe that I don't understand. Can someone look at this for me?

http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

[Christian J]

The empty space at the top seems to be a CSS issue: the DIV #header is 215px high, and the nested DIV #logo has a 140px top padding.

Haven't checked if changing these values will affect other things in the layout...

[Christian J]

Working on that validating thing. Wow! Lots of typos and mistakes! I have my mistakes fixed. But there are some things in the script and iframe that I don't understand. Can someone look at this for me?

http://www.htmlhelp.com/cgi-bin/validate.c...s&input=yes

Half of the errors seem to be caused by using elements and attributes not allowed in Strict XHTML1.0. Use a Transitional XHTML1.0 Doctype instead:

CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

(see also http://htmlhelp.com/faq/html/basics.html#doctype ).

Of the remaining errors:

Line 76, character 8:
<script> ^

Error: required attribute type not specified

Click on the SCRIPT link so the see correct syntax.

Line 84, character 9:
if (step<6) ^

Warning: character < is the first character of a delimiter but occurred as data

In XHTML special rules apply to that character in scripts. See https://developer.mozilla.org/en/Properly_U...XHTML_Documents

Line 197, character 12:
<li>Nights & Weekends: Emergencies Only</li> ^

Warning: character & is the first character of a delimiter but occurred as data

See http://www.htmlhelp.com/tools/validator/problems.html.en#amp

Line 221, character 10:
<a name="#Facebook"></a><iframe src="http://www.facebook.com ...
^

Error: character # is not allowed in the value of attribute name

Can't say if it hurts anything using it or removing.

Line 221, character 397:
... ht:427px;" allowTransparency="true"></iframe> ^

Error: there is no attribute allowTransparency for this element (in this HTML version)

Proprietary MSIE attribute, shouldn't hurt anything.

Line 223, character 36:
... <br /><h2>More Information</a></h2><br /> ^

Error: end tag for element a which is not open; try removing the end tag or check for improper nesting of elements

Self-explanatory...?

[vanne]

Thank you!

Somewhere in cleaning up, my slideshow stopped working. I'm using Alleycode, previewing in ie9.

I went to the live page, view source, copy/paste into new html page... slideshow doesn't work. How is that possible?

[pandy]

Pandy - where is the blank spot? I looked on ie and firefox, at home and work computers (different screen sizes and resolutions), but I don't see it. Is the blank on the tan background? That would be where the slideshow is. Are you seeing that? It is java, so will some people not be able to see it?

Not a blank spot. I meant the top sections with the green gradient. The whole section is more than twice the hight of the logo and in a wide browser window it's many times as wide. It kinda looks empty, like something is missing. I'd either fill it or reduce it.

[Christian J]

Somewhere in cleaning up, my slideshow stopped working. I'm using Alleycode, previewing in ie9.

On http://www.chetekvetclinic.com/ it's still working in my IE9.

I went to the live page, view source, copy/paste into new html page... slideshow doesn't work. How is that possible?

Impossible to say. But in general it might be a good idea to add a couple of spaces here:

CODE

<img src="images/catheader.jpg" name="slide"width="550" height="300" alt=""/>

so it looks like this:

CODE

<img src="images/catheader.jpg" name="slide" width="550" height="300" alt="" />

[Christian J]

Not a blank spot. I meant the top sections with the green gradient. The whole section is more than twice the hight of the logo and in a wide browser window it's many times as wide. It kinda looks empty, like something is missing. I'd either fill it or reduce it.

The width is fine IMO, but I'd reduce the top padding so it looks more like when you've scrolled down a little.

[vanne]

What is the value of validating and fixing the code? If the website works, what is the point?

[vanne]

christian - it fixed itself... I have no idea why, but it started working in preview and I uploaded it. Still OK. I worry about making any changes to the page. I had it go wonky on me before.

[Darin McGrew]

What is the value of validating and fixing the code? If the website works, what is the point?

Please see: Why Validate?