Validation Standards - Who is following them?

[Nomad]

Hi again,

I have just started commissioning this new site http://www.oasiswest.ie/ . Obviously I am still trying to work to set standards.

So I sorted that page out today and as can be seen it is valid html transitional and valid css as set by W3C standards.

Can someone then answer me how then that page displays perfectly in I.E 6.0 yet not in the browsers that are supposed to be compliant with W3C standarsd, Netscape GeckoTM-based Mozilla, Firefox and Netscape 6/7.

If that site is viewed at the correct resolution standard 800x600 in I.E. 6.0 it displays perfectly.

In the supposed accepted W3C compliant browsers it doesn't.

I.E. is supposedly not reconised as following W3C standards yet can render pages validated by them perfectly.

1.The html/css is valid by W3C standard

2.I.E. renders the page perfectly

3.Mozilla,

Just who is following standards then?

I.E.? who are not supposed to be or the others mentioned who are reconised to be.

I have been told the html/css is wrong because Mozilla won't display it correctly. Does that mean that Mozilla are now telling W3C what the standard is?

or are there any standards..

My opinion would be if I write a html/css document that validates properly it should display correctly no matter which browser I use.
It displays in-correctly in Mozilla and it is the html wrong?

It displays perfectly in i.e. and it is the browser wrong?

What the visual result is saying to me is that it is I.E. that is actually following W3C standard and not 'Mozilla' as is most often stated.


I really would like to knowwhat is going on here ...

~ :)






(n.b. my apoligies webdoctor for not getting back to you. I have been very busy)

[speed]

In this case the problems you are seeing have nothing to do with the validity of your code, instead they are down to bugs in the way IE renders the page.

For example it is a well known fact that IE has problems with the box model, it miscalculates the width which means if you layout your site to work in IE then on compliant browsers your site will display incorrectly as the widths will now be different but correct.

If you take a look at http://www.positioniseverything.net/ you will find reams of bugs and fixes.

Once you understand the CSS and the browser quirks you can build pure layouts that work across multiple browsers.

You are right in a perfect world you would write one set of valid code and it would just display correctly everywhere, but just because a page is valid does not mean it will work as intended, the validation only checks that the mark up is syntactically correct nothing more nothing less.

[Nomad]

instead they are down to bugs in the way IE renders the page

Em The thing is the page is rendering perfectly in I.E. It's the other 'Alternative' browsers that are messing up or not rendering it properly.

Ok W3C is supposed to do one thing, set a standard by which all html (now xhtml) is written.
So If I write html code and it pass's there validation then that should work in any browser, as you say in the ideal world.

So the problem here then is with the browsers. That site works perfectly in i.e. yet not the accepted W3C standards browser/s.
So if that code is correct html it should have the problems in i.e. not in the W3C compliant browser recommendations, such as Firefox, Gecko Mozilla, netscape, Opera.

The latter are supposed to render W3C standard html/css and are recomended by W3C for that reson.

I.E., However is supposed to have these so called 'Problems' yet displays that site oasiswest.ie perfectly. And does so with valid html/css as set for html 4.01 transitional html and css 1.0.

Yet the browser/s you would expect to render valid W3C html/css doesn't.

And then you still say the fault is with I.E.?

Anyone faced with that evidence would say the absolute oppisit. That it is i.e. following the set standards of W3C and not the other browsers. Sorry but thats what the evidence is saying and I have screen shots to prove that.
opera, Mozilla make a mess of it. I.E. renders it perfectly (at all resolutions - I've checked).

Conclusion and the only one that can be drawn from that is what I have described.

I refuse to accept this constant silly answer that i.e. is at fault here - it can't be - it's renderimgthe site perfectly at all resolution levels (800x600 being the best).

The fault therefore must lie with the other browser's as they are not rendering the page properly.

Sorry, but the visual evidence before your eyes totally contrdicts what you (and many others) are saying.

I am starting to believe this is all part of the 'microsoft' so it must be wrong brigade because I fail to see any other reason.

yes I use I.e. as my prefered browser, not because I can't understand the others or that but for ease of use etc it is out standing.
I have used all of the others Opera, Mozilla etc and find no specific improvement in how a page renders. No so called faster this or what ever. IMHO I.E. wins hands down/ Yes it has security problems what browser doesn't, the simple reason why i.e. has the extra problems is because so many people use it and as a result so much more code is generated.
At 1 time Mozilla was so secure - then a spate of security flaws showed up as more and more used it.

As i have stated though if it is valid html/css as set by W3C standard then it should render perfectly in the recomended W3C standard web-browser's, after all W3C recomending them states that they render the agreed standardized valid hml/css.

That is not the case though and they don't do that I.E. does instead..

The html/css cannot be questioned W3C have allready validated that. So this problem lie's at browser level and certainly, again IMHO, not with the I.E. browser.

Sorry but the visual evidence says that. Kinda hard to discredit that I believe...

[redcircle]

Originally Posted by Nomad

The html/css cannot be questioned W3C have allready validated that. So this problem lie's at browser level and certainly, again IMHO, not with the I.E. browser.

Sorry but the visual evidence says that. Kinda hard to discredit that I believe...

Speed is completly correct with the fact that IE is your problem. As mentioned the IE has problems with the box model. The fact of the matter is that IE does not use w3c standards for the box model. In order to combat those bugs designers are forced to use hacks as speed has mentioned.

Rule of thumb. Design for Gecko and hack for IE

Think of IE as Enron. It reports all is good but they are doing everything wrong behind the scenes.

[speed]

Nomad you obviously don't believe me that's fine, I would therefore suggest you try it for yourself.

Read the W3C spec, build a simple page to show the box model flaw and see which browser gets it right according to the spec.

There is lots of information about the problems with the box model on the web, but again compare what they are saying to the spec.

I am starting to believe this is all part of the 'microsoft' so it must be wrong brigade because I fail to see any other reason.

I will admit that I'm not a fan of Microsoft but I will use their products if they are the best for the job, and they do have some good products.

[Nomad]

Interesting...
I've just re-read through the 'Box Model' link you gave me.

From what I can gather browsers are operating at two levels 'Quirks' and 'Standards'.
If I use this;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

then a browser (including i.e. 6.0) renders the document or html/css following the W3C standard. If I don't comment or place that code, then the browser is supposed to fall back on the 'Quirks' method and render the page at this level.

If that is the case, then I am telling that document to tell the browser to use standards and as such it should render correctly across platforms. Only reason I can think of is I have the charset wrong;

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

.

I would assume though if that was the case then the W3C validator would inform me of this, it doesn't. ....
[side note]
I have just checked the document again in the W3C extended interface. I choose the charset and html 4.01 transitional. It validated. using a utf-8 override it tentatively validates.[/side note]

So, with that and because I have set the I.E. browser to render at standards and then built the rest of the page, it should make absolutely no difference which browser the page us opened with.

This is because I have set I.E to operate at W3C standard compliance. I would expect the 'Box Model' problem in the older i.e. browsers such as 5.0 and before.
With the code I have written that problem with the older i.e. browsers would definately occur but not with i.e. 6.0 as the 'Box Model' problem was rectified in this browser.
So that then follows that in this case I am using fully compliant html/css and only i.e. 6.0 is rendering it correctly.


Your documents there that you linked to are actually saying that I am right but that I need to use the 'Tan' hack so older versions of I.E. can render the 'Box' correctly.

We know from those resrc documents that the 'Box Model' was fixed in I.E. 6.0 and I have told it to render as 'Standards'.
The document should there fore render correctly in all W3c standards browsers. As I've said it doesn't.

Your reference to the 'Box Model' problem, whilst a valid argument against older i.e. browsers cannot apply here, as I have used i.e.6.0 set to work with standards.

So that means that my original argument remains solid - that i.e. is rendering the document as a valid W3C 'Standards'page and that supposedly W3C standards browsers are not.

Look at the evidence, that is what it is saying.

Your links actually confirm my evidence..

As does this;

Fortunately, Microsoft saw the error of its ways and corrected IE's box model in IE6, but only if it is in "standards mode". If it is left in "quirks mode" it still emulates the old IE5.x/win box model. By the way, IE5/mac always obeyed the standard box model. Go figure

My documents/ pages are set to work in standards, so i.e. 6.0 render them as such and displays the visual result perfectly. That being the case so should the so called W3C recommended browsers.
As I said the older i.e. browsers will have a problem rendering those pages in that code because of the box model problem but that is not the case here,

That then leads me to ask again why? Remember the 'Box Model' problem is not an issue here I have i.e. 6.0 set at standards ;

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">

Would someone explain where I am wrong here?



n.b. yes I am going to have to use the 'Tan Hack' to combat the 'Box Model' problem but only in the older i.e. browser's. It does not apply in this case.

[edit] btw I have just spent 15mins taking that page to html 4.01 strict. It renders perfectly in i.e. 6.0 set at 'Standards'. The doctype element does that. here's the test address http://www.oasiswest.ie/test/index.html. The css is also valid as well. I obviously would expect the 'Box Model' problem in earlier i.e. browsers. I am gonna get my mate to check it in other browsers, specifically the W3C recommended browsers. As such being strict hml 4.01 with the correct document standards setting I should not have any problems in cross browser support.
I will post back on results. bur upto now, I can qualify that i.e 6.0 is rendering the document correctly.

[Nomad]

images;
w3c compliant browsers
1. Opera
2.mozilla firefox


i.e 6.0
I.E.6.0

The 'Box Model' problem is not an issue. It was fixed in I.E 6.0 and browser is switched to 'Standards'.
It should be a problem in pre i.e. 6.0 browsers but not in the main complient browsers.

It is a problem in recommended W3C browsers but not in the non-recommended W3C browser?

[speed]

There are more bugs than just the box model, and normally problems are down to one of these if the code validates.

Anyway they reason you are having problems is you have an extra } at the start of mainNav.css (line 4), which stops it validating or working properly, in Firefox etc.

Remove that and I think it should all work for you.

Realy begs the question as to why IE read and displayed a broken file doesn't it!

[Nomad]

Originally Posted by speed

There are more bugs than just the box model, and normally problems are down to one of these if the code validates.

Anyway they reason you are having problems is you have an extra } at the start of mainNav.css (line 4), which stops it validating or working properly, in Firefox etc.

Remove that and I think it should all work for you.

Realy begs the question as to why IE read and displayed a broken file doesn't it!

Agree's, it most certainly does...and is very interesting...seems that would mean that if i.e. sees an indentifier (I assume that is what this is < }<)
So, here i.e. is seeing an openingcomment and then following that through ignoring the second opening comment[?] and then reading and rendering the code. Where as the compliant browsers are seeing it and habging up at that point failng to read the rest of the css properly?

hmm most interesting (I understand why the validator missed it - in a sence it is 'hidden' from it).
I'll have it checked see how it works now ...


whoa! just checked it in i.e.! look what happens - I lose the nav all together!

New bug in i.e.? gonna check that css ...

nope it's not just messed up in i.e. mozilla mess's it up as well.

checked mainnav.css in the vaidator without the extra } it pass's but doesn't work. with the extra } it doesn't validate but i.e. can render it....hmmm

maybe it's with the nav css being out of the main css document? I'll try that see what happens...

most interesting result...

[speed]

PM me your email address and I'll email you the index.html, mainNav.css, and 3col_leftNav.css files which work for me in IE & Firefox so you can compare them with yours, I might have changed something else and forgotten about it.

Just a thought you have got the oasis_mainnav.js referenced correctly, or the menu HTML uncommented?

[Nomad]

Originally Posted by speed

PM me your email address and I'll email you the index.html, mainNav.css, and 3col_leftNav.css files which work for me in IE & Firefox so you can compare them with yours, I might have changed something else and forgotten about it.

Just a thought you have got the oasis_mainnav.js referenced correctly, or the menu HTML uncommented?

As far as i know the mainnav.js is referenced right..

ok I moved the nav css into the main css file and took the style link for it out. first i.e. still borked up (this was still there } ) so i removed it and it worked in i.e. but not mozilla.
I'm assuming the same result for opera/firefox (Must re-install these).
It's working as i say in i.e/ 6.o with that comment removed.

hmm interesting ....pm on it's way ...


btw w3c validator is still oking the html but errors the xtra comment as it should - jusyt revalidated both documents - both ok.


edit: solved it! clue was the .js! I just changed the doc to use the in built nav structure and it worked so I had my mate check another site that src's it's nav structure via an html document. that worked perfectly in mozilla and i.e. so i'm gonna change the nav to an html src and see what happens when I src that in..

speed? could you check that the main_nav.js was refrenced correctly? but i believe this is where the problem lies.
gonna try a test2 for the html nav try.

[speed]

With regard to the JavaScript nav I'd rip it out and throw it away, as currently it makes your site inaccessible to browsers with JavaScript disabled.

This might include disabled people.

[Nomad]

This is weird because I got Opera down last night and checked through it myself. As I said it's the java throwing it out but I can view my own site which has the same js src for the nav no problem?


Just got to figure how to src it as html now...I am not editing every single document each time.

Far as I am concerened this is an issue that needs correcting. Very annoying.

Thanks for the brain storm speed appreciate it and the e-mail

~ :)

[Nomad]

Just giving an update on this issue. css fixed though the validator did miss the extra } that you caught speed.
weird how I.E. ignored and the others did as well I'm assuming but when I took it out it messed i.e. up at first[?].

It was the css throwing it out as it is now working across all browsers (Major used ones) Opera, firefox, mozilla, i.e. 6.0. Support for the early box model problem in i.e. to be added.
I took the html to html 4.01 strict and intend to go to xhtml next.
But I'm happy with where it is now.

I do believe it was splittingthe css that caused the problem though I can't figure why as I have seen sites usingthree or four css scripts and work fine across browsers...gonna look at it further...

Thanks again for the help on that speed..appreciate it

~ :)

[Nomad]

Update on this and a big pat on the back to myself (With a push in the right direction from speed. My thanks :up: ) )

http://www.oasiswest.ie/ is now in valid xhtml 1.1 and css 2.0.

Only three pages are finished but now I have the two base templates to the site, the rest is easy. I think this will become one of my standard templates and I can adjust layouts accordingly.
May as well as I have a good working xhtml 1.1 standard template to work from.
Just takes figuring the validator to work for you is all.

I went this way.
Transitional html 4.01
Strict html 4.01
xhtml basic
I was then trying for;
Transitional xhtml 1.0
but I got a tentative xhtml 1.1 result after I had achieved basic xhtml standard.

Learn to use the settings over ride and it shows you your mistakes.
I had set my doc type to basic xhtml/achieved that/then out of curiosity I decided to cheat and use the over ride.
It threw up 43 problems. I just worked trough them - most were just closing stuff the new way (Properly).
sorting out the

 to 
 - (they have to be self closing now is that right[?])

Pinned the h1/h2/h3 bit out and a couple of

paremeters out and it validated tentatively as xhtml 1.1 was quite surprised (And obviously well chuffed!) that I made the jump as I was trying for xhtml strict, was just messing with the validator see how many problems xhtml 1.1 would show - Nice satisfying surprise when I got the result.

Thanks again speed for the push - Appreciated btw your fix (what ever it was) on the css worked a treat..:up:

Also thanks to dreamweaver for the base layout div - nice template when it's fixed ;) [jking - very good bit of software]..

~ :)

[speed]

Well I'm glad you got it all working.

To answer your
question, in XHTML all tags have to be close so in the case of br and img tags then yes they need to be in the form
and <img .... />.

There are some links to XHTML information, guides, tutorials here that may be of interest to you.

[jordanmcclements]

Speed -

Thanks for the link to :-

http://www.positioniseverything.net/

That was exactly what I needed.....