13 replies [Last post]
breakfast3001
Offline
Regular
Last seen: 16 years 39 weeks ago
Timezone: GMT+1
Joined: 2005-03-06
Posts: 23
Points: 0

Hey everyone,

after getting some help on my CSS trouble (which I always seem to get when I try something), I think I have put together a quite solid webpage that looks nice too. But of course, when you are designing you always feel that it looks nice, but when you ask other opinions, you sometimes see that others just don't like it.
Could you have a look and tell me what you like and dislike about the design? And if you find CSS trouble ... don't hesitate to hit me in the face and tell me.

Thanks!

The link: http://www.karma-lan.be/NewDesign

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

Check out this website

This should be in 'Site Checks' rather than 'CSS Layouts' I'll move it over.

One thing I would mention and that is with images off or if they fail to load you have no links. Image maps are a slightly dated devise.

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

breakfast3001
Offline
Regular
Last seen: 16 years 39 weeks ago
Timezone: GMT+1
Joined: 2005-03-06
Posts: 23
Points: 0

Check out this website

Any suggestions what to replace the image map with?

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 16 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Check out this website

I would suggest you check your navigation link destinations.
The Home Page cannot be reached from the other pages and it cannot be reached from err... itself. The Forum link also seems to be broken.

Quote:
Any suggestions what to replace the image map with?

Do you want to keep exactly the same look and feel or are you open to some alternative design suggestions?

As to overall design - Is KarmaLan some sort of computer/gaming online club/meeting place? If not, please give some indication as to what the site is all about.

I do not have the font Trajan Pro on my computer and, as there is no alternative font in the css, the Login Box uses my font preferences in FF and IE - I have deliberately set those preferences differently, which is why it shows up. It is not clear what the check box to the right of the login box is for.

I am not entirely sure you have the correct syntax for the generic font family "ms sans serif", I believe the spaces should be hyphens, but stand open to correction.

Visitors cannot change the text size easily in IE but those who know how to override your fixed text size, will notice the design breaks beneath the menu graphic. In FF the first text increase breaks your count-down timer out of the box and it is no longer properly centred.

There is one warning from HTML Tidy which suggests the name and id values should match.
<div id="nav"><map name="menubar" id="menubarMap">
Just one validation error:
http://validator.w3.org/check?verbose=1&uri=http%3A//www.karma-lan.be/NewDesign/
Two errors and some warnings in the css
http://jigsaw.w3.org/css-validator/validator?profile=css2&warning=2&uri=http%3A//www.karma-lan.be/NewDesign/

HellsBells
HellsBells's picture
Offline
Leader
Bedford, UK
Last seen: 13 years 31 weeks ago
Bedford, UK
Joined: 2004-04-07
Posts: 851
Points: 0

Check out this website

There are a couple of ways of doing image maps here: http://www.stunicholls.myby.co.uk/menu/mantis.html that are interesting and will degrade to a Definition List.

My strategy is so simple an idiot could have devised it!

"Also, your CSS (no offence) makes me want to gouge my eyes out with a rusty spoon" - TPH

breakfast3001
Offline
Regular
Last seen: 16 years 39 weeks ago
Timezone: GMT+1
Joined: 2005-03-06
Posts: 23
Points: 0

Check out this website

Hey Lorraine,

thanks for taking the time to look at the website.
I've been working on it and a lot of the CSS issues are gone now. (only the _height error remains, but it's an IE hack)
As to the website, it's a website about a "Lanparty", a kind of computer meeting where gamers come together and game all day/night long.
I'm not really open to alternative design solutions. But I was thinking of adding a bar with normal links at the bottom of the page... ? Maybe.
The Trajan Pro font thingy has been settled, but I don't really understand what you mean with the TextSize thing in the browsers, I don't know what to do about it.What do you mean about the design break ?

Thanks a lot!

Oh yeah: the news link is:
http://www.karma-lan.be

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 16 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Check out this website

breakfast3001 wrote:
tell me what you like and dislike about the design

breakfast3001 wrote:
I'm not really open to alternative design solutions.

:-s Oh - alright then.
I asked you to confirm my suspicions that it was a site for gamers because I thought it looked a bit err ... "ordinary" for that sort of visitor. If I may make a GUI comment, however, you could consider adding (more) right padding to the text as, in places, it gets very close to the right border.
breakfast3001 wrote:
I don't really understand what you mean with the TextSize thing in the browsers

I am attaching piccies of how it looks in Firefox on one text-size increase. And in IE when the visitor overrides your fixed font sizing - but don't worry about that too much, not a lot of people know how to do that. On the other hand many know how to resize text in IE the straightforward way and it would be nice for those if the text-size was not fixed.

breakfast3001
Offline
Regular
Last seen: 16 years 39 weeks ago
Timezone: GMT+1
Joined: 2005-03-06
Posts: 23
Points: 0

Check out this website

About the "not open to alternative designs":
I kind of like what I have and I don't want to start all over again...
I originally had another design (http://www.karma-lan.be/Backup/Arno) but that didn't look that good, so I started all over again, and came up with this, of which I am quite happy. So I think you can understand why I wouldn't want to change it once more Wink But I would like to know what people like and dislike about the current design, because if there are things (like the top banner not vivid enough or something) I can change, I would be able to do that, if they would still fit in the current design...
I hope I made myself a tad clear. Wink

Now, thank you so much for the images! I'll see what I can do about it... Ideas are welcome Wink
The right padding is a good idea, I will fix that as soon as possible.

I know the design is quite "ordinary", but I don't like flashy things that hurt my eyes...

Once again thanks for all help up to here!

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 16 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Check out this website

Heaven forbid! No flash please Cool .
Let's put it this way - I like your design very much, the colours combine very well. But I'm a little old lady who has only ever played one computer game and that was "Little Brick Out" (circa 19**) Shock

One suggestion based on what you have now. Perhaps some left/right borders or whatever on the menu graphic would tie it more into the other borders on the page. To my eye it looks kinda out of place or not complete without them.

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 16 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Check out this website

Quote:
Now, thank you so much for the images! I'll see what I can do about it... Ideas are welcome Wink

Me again...
You may well have noticed the login box also breaks out to the right in Firefox after several text-size increases. To my mind this means the login box and the count-down thingy are not properly positioned within #content. This could be something to do with it:
<p class='loginform'> see what happens with double quotes around the class name. Then you may need to put a width on the class loginform.
I'm the last person to go mucking around in JavaScript, but maybe the count-down timer is suffering from a similar malaise Laughing out loud

breakfast3001
Offline
Regular
Last seen: 16 years 39 weeks ago
Timezone: GMT+1
Joined: 2005-03-06
Posts: 23
Points: 0

Check out this website

I'm trying to fix the font things first.
Now, you said not to have fixed font-sizes.
But I can change the font-size with:
font-size: small;
or something similar, right? That won't hurt... I think

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 16 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Check out this website

I would use a font-size in ems (possibly %). I understand words like "small" are rendered differently in various browsers (if at all in some).

breakfast3001
Offline
Regular
Last seen: 16 years 39 weeks ago
Timezone: GMT+1
Joined: 2005-03-06
Posts: 23
Points: 0

Check out this website

Thank you, I'll think about it Wink

I'm currently struggling with another problem :oops:
http://www.karma-lan.be/
If you check out the "Crew" or "Sponsors" page, you'll see the "banner" thingy ('Design by ...') isn't placed at the bottom of the Content Div ... I want it there, but it doesn't seem to work ...
Any ideas?
Thanks for all the help

Lorraine
Lorraine's picture
Offline
Elder
UK
Last seen: 15 years 16 weeks ago
UK
Timezone: GMT+1
Joined: 2005-01-04
Posts: 1001
Points: 0

Check out this website

OK. The bottom banner is styled as a paragraph that is just following the paragraph above it. That seems to work when there is enough text to push it down past the height(Drunk you have set on #content.

What happens if you comment out those heights? Works for me! and gets rid of that underscore hack the validator is so sniffy over.