12 replies [Last post]
tom_de_schlong
tom_de_schlong's picture
Offline
Enthusiast
UK
Last seen: 8 years 44 weeks ago
UK
Joined: 2004-06-13
Posts: 92
Points: 0

Hi all, ok I have built this site for a local business, they haven't given me any content yet only an outline of the sort of content I should expect, I have designed the site to reflect the businesses branding. I have also used only 100% valid html 4.1 strict and CSS, I have also tried to make it as accessible as possible without losing useability, thus the text size changer etc.
I have tested it in most PC browsers and it works in the following

IE5+
Opera 7+ (1 minor problem in 7.03, 6 has only minor'ish problems, 5 is a bit more buggy but still pretty accessible and usable)
Mozilla 1.2.1+
Netscape 6+ (haven't tested on 5 or less)
Mozilla Firefox 1.0 (haven't tested on previous versions as I don't think there is much point.)

I haven't tested it on any mac browsers so if anyone could do that I would be very grateful.

I have tested it on konqueror on linux mandrake 9.0 and it was extremely messed up and totally unusable, is this a problem? I don't think so.

Anyway please take a look at it any/all browsers you care to and find things that are wrong with any part feature etc.

http://www.derbyshirefireplaces.co.uk/tom/sue

Thanks a lot

Thomas Willmot

p.s I can't believe that the only browser to support the css 3 pseudo class *:target is Mozilla and they have supported since 1.4, amazing.

p.p.s sorry for the long post

Want a free Ipod, live in the US or UK then please <a href="http//ipods.freepay.com/?r=21545802">check this out</a>. Plenty of people have already got one just search google for freeipods.com.

Hugo
Hugo's picture
Offline
Moderator
London
Last seen: 5 years 37 weeks ago
London
Joined: 2004-06-06
Posts: 15668
Points: 2806

Please critisize me constructively

Very nice Thomas , I like the design much , done a good job there.

However Smile the first thing that strikes me is the overall size is too large and that the whole site would benefit from being reduced down a bit , it's a common design belief that the default text sizing of browsers is too large and generally you will find that reducing the body text size down by a percentage gives a more professional appeal
plus the container size of 800px is going to produce those nasty horizontal scroll bars in a 800*600 resolution.
Overall nicely produced and much kudos for the effort in avoiding hacks =D>

Hugo.

Before you make your first post it is vital that you READ THE POSTING GUIDELINES!
----------------------------------------------------------------
Please post ALL your code - both CSS & HTML - in [code] tags
Please validate and ensure you have included a full Doctype before posting.
Why validate? Read Me

tom_de_schlong
tom_de_schlong's picture
Offline
Enthusiast
UK
Last seen: 8 years 44 weeks ago
UK
Joined: 2004-06-13
Posts: 92
Points: 0

Please critisize me constructively

Thanks a lot for the feedback I though I had designed it to work without producing scrollbars on 800*600, but obviously not will sort that out

Thanks again

T Willmot

Want a free Ipod, live in the US or UK then please <a href="http//ipods.freepay.com/?r=21545802">check this out</a>. Plenty of people have already got one just search google for freeipods.com.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 8 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Please critisize me constructively

Tom - the site looks stable on FF_Mac and Safari.1_Mac, although your topnav links have a brown background on the hover in Safari but not FF. The nav link default text size is a bit big for my liking and I don't like the way the links increase in size on the hover (why?). The sponsor's links also have a kind of thick underline on the hover which looks odd.

In Safari one can see the background image extending below the footer. I would put this inside a container/wrap div so that it stays with the page proper.

The body text default size is a little too big (and therefore 'clumsy') for my liking, and so are the <h2> headers (at 2em) which also have rather too much space around them.

Your browser warning is a nice touch but users of screen readers will get very annoyed with it unless you move your skip-links above the warning.

The top right links are a little too 'open' and close to the edge for my liking.

Most of this opinion is just that: subjective opinion, and who's to say that I'm right. ...but there you go anyway Smile

Life's a b*tch and then you die!

tom_de_schlong
tom_de_schlong's picture
Offline
Enthusiast
UK
Last seen: 8 years 44 weeks ago
UK
Joined: 2004-06-13
Posts: 92
Points: 0

Please critisize me constructively

Thanks for all your replies most of which seem to revolve around the size of the text which I understand, as you might of noticed there is a text size changer which at first was defaulted to small. I changed it to default to the medium setting on a whim the other night and after your replies will change it back.

As for the background image extending below the footer this is also known about and is done on purpose as opera refused to repeat the background image down with the content. This is simply a hack that I was forced to use.

I Like the links getting bigger on hover but would be interested in more opinions on this.

As for the browser warning I take heed and move the jump links above it

God I love feedback you learn so much

Thanks again

T Willmot.

Want a free Ipod, live in the US or UK then please <a href="http//ipods.freepay.com/?r=21545802">check this out</a>. Plenty of people have already got one just search google for freeipods.com.

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

Please critisize me constructively

I agree about the font size - in this case, smaller is definitely better!

Also, I dislike the font-size increasing when you hover ovr the links. Something different would look more professional - maybe a brighter color, or an underline?

I like the different styles for different sizes - however, the 'large' breaks the layout.

You're on the right track with the 'small' css file, the right bar at this size is good. Stick with that size for the regular site. Although the text is still a bit big. I think the 'small' setting would be better for regular, and the 'regular' size better for large.

Verschwindende wrote:
  • CSS doesn't make pies

tom_de_schlong
tom_de_schlong's picture
Offline
Enthusiast
UK
Last seen: 8 years 44 weeks ago
UK
Joined: 2004-06-13
Posts: 92
Points: 0

Please critisize me constructively

Ok here it is again with some of the changes/refinements suggested. it now works on 800*600 (god it would have made my life easier if I had done this properly at the beginning I was only about 20 pixels out)

remember if you have looked at it before you will have an outdated cookie for the text size changer so you will need to click on one of the sizes to resresh the css.

http://www.derbyshirefireplaces.co.uk/tom/sue

T Willmot

Want a free Ipod, live in the US or UK then please <a href="http//ipods.freepay.com/?r=21545802">check this out</a>. Plenty of people have already got one just search google for freeipods.com.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 8 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Please critisize me constructively

No no no. If you must use a serifed face then take the body text back up a size. It's more the nav links and titles that were too big before. It is now quite difficult to read some of the smaller text on my high-res monitor. If you take all the smaller sizes back up a bit it should be fine.

Life's a b*tch and then you die!

tom_de_schlong
tom_de_schlong's picture
Offline
Enthusiast
UK
Last seen: 8 years 44 weeks ago
UK
Joined: 2004-06-13
Posts: 92
Points: 0

Please critisize me constructively

are you sure you were viewing it with the correct style sheet loaded to the text size changer, it should be the middle "A" as this is the default

my font is as follows, Gorgia, Verdana, Helvetica, Arial, Sans-Serif
are these not the best fonts to have

Tom

Want a free Ipod, live in the US or UK then please <a href="http//ipods.freepay.com/?r=21545802">check this out</a>. Plenty of people have already got one just search google for freeipods.com.

roytheboy
roytheboy's picture
Offline
Guru
North Wales, UK
Last seen: 7 years 8 weeks ago
North Wales, UK
Timezone: GMT+1
Joined: 2004-09-18
Posts: 2233
Points: 41

Please critisize me constructively

Fonts are rather tricky things on the web, and the discipline of typography is a subject worthy of professionals that specialise in nothing else. In my opinion, due to the horrid way that PCs in their default state show fonts (as opposed to the beautiful way that they look on a Mac), you should not use serifed fonts for body copy unless you have a very good reason to do so, or unless you are displaying your text at a fairly large size (which is not the fashion at the moment).

You see, when the browser tries to scale down minute serifs into comparatively large blocks (pixels), you can end up with an illegible mess. It's bad enough with sans-serif faces, let alone serif ones!

Arial is a good font for general web use as it is clear to read and slightly compressed compared to many, but Verdana is easier to read at the price of being wider than Arial. I won't go into detail about x-height and stuff but needless to say, some fonts are easier to read than others at set sizes.

I also use Trebuchet a lot but you have to remember that not all Mac users have Trebuchet, and Linux users don't generally have Arial. I have found that Nimbus Sans L seems to be fairly popular on Linux machines.

So; the font value I tend to use a lot is this, with each face being a fall-back if the preceding one is not found:

font-family: "Trebuchet MS", Arial, "Nimbus Sans L", Helvetica, sans-serif;

...but that's just my personal view.

Life's a b*tch and then you die!

tom_de_schlong
tom_de_schlong's picture
Offline
Enthusiast
UK
Last seen: 8 years 44 weeks ago
UK
Joined: 2004-06-13
Posts: 92
Points: 0

Please critisize me constructively

ok thanks for the info, I have researched the area a bit and decided it is a right mess in the end have gone with the following.

"Lucida Grande", "Lucida Sans Unicode", Verdana, Tahoma, Arial, sans-serif;

Want a free Ipod, live in the US or UK then please <a href="http//ipods.freepay.com/?r=21545802">check this out</a>. Plenty of people have already got one just search google for freeipods.com.

colombopablo
Offline
Regular
Last seen: 15 years 48 weeks ago
Joined: 2004-10-20
Posts: 19
Points: 0

Please critisize me constructively

I agree with Roy,....

On the web, serifs should be used for titles in bigger sizes...Even on a Mac,....Georgia, (a serif looks decent on Win machines, that is on vogue now..)... gets anti-aliased and looses readability....

The end to your path is your path itself...

Tyssen
Tyssen's picture
Offline
Moderator
Brisbane
Last seen: 5 years 49 weeks ago
Brisbane
Timezone: GMT+10
Joined: 2004-05-01
Posts: 8201
Points: 1386

Please critisize me constructively

Your nav background graphic looks like it's about 1px out of place to the right on Firefox.

How to get help
Post a link. If you can't post a link, jsFiddle it.
My blog | My older articles | CSS Reference