View Full Version : DOCTYPE problem
fileserverdirect
08-10-2007, 09:27 PM
Hi,
I love the feeling when W3.org's validator says that "YOUR DOCUMENT IS 100% VALID!". Well... I ran into a problem. I coded my entire website without the <!DOCTYPE> before the <html> tag. Ok I near-finish the site( it is written in php) and I scan it throgh the validator. I get out all the problems, then add in a DOCTYPE HTML 4.1 Transitonal. Boom, its valid! Yay-Me. Not Quite. I go to the document in my browser to post the HTML 4.1 Valid logo, and EVERYTHING is messed up. The page looks like a tornado went through it. I toolk off the DOCTYPE to see if it was the problem. The page went back to its normal self. HELP! I want a valid Document and keep it the same way I programed it. HELP!!!!!!
This is why you should use a Strict DOCTYPE from the start. You've written your page in a way that depends on various browser bugs that only appear in quirks mode. When the page is given a DOCTYPE, the browser stops producing these bugs.
There's not much for it but to rewrite the buggy parts of your stylesheets. If those are particularly prominent, it may be easier to rewrite the whole thing from scratch.
If it looks bad in Standards mode, chances are it will look bad in browsers other than the one in which you were developing, as well. Try it in at least IE6, IE7, Firefox, Opera and Safari.
fileserverdirect
08-10-2007, 10:04 PM
OK, I re-validated the document in HTML 4.1 Strict and only 14 errors, mainly saying that you can do the same thing in css, No big, but even then, will the document go back to normal? Only one thing that I dont know how to do: I have a background image and a background color to fill the parts the image doesn't. It only allows one. The only way to do it is to make the color part of the image for like 700px, so no matter what resoultion, there will be no white space. Also there is no TARGET attribute, how do I get links to open in a new window, without javascript?
I re-validated the document in HTML 4.1 Strict and only 14 errors, mainly saying that you can do the same thing in css, No bigAs big as any of the other errors.
but even then, will the document go back to normal?No. You didn't read my post properly. Your page is written so that it depends on various browser bugs, so it will only look "right" in quirks mode on one browser on the 29th of February under the light of a full blue moon after eating the small glowing mushrooms that sprout 71.8m underground at Stonehenge after sacrificing a baby unicorn with crossed eyes and doing an ancient Mayan dance in five dimensions. Fixing it isn't as simple as just making it conform to a given DTD, you also have to rewrite it so it looks how you want it to under that DTD. Then, and only then, will your page be accessible to the majority of browsers.
Only one thing that I dont know how to do: I have a background image and a background color to fill the parts the image doesn't. It only allows one. The only way to do it is to make the color part of the image for like 700px, so no matter what resoultion, there will be no white space.Layer another element over the top to hold the background image.
Also there is no TARGET attribute, how do I get links to open in a new window, without javascript?You don't. Frames and new windows are both deprecated in modern versions of HTML. You can use Javascript if you really must:
<a href="somepage.html" onclick="open(this.href);">... but it's not recommended.
Sliight
08-11-2007, 01:22 AM
it will only look "right" in quirks mode on one browser on the 29th of February under the light of a full blue moon after eating the small glowing mushrooms that sprout 71.8m underground at Stonehenge after sacrificing a baby unicorn with crossed eyes and doing an ancient Mayan dance in five dimensions.
Odds are slim of that happening...shame that he didn't say "it will only look 'wrong' in ...." Then the odds would be very good that it would never look wrong.
There's one thing about that statement that makes me think it may not be totally true... there's no way a mushroom could grow that deep underground. Without that tidbit of info my trained eye could have believed the rest...
fileserverdirect
08-11-2007, 03:08 PM
Thanks for the posts you guys, but your forgeting a main problem in re-writing the site. A its written in php that reliys on various language\common function documents, and it took over 3 months to write, I mean come on:
...so it will only look "right" in quirks mode on one browser on the 29th of February under the light of a full blue moon after eating the small glowing mushrooms that sprout 71.8m underground at Stonehenge after sacrificing a baby unicorn with crossed eyes and doing an ancient Mayan dance in five dimensions. It wasn't that messed up. P.S. One of the things that was all messed up was one of D.D.'s scripts, so maybe DD should re-write some of it's script's ah?
A its written in php that reliys on various language\common function documents, and it took over 3 months to writeIf you invested that much time into writing your site, you did of course use a templating engine such as Smarty (http://smarty.php.net/) to separate your design and logic, thus making a rewrite of the frontend much easier.
It wasn't that messed up.I was exaggerating just a little, I thought I made that fairly plain ;)
P.S. One of the things that was all messed up was one of D.D.'s scripts, so maybe DD should re-write some of it's script's ah?Most certainly. I'll be the first to complain about the poor quality of not just some but most of DD's scripts.
fileserverdirect
08-12-2007, 02:53 PM
If you invested that much time into writing your site, you did of course use a templating engine such as Smarty to separate your design and logic, thus making a rewrite of the frontend much easier. I have no idea what you are talking about, but what I do know is that I solved the problem. I fixed all the errors in 4.1 Strict made it look just the smae way as it did before, transefernd all <font> tags to css and, Its 100% Valid, and the way that I like it to :-)
I'll be the first to complain about the poor quality of not just some but most of DD's scripts. Note that over half dont work in IE5.5 Mac anyways(Mac's are sooooo over-rated). I have IE7 on an xp SP2 so then again... Well never mind.
I fixed all the errors in 4.1 Strict made it look just the smae way as it did before, transefernd all <font> tags to css and, Its 100% Valid, and the way that I like it to :-)Good :)
Note that over half dont work in IE5.5 Mac anyways(Mac's are sooooo over-rated). I have IE7 on an xp SP2 so then again... Well never mind.It's not the Mac's fault. IE5 is a ruddy terrible browser -- the Mac version is actually less buggy than the Windows version.
fileserverdirect
08-13-2007, 03:01 PM
I fixed all the errors in 4.1 Strict made it look just the smae way as it did before, transefernd all <font> tags to css and, Its 100% Valid, and the way that I like it to :-)
Well, I kinda lied, There is only one problem that I cannot seam to fix... I have an Information bar at the top of the page, under my logo and page title. I have a background image with a fade in and out on etheir sides (about 770px in between) and I have a drop-down-menu in the Information bar. I continued that color in the divison next to it. It says "please log in" or when your logged in "Hello, username. Go to your Control Pannel" etc. Before the DOCTYPE it streched all the length of table (770px) so it matched to the background. It does not strech all of the way. I think there is a problem in the main table. I must have nested too many and lost track. Is there such thing as a table debugger? But then why did it work before the DOCTYPE?
I must have nested too many and lost track.Ouch. Never nest tables, dude. Firstly, it slows down page load considerably; secondly, it's a good sign that you're using tables for layout, which is a nasty hack very rarely necessary in these enlightened days of CSS.
But then why did it work before the DOCTYPE?Only the browser developers -- and probably then only the ones who've worked on the project since its conception -- can tell with absolute certainty how a given browser will react to perfectly innocent code in quirks mode.
fileserverdirect
08-14-2007, 12:03 AM
Ouch. Never nest tables, dude.
Its ethier nested tables or a hole lot of postion:aboslutes which can place stuff all over the place in differant resoultions\older non-supportive css.
...very rarely necessary in these enlightened days of CSS.
Dude, You need some fresh air. Think about how many people use 100% "Clean" Code. P.S. The only reason that W3 doesn't drop the <table> tag in HTML 5.0 is that 90% of Webmasters would riot in front of their HQ, terring down each peice of wood, destroing DNS Servers, Ripping apart Ethernet wires, Trashing computers, and blowing up the building.
Its ethier nested tables or a hole lot of postion:aboslutes which can place stuff all over the place in differant resoultions\older non-supportive css.You haven't shown us your page, so I can't be certain, but the chances of you having found a layout that's impossible to do without tables or absolute positioning is quite small. They do exist (mostly thanks to IE's bad CSS support; if IE supported display: table-cell; we could use that and create table-like layouts with semantic markup), but I doubt you have one.
Dude, You need some fresh air.There's a ruddy big hole in my roof, I've enough of that thanks :)
Think about how many people use 100% "Clean" Code.Well me for one. A fair amount of people actually make the effort, although they usually aren't too knowledgeable about the options available to them and end up using absolute positioning or something equally nasty.
P.S. The only reason that W3 doesn't drop the <table> tag in HTML 5.0 is that 90% of Webmasters would riot in front of their HQ, terring down each peice of wood, destroing DNS Servers, Ripping apart Ethernet wires, Trashing computers, and blowing up the building.Er, no... the reason they don't remove the <table> tag is that people actually need to use it. The <table> tag is meant for building (surprise) tables, not layouts.
fileserverdirect
08-14-2007, 02:59 PM
The <table> tag is meant for building (surprise) tables, not layouts.
True, but I think that tables are "easy" code. It may be what you call "messey" code, but there is no way I am finding out what percice location in pixels its located. Besides, what will it look linke in a non-css supporting browser, ah?
There's a ruddy big hole in my roof, I've enough of that thanks
Sorry to hear about that, What happens when it rain's?
P.S. The "farest nested" table is about 4 in, not counting the 1 postion:absoulte to postion everything at 0,0 in the window.
-----YAY 50 POSTS!------
It may be what you call "messey" code, but there is no way I am finding out what percice location in pixels its located.The point of designing proper, flexible layouts is that you don't have to care about pixel positions.
Besides, what will it look linke in a non-css supporting browser, ah?Pretty decent, actually, if you structure your markup properly. Check out my site (http://www.twey.co.uk/) in any browser you choose, at any resolution you choose -- it looks decent on mobile browsers, high resolutions, low resolutions, text-only browsers...
Sorry to hear about that, What happens when it rain's?I have a bucket. Damn builder's on holiday :-\
P.S. The "farest nested" table is about 4 in, not counting the 1 postion:absoulte to postion everything at 0,0 in the window.Ouch. Why would you do that? Everything's positioned there by default anyway, you just have to take off the margins...
fileserverdirect
08-14-2007, 04:00 PM
Ouch. Why would you do that? Everything's positioned there by default anyway, you just have to take off the margins...
Yes, But it has 2 <td>'s One for the page and one for the "scrollable" Valid HTML 4.1 Strict.
Check out my site in any browser you choose, at any resolution you choose -- it looks decent on mobile browsers, high resolutions, low resolutions, text-only browsers...
I checked it in Off By One and your background pic for the main section of you site showed up after 60seconds and it appeared as the first thing on your page...
P.S. My website has a total width of 800px. So in any resoultion it will fit. I detect if the resoultion width is 800px, then if it is take away last coloum( the Valid Document icon is outside the 800px)
I checked it in Off By One and your background pic for the main section of you site showed up after 60seconds and it appeared as the first thing on your page...Oh really? Off By One is unusual in its rendering order then... most browsers download that in the background. Nevertheless, it's not a terribly serious error, since it doesn't affect the page. I'd normally fix it, but I'm doing a complete site redesign currently anyway. This is interesting, but doesn't have much to do with the question at hand.
P.S. My website has a total width of 800px. So in any resoultion it will fit.Eh? This is a wonderfully self-contradictory statement... in low resolutions or small windows (less than 800px width) it obviously won't fit. Less obviously, even those running 800×600 will find themselves with scrollbars, since window chrome and other various decorations will take up some screen real estate. Probably most obscure is the fact that fonts do not scale in proportion to screen resolution since this would make them unreadable. Instead, because you've used pixels for your layout, someone with a very large screen resolution (or otherwise unusually large fonts) is going to end up with very little content per line -- perhaps only one or two words in an extreme case. If you're designing using pixels it's likely that you've specified the height of your document using pixels too; if this is the case, the text will begin to overflow from your carefully-laid designs onto other elements and out on top of the <body>.
fileserverdirect
08-14-2007, 05:14 PM
Eh? This is a wonderfully self-contradictory statement... in low resolutions or small windows (less than 800px width) it obviously won't fit. Less obviously, even those running 800×600 will find themselves with scrollbars, since window chrome and other various decorations will take up some screen real estate. Probably most obscure is the fact that fonts do not scale in proportion to screen resolution since this would make them unreadable. Instead, because you've used pixels for your layout, someone with a very large screen resolution (or otherwise unusually large fonts) is going to end up with very little content per line -- perhaps only one or two words in an extreme case. If you're designing using pixels it's likely that you've specified the height of your document using pixels too; if this is the case, the text will begin to overflow from your carefully-laid designs onto other elements and out on top of the <body>.
There are a few things I have to say:
1)People will just have to deal with it
2)I tested the font size as "Largest" and everything was O.K. Thanks to CSS
3)I do not use a "height" attribute, only in certain images\flash stuff
4)I have not seen a screen less than 800X600 in my life
5)My site will go throgh beta testing, so people can tests out features, see if everything works, etc. I will make modifications then, without a major re-design
----
Off By One Does not support CSS1 or 2 so your page looked pretty bleak, At least I have a fall-back plan, forget HTML 4.1 Strict, I will make it Transitonal and add all the <font> tags I want.
1)People will just have to deal with itEh? You care about Off By One, a browser I'd only actually ever heard mentions of before now (and hey, I've tries some pretty obscure browsers; Dillo anyone?) but the rapidly-growing mobile user base "will just have to deal with it?" Seems like a bit of a double standard going on here...
2)I tested the font size as "Largest" and everything was O.K. Thanks to CSSIE, huh. Like I said, fonts can get much bigger on other resolutions. Fire it up in Firefox and hit ctrl-= a few times.
3)I do not use a "height" attribute, only in certain images\flash stuffGood.
4)I have not seen a screen less than 800X600 in my lifeYou've led a very privileged life, then. I have several 640×480 max monitors and graphics cards lying about. The mobile user base, again, is going to make up a large percentage of these nowadays (a common screen resolution is something like 320×300 if I remember correctly).
Off By One Does not support CSS1 or 2 so your page looked pretty bleak, At least I have a fall-back plan, forget HTML 4.1 Strict, I will make it Transitonal and add all the <font> tags I want.No no, you can't do that, telnet doesn't support HTML, you'll have to write it all using Markdown :p
boogyman
08-14-2007, 05:41 PM
you can give me all the crap about a bs post but i think this needs to be said.
does someone smell a tantrum ?
why are you coming here asking for help, then when one of the most knowledgeable people on the site offer his help you criticize and attack the suggesting and critique that you asked for.
Within every website, there are choices that need to be made, and a big part about what a developer needs to recognize and develop for its audience. A couple of months ago I designed a site for an online gaming company, and presently I am working on a site for a global printing company. Now while both of these sites have the necessity of being able to be viewed globally, they have some very unique "customer/client" base. The online gaming company was set up in such a way that the user needed to be using a screen resolution that was above 800x600, thus they had a lot less restrictions about how wide I needed to make the site. Where the global printing company's site that I am working on now needs to have the ability to be readable on palm pilot type devices. Two sites, two global markets, two very distinct design requirements.
So yes, while it would be nice for every site to have be accessible on every single platform available, it may not necessary be logical. Twey was just attempting to respond to the question at hand, and give you some constructive criticism about how to make your code standards-compliant and viewable on all browsers, not just Micro$hafts Intercrap Explorer
Hmm? There's no tantrum going on here. fileserverdirect may have a point that I'm missing or s/he may be missing a point him/herself, but the discussion is calm.
why are you coming here asking for help, then when one of the most knowledgeable people on the site offer his help you criticize and attack the suggesting and critique that you asked for.Just because someone asks for help doesn't necessarily mean that the helper will be infallible in that particular area :) By exchanging ideas we enhance our mutual knowledge.
Twey was just attempting to respond to the question at hand, and give you some constructive criticism about how to make your code standards-compliant and viewable on all browsers, not just Micro$hafts Intercrap ExplorerThe code is viewable on all (or at least most) browsers. It's different screen and window areas that may pose a problem here.
fileserverdirect
08-14-2007, 10:20 PM
I think I need to settle some things here. A My site is not ment to be used moblily, besides, if people do visit it on their iPhone or whatever I will add a .mobi at only 20 more bucks a year. Twey: What I mean by "People will just have to deal with it" is that "People will just have to scroll over 1 inch, big deal. Besides what percentage of computers have a resoultion of less than 800X600 that are not mobile phones. Less than 2%? And what percentage of that 2% will ever visit my website .01%?
No no, you can't do that, telnet doesn't support HTML, you'll have to write it all using Markdown Come on, who uses telnet anymore?
Micro$hafts Intercrap Explorer Cool Browser, is it on the "B@t|-|room t@|_k n3t\/\/ork?:)
What I mean by "People will just have to deal with it" is that "People will just have to scroll over 1 inch, big deal.Generally I agree, although it's always better to avoid any inconveniences where possible. In this case, however, it could result in your content being much harder to read (if, e.g., you end up with a character on each line).
Come on, who uses telnet anymore?Well, me actually, but usually only for debugging. Come on, who uses browsers that don't support CSS any more? :) I'm a big fan of forwards-compatibility, but I couldn't care less about backwards compatibility unless there's some very specific reasoning behind not upgrading. I certainly wouldn't bother adding presentational markup for non-CSS browsers; I support them (they can read my content) as a side effect of laying out my pages neatly, but they won't get any of the page style -- but then I suspect anyone using such a browser would be used to it, since most of the Web will display the same and worse. These effects are optional. Layers upon layers of fallback: plugins might fall back to script might fall back to CSS might fall back to plain HTML. The final layer of fallback is, of course, for the user to have to view the raw HTML.
fileserverdirect
08-15-2007, 04:02 PM
----PRE-POST----
There is just one thing I have to say here before my post:
The title of this thread is DOCTYPE, which got in to compatiblilty, which started a Clean Code fight over nested tables, then some boogyman comes and complians about some weird browser that I have never heard of, Im just sayin...
why are you coming here asking for help, then when one of the most knowledgeable people on the site offer his help you criticize and attack the suggesting and critique that you asked for.
I was origainly posting about my DOCTYPE Problem, hence the title.
----POST----
Layers upon layers of fallback: plugins might fall back to script might fall back to CSS might fall back to plain HTML. The final layer of fallback is, of course, for the user to have to view the raw HTML. O.K. As I said before in a eariler post: 1% of people have browsers that don't support HTML, 0.000000000001% will ever view your site which is about less than 1 person. I only have one fall back (<no script> and <font>).
Nobody has a web browser that doesn't support HTML*, it's pretty much a definition of a web browser.
O.K. As I said before in a eariler post: 1% of people have browsers that don't support HTML<font> provides fallback for the very small number of users out there whose browsers don't support CSS (which today is equal or very close to the number of users whose browsers don't support HTML*, I'd suspect). Since it introduces inconsistencies to your site, requires you to use a DOCTYPE that should have been left behind a decade ago, and prevents you from controlling style site-wide by use of a central stylesheet, the costs most definitely outweigh the benefits, if any benefits do actually exist.
* Or one of its variants. Some mobile devices support CHTML, a subset of HTML.
fileserverdirect
08-15-2007, 08:22 PM
Nobody has a web browser that doesn't support HTML*, it's pretty much a definition of a web browser. Ok,You said:
No no, you can't do that, telnet doesn't support HTML, you'll have to write it all using Markdown Thats What I meant by a "Fall-back" plan(the first quote).
OK,You said:
No no, you can't do that, telnet doesn't support HTML, you'll have to write it all using MarkdownSarcasm. It's noted as a British form of humour, my apologies.
tech_support
08-16-2007, 06:54 AM
Note that over half dont work in IE5.5 Mac anyways(Mac's are sooooo over-rated). I have IE7 on an xp SP2 so then again... Well never mind.
It's not the Mac's fault. IE5 is a ruddy terrible browser -- the Mac version is actually less buggy than the Windows version.
Don't worry. Even Microsoft's page doesn't display correctly in IE5.5 Mac.
fileserverdirect
08-16-2007, 02:27 PM
Sarcasm. It's noted as a British form of humour, my apologies. no wonder you have said
ruddy all the time :)
-----
Ok, now I think this topic is finished, I have other problems with my website now, and I think I should start a new thread with that problem, but your welcome to join in, its some javascript problem, so look for it in the Javascript section. I am going to give Twey a "Thanks" mainly not for that exact post, but for putting up with me this entire topic. Thanks. :)
Powered by vBulletin® Version 4.2.2 Copyright © 2021 vBulletin Solutions, Inc. All rights reserved.