14 replies [Last post]
dotancohen
Offline
Regular
Haifa
Last seen: 12 years 26 weeks ago
Haifa
Joined: 2007-05-26
Posts: 29
Points: 0

The website http://what-is-what.com has been active for about a year now. I'm constantly refining it as I learn CSS. As that is the topic of this forum, I'd appreciate any advice CSS Creator users can give me. How is the layout? How are the colours? Is the code clean?

One warning: I have had a HARD time with IE 6 (7 is better). So much so that instead of fixing the layout problems with IE6 I've simply appended an explanation as to why the page looks bad to browsers with the needle MSIE in the UA string. I'm sure that CSS Creator users will flame me for this, but I feel that if web designers stop bending over backwards to support IE, then one of two things will happen:
1) MS will be code their browser to better obey W3C standards
2) Users will get sick of seeing broken webpages and ditch their broken web browser.

I'll start another thread on that subject, so that this thread can stay focused on the issue at hand. Thanks in advance.

Dotan Cohen

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Have a question: What is?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Like music? Song Lyrics

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

dotancohen wrote:1) MS will

dotancohen wrote:
1) MS will be code their browser to better obey W3C standards

They're already doing this but it's not going to change anything for IE6 users.

dotancohen wrote:
2) Users will get sick of seeing broken webpages and ditch their broken web browser.

Highly unlikely. They'll just ditch the broken websites.

In my opinion, for such a simple layout, there's no reason why you shouldn't be able to get this to work in IE. And you're right: I think the 'this site doesn't work properly with IE' message is particularly naff.

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

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

IE doesn't appear to be your

IE doesn't appear to be your only problem I would worry about getting the page to display in a user freindly manner, I opened up your site and immediately find header elements disappearing off the right edge of the viewport, oh but no scroll bar! I don't like having to resize my browser which is set to accommodate my work environment.

You might also want to remove the style tags from the external css stylesheet?

Tyssen wrote:
In my opinion, for such a simple layout, there's no reason why you shouldn't be able to get this to work in IE.

Especially so given the fact that help (as noted in the stylesheet) with the styles has been provided by so many acknowledged 'Experts' in the field!

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

dotancohen
Offline
Regular
Haifa
Last seen: 12 years 26 weeks ago
Haifa
Joined: 2007-05-26
Posts: 29
Points: 0

Tyssen wrote:dotancohen

Tyssen wrote:
dotancohen wrote:
1) MS will be code their browser to better obey W3C standards

They're already doing this but it's not going to change anything for IE6 users.

True. IE7 already addresses most of the major problems in my opinion.

Tyssen wrote:
dotancohen wrote:
2) Users will get sick of seeing broken webpages and ditch their broken web browser.

Highly unlikely. They'll just ditch the broken websites.

If it's only one two two, maybe. But if developers start taking small steps to educate users, then it will help. Even on my sites that work fine in IE I'm considering adding the message. The users will have no reason to ditch the site, as it works fine, but they will have a bit more information.

Tyssen wrote:
In my opinion, for such a simple layout, there's no reason why you shouldn't be able to get this to work in IE. And you're right: I think the 'this site doesn't work properly with IE' message is particularly naff.

I agree that it's a simple layout. I'll start threads touching on the individual problems, and we'll see if it's a simple fix as well. I'm even willing to rewrite the code from scratch so long as it displays how I want and meets accessibility requirements. There's probably a hundred different ways to code that layout.

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Have a question: What is?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Like music? Song Lyrics

dotancohen
Offline
Regular
Haifa
Last seen: 12 years 26 weeks ago
Haifa
Joined: 2007-05-26
Posts: 29
Points: 0

Hugo wrote:IE doesn't appear

Hugo wrote:
IE doesn't appear to be your only problem I would worry about getting the page to display in a user freindly manner, I opened up your site and immediately find header elements disappearing off the right edge of the viewport, oh but no scroll bar! I don't like having to resize my browser which is set to accommodate my work environment.

What OS/browser/resolution? Of the problems that I have been able to identify, I haven't seen what you describe. Could you post a screenshot?

Hugo wrote:
You might also want to remove the style tags from the external css stylesheet?

Why? Keeping them external reduces page load times as the CSS file is cached.

Hugo wrote:
Tyssen wrote:
In my opinion, for such a simple layout, there's no reason why you shouldn't be able to get this to work in IE.

Especially so given the fact that help (as noted in the stylesheet) with the styles has been provided by so many acknowledged 'Experts' in the field!

Yes, I have received much help. Now I trying to stand on my own two feet. I don't wasnt to run to Sitepoint everytime I make a small change to the site. Also, now that I've added advertisements I feel a responsibility to maintain the site myself. It's not like I'm donating a portion of the revenue to Sitepoint or CSS Creator for the coding assistance.

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Have a question: What is?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Like music? Song Lyrics

thepineapplehead
thepineapplehead's picture
Offline
Guru
Last seen: 2 weeks 7 hours ago
Joined: 2004-06-30
Posts: 9668
Points: 801

dotancohen wrote:Hugo

dotancohen wrote:
Hugo wrote:
You might also want to remove the style tags from the external css stylesheet?

Why? Keeping them external reduces page load times as the CSS file is cached.

I think Hugo is referring to the <style> tags in your CSS file Wink

Verschwindende wrote:
  • CSS doesn't make pies

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

Just reduce your browser I

Just reduce your browser I never run a browser or any apps at full screen , and that goes for many others, I like to have a degree of visual access to my work, also a browser simply does not need to be larger than around 900px it's still a case that pages are best designed to accommodate smaller screens and in terms of text blocks they should never be wider than that anyway, fixed widths over 1024px are not a great idea in my opinion regardless of what people say in respect of everyone having larger high resolution screens, that's a spurious argument that omits laptop screens, pda's, mobile etc (I digress badly)

I was just slightly surprised to see the acknowledgements of help yet problems still evident in IE, did no one point out these or offer help on that?

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

dotancohen
Offline
Regular
Haifa
Last seen: 12 years 26 weeks ago
Haifa
Joined: 2007-05-26
Posts: 29
Points: 0

Hugo, I'll arrange the page

Hugo, I'll arrange the page such that it won't be wider than 750px. I usually do that, but I had to widen this particular site to fit the radiobuttons in the google searchbox. I'll correct that, it was a quick fix and I know it should have been handled differently.

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Have a question: What is?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Like music? Song Lyrics

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

many people will argue that

many people will argue that we should not worry too much now and many will be settling on 1024 as a resolution standard to code a site to I guess, course the option is there to design to fluid dimensions.
I was more concerned that those top bar search functions were overflowing the viewport width and were lost as the site wasn't able to scroll unless below the min-width set and even then it couldn't scroll back those elements lost.

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

dotancohen
Offline
Regular
Haifa
Last seen: 12 years 26 weeks ago
Haifa
Joined: 2007-05-26
Posts: 29
Points: 0

Hugo, would you believe that

Hugo, would you believe that it started off as a fluid design? It's because of that table in the header that I had to start fixing the size. I intend to work on that.

Other than that, how is the overall design from a user's perspective? Are the colours pleasant? Layout clear?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Have a question: What is?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Like music? Song Lyrics

fatfreddy
fatfreddy's picture
Offline
Enthusiast
Deep down under
Last seen: 12 years 27 weeks ago
Deep down under
Timezone: GMT+8
Joined: 2005-03-25
Posts: 390
Points: 0

You've had a bit of polite

You've had a bit of polite stick so far in this post ...but then you mentioned the T word :scared: - careful!
Why are you using a table for the Google Search?

Have a sneaky peek at http://www.webechodesigns.com/search.htm (yes it's my site)
It's easy enough to code Google search with using tables

Google

Search WWW Search Webecho Designs

The CSS

/* Search Google */

#google{margin-bottom:50px;}

#radio{margin-left:130px;}

fieldset{border:none;}

#submit{background-color:#dbeff0;border:1px solid #00908f;color:#00908f;}

#submit:hover{color:#ff7112;}

HTH

Fat Freddy

The only reason for time is so that everything doesn't happen at once
--Albert Einstein

Accessible webdesign Australia - webechodesigns

ChristinaG
Offline
Regular
Northampton
Last seen: 11 years 49 weeks ago
Northampton
Joined: 2006-11-30
Posts: 29
Points: 0

Hello Fatfreddy! Just very

Hello Fatfreddy!
Just very politely butting in (and completely digressing)...
Have you looked at your site in IE6 - Seems your box border repeats a little section at the bottom!!
And continue.... Smile

dotancohen
Offline
Regular
Haifa
Last seen: 12 years 26 weeks ago
Haifa
Joined: 2007-05-26
Posts: 29
Points: 0

Thanks, fatfreddy. I'm in

Thanks, fatfreddy. I'm in the middle of a redesign that will eliminate all tables with the exception of the "Rate This" table at the end of each article. That one is a killer...

The particular table in question was used so that I could stack the "What-Is-What" and "The Web" radio buttons in the Google search code, thus demanding less horizontal space and looking nicer. If you know how I could stack them otherwise, I'd very much appreciate a tip! I've played around with floating a span and a p(aragraph) however I could not get the desired effect without pushing other form elements below the black underline.

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Have a question: What is?

. ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . ' . Like music? Song Lyrics

fatfreddy
fatfreddy's picture
Offline
Enthusiast
Deep down under
Last seen: 12 years 27 weeks ago
Deep down under
Timezone: GMT+8
Joined: 2005-03-25
Posts: 390
Points: 0

.

.

The only reason for time is so that everything doesn't happen at once
--Albert Einstein

Accessible webdesign Australia - webechodesigns

fatfreddy
fatfreddy's picture
Offline
Enthusiast
Deep down under
Last seen: 12 years 27 weeks ago
Deep down under
Timezone: GMT+8
Joined: 2005-03-25
Posts: 390
Points: 0

ChristinaG wrote:Hello

ChristinaG wrote:
Hello Fatfreddy!
Just very politely butting in (and completely digressing)...
Have you looked at your site in IE6 - Seems your box border repeats a little section at the bottom!!
And continue.... Smile

Don't you just hate that when you're trying to sound all knowledgable! :blushing: Laughing out loud

The only reason for time is so that everything doesn't happen at once
--Albert Einstein

Accessible webdesign Australia - webechodesigns