9 replies [Last post]
Big G
Offline
newbie
Last seen: 14 years 40 weeks ago
Joined: 2006-04-11
Posts: 6
Points: 0

Hi,
I have just joined and I have completed my first ever website.
I have tried to do as much as possible in css but have found myself using tables where I shouldnt have.
I amshortly going to go back through the site and try to do all the pages in css. I really admire all the other sites that have asked for checking.
How do you get as good as that???
My website is at
http://www.kyotokarate.co.uk/lanfam/index.html

I have validated them and have 1 page that I know nothing about how to correct.
http://www.kyotokarate.co.uk/lanfam/producers/producers.html

It is all to do with the flash text buttons I have.

I would be really grateful for all the feedback to help me improve as as web designer.
What is the best way to go after html +css? is it asp??
I will happily take all criticism - the more the merrier
thanks for your time
Big G

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 43 weeks 3 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Site check please - first ever web site

You're trying, and getting some good results. It's nod bad for a first website; in fact it's great coding and layout, there's just a few things that scream "amateur" and could be improved:

1) The bevel border on the images. Bevel borders scream "1990s tables". For example, have a look at a default blogger template with the images here: roffles.blogspot.com - the muted color scheme and 1px solid border and padding on the images produce a much more professional look.

2) The color scheme is good, but too bright. The layout is good but a bit cramped, and the color scheme is too garish. Professional sites have a more subtle color scheme. Keep the greens, it works well, just tone down the luminous shades.

3) Font consistency. The choice of sans-serif fonts is good (the top) but the use of Times New Roman in the left is bad - change it.

4) Caps. In the middle column, the producers names are good, it's good to have them in small caps like this. However, the text underneath shouldn't be in caps.

5) Blue Link text - "more details" shouldn't be blue. Keep it as a link and underlined, but make it match the site more.

6) W3C Valid Buttons. Good to have them, bad to use the default buttons. WHen I get back from lunch I'll have a look, there's a site somewhere with thousands of different ones. They shoudl also be in the footer, not the left nav menu.

Looks like I've written a lot, and I have, but it's just small aesthetic things that pull your site down a bit. Looking good though! Laughing out loud

Verschwindende wrote:
  • CSS doesn't make pies

Big G
Offline
newbie
Last seen: 14 years 40 weeks ago
Joined: 2006-04-11
Posts: 6
Points: 0

thanks, also flash text problem solved

Thanks for the feedback.
the more the merrier.
I quickly changed a few things (from pineapplehead) still to change the links etc- had meant to do them but totally forgot. Its funny how my mind was blocking them out when I looked at them.

I finally fixed my flash text errors with some googling - it was a fluke more than brilliant coding but it works so I am happy.
Why do people bother with netscape errors when 1.25% are users?
I am still struggling with divs though as I tried to put a div in an area but I could only float it left and right but could not get it to go up or down. but i will get there hopefully.

Thanks in advance for your time
Big G

DisinfectedBarfbag
DisinfectedBarfbag's picture
Offline
Enthusiast
Kent, UK
Last seen: 39 weeks 4 hours ago
Kent, UK
Timezone: GMT+1
Joined: 2005-08-06
Posts: 411
Points: 1

Site check please - first ever web site

Hi BigG, just had a look and you have a problem with the link for Millhouse Home Bakes on http://www.kyotokarate.co.uk/lanfam/producers/producers.html. No thumbnail and the link to the 'More Details' gives a page with no info. Had a look at the source code and looks like just a simple fix :?:
Like the site Smile

Big G
Offline
newbie
Last seen: 14 years 40 weeks ago
Joined: 2006-04-11
Posts: 6
Points: 0

Site check please - first ever web site

thanks DisinfectedBarfbag
i am waiting for more people to come back to me and the ones who havent with all their info just get sent to a blank page. My fault I should have put this on the page - cheers

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 43 weeks 3 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Site check please - first ever web site

Better! I'd still change the luminous green colour on the border on the links on the left, though Wink

It's not just Netscape that breaks the Flash . . . it's hideous in Firefox too.

I suggest testing in Firefox as you go along Laughing out loud

Verschwindende wrote:
  • CSS doesn't make pies

Big G
Offline
newbie
Last seen: 14 years 40 weeks ago
Joined: 2006-04-11
Posts: 6
Points: 0

Site check please - first ever web site

thanks to thepineapplehead,
yes i made a few changes and I am now looking at changing the colour scheme to a more subdued colouring.
I just installed firefox last week funny enough and only checked my pages in it the other day. One page looked terrible in it ( 2 tables all over the place. I changed them to divs one below the other). Your comments are very helpful as just the slightest change makes all the difference.
thanks again Tongue

edit: just had a look in firefox (i like firefox better than ie) and my text swf files are missing. Oh well I think it is time for a rethink - may just do as normal text. I am happy to mess about as its all experience for me...
ps takes too long for all those swfs to load.. need to change def..

:idea: Shock :?: 1 last question - the producers page - is this easy to change into a div only and no table. Will I need to do loads of divs inside 1 big div. - a pointer in the right direction would be appreciated.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 43 weeks 3 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Site check please - first ever web site

I fear you are overcomplcating the producers page a bit, but yes, it can be done with few divs.

Imagine:

<div class="prodinfo">
<img src="the logo" />
<h5> Producer Name </h5>
<p> blah blah blah <a href="more">more info </a> </p>
</div>

That lot alone can be styled. You don't need to add any divs on athe image, the heading, the paragraph, nothing.

Have a go at that on a blank page styling it to look like the table layout.

Here's a hint - you need floats Wink

Verschwindende wrote:
  • CSS doesn't make pies

Big G
Offline
newbie
Last seen: 14 years 40 weeks ago
Joined: 2006-04-11
Posts: 6
Points: 0

Site check please - first ever web site

i have rejigged the producers page

http://www.kyotokarate.co.uk/lanfam/producers/producers.html

and changed some colors about> I think I must be colour blind as I have gone from "in yer face" to "wishywashy".

I couldnt do my producers page within 1 div (all pics and Text).
I did it all in a div and floated the pics left and the text aligned against each pic. the problem was in IE the text at the start of the pics was gradually being moved down. By the time it was on the 4th pic the top text was in the middle of the pic. In firefox it was worse.
When coding it, it looked perfect.
finally had to do a div for each pic+text.
Doing some more ccs soon so maybe it will click into place.

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 43 weeks 3 days ago
Joined: 2004-06-30
Posts: 9668
Points: 801

Site check please - first ever web site

Big G wrote:

I couldnt do my producers page within 1 div (all pics and Text).
I did it all in a div and floated the pics left and the text aligned against each pic. the problem was in IE the text at the start of the pics was gradually being moved down. By the time it was on the 4th pic the top text was in the middle of the pic. In firefox it was worse.
When coding it, it looked perfect.
finally had to do a div for each pic+text.

Sorry, I wasn't too clear; that's what I meant! Glad you guessed it though :oops:

(Going just on the products page, haven't checked the others)

VERY nice, it's come along leaps and bounds! The nac and header stuff need a little tweaking, but the main content looks much nicer now, much more professional, you shoudl be proud of it!

Just a few minor tweaks:

1) Lose the restrictive width on the column. I'm browsing at 1152x864 and it looks much too thin, as if it's been squashed.

2) Lose the width entirely. When I resize the text, I want the div to expand with it

3) Slight niggle with the use of the headings, and the links.

<div id="producePics">
          <div class="newprod">
            <h4><a href="http://www.blackmountfoods.com"><img src="../images/blackmo.gif" width="115" height="110" border="0" class="prodpics" />Blackmount Organics            </a></h4>
            <p>Organic Beef | Lamb | Pork | Bacon | Poultry &amp; Pies<br />

              <a href="http://www.blackmountfoods.com">More details</a></p>
            <p class="point7text">Attends: <a href="../markets/overton.html">Overton,</a> <a href="../markets/hamilton.html">Hamilton,</a> <a href="../markets/clarkston.html">Clarkston</a></p>
          </div>

Don't stick the image in the <h4>, it's unnecessary. Also, you need to style any h4 that is a link with an underline. I also think that the h4s that AREN'T links should be black as well, but with no underline. At the moment, they lack clarity that they are the titles, they just look like part of the other text.

Getting much better though, keep it up!

Verschwindende wrote:
  • CSS doesn't make pies