Page 1 of 2 12 LastLast
Results 1 to 10 of 19

Thread: w3c validation 2 errors.. DOCTYPE related prob.

  1. #1
    Join Date
    Nov 2008
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default w3c validation 2 errors.. DOCTYPE related prob.

    I have just finished my webpage, almost, and I thought I'd run it through the w3c validation service. I'm not a web dev so all of this is copy and paste, its got java, javascript and html of course. Luckily I only have two errors, simple ones and was hoping somebody could tell me exactly what I need to do to remedy these:

    1: Mismatch between Public and System identifiers in the DOCTYPE declaration

    This document uses an inconsistent DOCTYPE declaration. The Public Identifier -//W3C//DTD HTML 4.01 Transitional//EN declares the HTML 4.01 Transitional document type, but the associated System Identifier Transitional is http://www.w3.org/TR/html4/loose.dtd does not match this document type.

    The recommended System Identifier for HTML 4.01 Transitional is http://www.w3.org/TR/html4/loose.dtd.

    The safest way to use a correct DOCTYPE declaration is to copy and paste one from the recommended list and avoid editing that part of your markup by hand.


    2: Line 4, Column 16: delimiter """ invalid: only delimiter ">", delimiter "[", "CDATA", "NDATA", "SDATA" and parameter separators are allowed.
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


    This stuff looks simple, but I've tried the suggestions it gives and not really understood it. my webpage is below so you can try it, thanks!

    http://www.projectmio.com

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    If I am correct which i think i am your problem is you've delcared all possible doc types as oppsed to 1.
    Replace your first line with this and you'll have more errors (but the real errors as oppesed to hiding them). Also It is case sensitive so your META should be meta. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">.


    Close your meta's

    was with this meta FireFox extension"> should be
    with this meta FireFox extension" />

    Add in the type in this case java
    was <script> should be<script type="text/javascript">

    Use the code for &
    was …heparameter=(url.indexOf("?")!=-1)? "&"+new Date().getTime() : "?"+new Date()
    should be
    …heparameter=(url.indexOf("?")!=-1)? "&amp;"+new Date().getTime() : "?"+new Date()

    Only declare body once you've declared it 3 times

    <body onload="moveWindow()" style="overflow: hidden">
    <div id="frontBottom"></div>
    <script type='text/javascript' src='breakinorout.js'>

    if your using a div id more than once its a class change it in html and in css from # to .
    <div id="content"> will be <div class="content">

    End your image tag and give it a description if it doesn't load and for apps that dont read the image to be able to the "/" at the end ends it the alt="" tells apps.

    /meta/buttonsettle1a.png" border="0" alt="whatever this image is" /></a></h2>

    Make sure to close all tags
    <br> should be <br />

    Try these changes and then rerun the test. If you still have questions post again.

  3. The Following User Says Thank You to bluewalrus For This Useful Post:

    tinkermob (12-01-2008)

  4. #3
    Join Date
    Jun 2005
    Location
    英国
    Posts
    11,876
    Thanks
    1
    Thanked 180 Times in 172 Posts
    Blog Entries
    2

    Default

    You almost certainly don't want an XHTML DOCTYPE — XHTML is currently unsupported by IE. You definitely don't want a transitional DOCTYPE — transitional DOCTYPEs are outdated, and nobody should have been using them for the past decade.

    The DOCTYPE you probably want to have there is
    Code:
    <DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    The bad news is that this error is the error that says it doesn't know how to detect all the other errors. You'll probably get a lot more once you fix it.

    Don't remove scrollbars from your page! Most users wouldn't think to use their keyboard to scroll down if there's no scrollbar available. My first reaction was 'well, that's a fairly useless page, isn't it.'

    For that matter, having that huuuge header at the top really violates one of the big principles of Web design: your user should be able to see what the page is about within a few seconds of loading it. All a user sees on your page after loading is a word 'met.a' and a dangly thing. The page looks a lot saner without Java, but buggers right up without Javascript — there's no way to access the content without copy-pasting the link hrefs and splicing them into the URL.

    Read and apply my common coding mistakes, on the technical side of things. If you need a Web development tutorial to get up to speed, I recommend http://www.howtocreate.co.uk/.
    Last edited by Twey; 12-02-2008 at 11:37 AM. Reason: s/linux/link/ — argh!
    Twey | I understand English | 日本語が分かります | mi jimpe fi le jbobau | mi esperanton komprenas | je comprends français | entiendo español | tôi ít hiểu tiếng Việt | ich verstehe ein bisschen Deutsch | beware XHTML | common coding mistakes | tutorials | various stuff | argh PHP!

  5. The Following User Says Thank You to Twey For This Useful Post:

    tinkermob (12-01-2008)

  6. #4
    Join Date
    Oct 2008
    Location
    Sweden
    Posts
    2,023
    Thanks
    17
    Thanked 319 Times in 318 Posts
    Blog Entries
    3

    Default

    I agree with Twey, your page is very user unfriendly atm.
    Eddy Proca
    I love Dropbox. Get it through my girlfriend's referral link (I reached my limit) and both you and her get 500 MB extra! Thanks and you're welcome!

  7. #5
    Join Date
    Nov 2008
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default I like my page even if w3c don't

    Thanks for both your replies, I did what you said and like you said I got a lot more errors - 10 errors and 39 warnings!

    I wanted this page to be accessible by all, not too bothered about IE users as IE seems like it doesn't like a lot of things but FF and Safari yes. I created seperate 800x600 and 640 versions (800.html and 640.html), a lot less Java in those. The site is art inspired and only took 30sec to draw on paper but weeks trying to make in real life, like I say I don't make webpages and this is my first, I stumbled upon w3c and wanted to make the best of it. The criteria for this site was to be open source only and completely different, so the rule book goes out the window for navigation.

    Any ideas
    Last edited by tinkermob; 12-01-2008 at 05:34 PM.

  8. #6
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,486
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    IE is still the most widely used browser by about 30% (give or take) and what about those of us running 1440x900 resolution or higher, and those of us on Linux (the heart of Open Source)

    Either your page isn't posted, or your redirect is very mean, but I can't access either page.

    Following W3C validation standards with a strict DOCTYPE will make your site near 100% compatible with all major browsers.
    {CWoT - Riddle } {OSTU - Psycho} {Invasion - Team}
    Follow Me on Twitter: @Negative_Chaos
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  9. #7
    Join Date
    Nov 2008
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default redirect code removed

    my redirect is mean and It shouldn't be up yet, sorry, my will hopefully be fine on anything over my own resolution of 128x654. Really the site was scaled down for 800x600 users and 640's, anything greater should be okay, I think.

    I am offering a FireFox extension, so the majority of visitors, who decide to visit from the Mozilla add-on site, are going to be FF users, the rest I bet Safari and some IE. A lot of the code I saw had concessions for IE, if not then this... sort of stuff, so I thought, stuff it, "if IE then though" is my code.

    I tried to get the code that would work cross platform and implement it as such, I don't know about Linux, why would my site not work on it? Is there a FF for Linux?

    try www.projectmio.com or www.meta.projectmio.com

    also www.projectmio.com/800.html
    and www.projectmio.com/640.html
    and www.projectmio.com/1024.html

    Thanks.

  10. #8
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,486
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    Yes there is firefox for linux, and konqueror and many others. Being browser specific is "fine" (said grudgingly) for something as specific as you are doing, but I didn't realize that the first time through.

    I can help get it validated if you can allow me to see the page
    {CWoT - Riddle } {OSTU - Psycho} {Invasion - Team}
    Follow Me on Twitter: @Negative_Chaos
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  11. #9
    Join Date
    Nov 2008
    Posts
    27
    Thanks
    3
    Thanked 0 Times in 0 Posts

    Default one step closer

    Thanks, the above links should work. Even out of the FF and Safari arena. I've never used the other ones an like I said I did try to pick the scripts with the least resistance.

    Still game?

  12. #10
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    This might work since you said you dont care about IE i took out your if statements.
    Also the content is now a class so make that .content instead of #content.
    This brings it down to 6 not sure if it'll display everything the way it should so I'd wait for someone else that's a little better to look at it.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <!-- charset must remain utf-8 to be handled properly by Processing -->
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <meta name="description" content="add relevant metadata automatically to the images you download with this meta FireFox extension" />
    <link rel="shortcut icon" href="http://www.projectmio.com/imagery/meta/favicon_w.ico"/>
    <title>met.a</title>
    <style type="text/css">
    /* <![CDATA[ */
    body {
    margin: 0px 0px 0px 100px;
    font-family: Century Gothic; 
    font-size: 11px; 
    background-color: #white; 
    text-decoration: none; 
    font-weight: normal; 
    line-height: normal; 
    }
    p {font-family: Century Gothic}
    a          { color: #3399cc; }
    		a:link     { color: #3399cc; text-decoration: underline; }
    		a:visited  { color: #3399cc; text-decoration: underline; }
    		a:active   { color: #3399cc; text-decoration: underline; }
    		a:hover    { color: White; text-decoration: underline; background-color:#797979}		
    		/* ]]> */
    h2.pos_abs
    {
    position:absolute;
    left:836px;
    bottom:0px;
    margin:0px;
    }
    h3.pos_abs
    {
    position:absolute;
    left:75%;
    top:100px;
    margin:0px;
    font-family: arial;
    font-size:33px;
    color: #797979;
    }
    .pos_abs
    {
    position:absolute;
    left:839px;
    top:100%;
    margin:0px;
    }
    .pos_abs2
    {
    position:absolute;
    left:70%;
    top:196%;
    color: white;
    }
    #leftcolumn{
    float:left;
    width:150px;
    height: 200px;
    border: 0px;
    padding: 5px;
    padding-left: 8px;
    
    }
    
    #leftcolumn a{
    padding: 3px 1px;
    display: block;
    width: 100%;
    text-decoration: none;
    font-weight: normal;
    border-bottom: 1px solid gray;
    }
    
    #leftcolumn a:hover{
    background-color: #797979;
    }
    
    #rightcolumn{
    float:left;
    width:550px;
    min-height: 200px;
    border: 0px;
    margin-left: 10px;
    padding: 5px;
    padding-bottom: 0px;
    }
    img {
    border:0;
    }
    </style>
    <script type='text/javascript' src='http://www.projectmio.com/code/meta/softscroll.js'></script>
    <script type='text/javascript'>
    // SoftScroll.go("section20");
    </script>
    <script type="text/javascript">
    
    /***********************************************
    * Dynamic Ajax Content- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
    * This notice MUST stay intact for legal use
    * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
    * http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm
    ***********************************************/
    
    var bustcachevar=1 //bust potential caching of external pages after initial request? (1=yes, 0=no)
    var loadedobjects=""
    var rootdomain="http://"+window.location.hostname
    var bustcacheparameter=""
    
    function ajaxpage(url, containerid){
    var page_request = false
    if (window.XMLHttpRequest) // if Mozilla, Safari etc
    page_request = new XMLHttpRequest()
    else if (window.ActiveXObject){ // if IE
    try {
    page_request = new ActiveXObject("Msxml2.XMLHTTP")
    } 
    catch (e){
    try{
    page_request = new ActiveXObject("Microsoft.XMLHTTP")
    }
    catch (e){}
    }
    }
    else
    return false
    page_request.onreadystatechange=function(){
    loadpage(page_request, containerid)
    }
    if (bustcachevar) //if bust caching of external page
    bustcacheparameter=(url.indexOf("?")!=-1)? "&amp;"+new Date().getTime() : "?"+new Date().getTime()
    page_request.open('GET', url+bustcacheparameter, true)
    page_request.send(null)
    }
    
    function loadpage(page_request, containerid){
    if (page_request.readyState == 4 &amp;&amp; (page_request.status==200 || window.location.href.indexOf("http")==-1))
    document.getElementById(containerid).innerHTML=page_request.responseText
    }
    
    function loadobjs(){
    if (!document.getElementById)
    return
    for (i=0; i<arguments.length; i++){
    var file=arguments[i]
    var fileref=""
    if (loadedobjects.indexOf(file)==-1){ //Check to see if this object has not already been added to page before proceeding
    if (file.indexOf(".js")!=-1){ //If object is a js file
    fileref=document.createElement('script')
    fileref.setAttribute("type","text/javascript");
    fileref.setAttribute("src", file);
    }
    else if (file.indexOf(".css")!=-1){ //If object is a css file
    fileref=document.createElement("link")
    fileref.setAttribute("rel", "stylesheet");
    fileref.setAttribute("type", "text/css");
    fileref.setAttribute("href", file);
    }
    }
    if (fileref!=""){
    document.getElementsByTagName("head").item(0).appendChild(fileref)
    loadedobjects+=file+" " //Remember this object as being already added to page
    }
    }
    }
    
    </script>
    
    <script type="text/javascript">//<![CDATA[ 
    function JumpToAnchor(anchorName) 
    { 
      SoftScroll.init(); 
      SoftScroll.go(anchorName); 
    } 
    //]]> 
    </script> 
    
    </head>
    
    <body onload="moveWindow()"  style="overflow: hidden">
    <script type='text/javascript' src='breakinorout.js'>
    </script>
    <div id="frontBottom"></div>
    <div class="content">
    			<div id="attempt8_container">			
    				<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" 
    						codebase="http://java.sun.com/update/1.5.0/jinstall-1_5_0_15-windows-i586.cab"
    						width="600" height="600"	standby="Loading Processing software..."  >
    					<param name="code" value="attempt8" />
    					<param name="archive" value="/code/meta/attempt8.jar,/code/meta/core.jar" />
    					<param name="mayscript" value="true" />
    					<param name="scriptable" value="true" />
    					<param name="image" value="loading.gif" />
    					<param name="boxmessage" value="Loading Processing software..." />
    					<param name="boxbgcolor" value="#FFFFFF" />
    					<param name="test_string" value="inner" />
    					<p>
    
    						<strong>
    							This browser does not have a Java Plug-in.
    							<br />
    							<a href="http://java.sun.com/products/plugin/downloads/index.html" title="Download Java Plug-in">
    								Get the latest Java Plug-in here.
    							</a>
    						</strong>
    					</p>
    				</object>
    			</div>
    			
    		</div>
    <div class="pos_abs">
    		<div class="content">
    			<div id="half_Ocillation_Recursion_v4a_container">	
    				<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93"  codebase="http://java.sun.com/update/1.5.0/jinstall-1_5_0_15-windows-i586.cab"
    					width="100" height="100" standby="Loading Processing software..."  >
    					<param name="code" value="half_Ocillation_Recursion_v4a" />
    					<param name="archive" value="/code/meta/half_Ocillation_Recursion_v4a.jar,/code/meta/core.jar" />
    					<param name="mayscript" value="true" />
    					<param name="scriptable" value="true" />
    					<param name="image" value="loading.gif" />
    					<param name="boxmessage" value="Loading Processing software..." />
    					<param name="boxbgcolor" value="#FFFFFF" />
    					<param name="test_string" value="inner" />
    					<p>
    						<strong>
    							This browser does not have a Java Plug-in.
    							<br/>
    							<a href="http://java.sun.com/products/plugin/downloads/index.html" title="Download Java Plug-in">
    								Get the latest Java Plug-in here.
    							</a>
    						</strong>
    					</p>
    				</object>
    				</div>
    </div>
    </div>
    <h2 class="pos_abs">
    <a href="#Bottom" onclick="JumpToAnchor('Bottom'); return(false);"><img src="/imagery/meta/buttonsettle1a.png" alt="image" /></a></h2>
    <h3 class="pos_abs">
    met.a<br /></h3>
    <div id="leftcolumn">
    <a href="javascript:ajaxpage('/code/meta/what.htm', 'rightcolumn');">☃ What is <b>met.a</b> ??</a>
    <a href="javascript:ajaxpage('/code/meta/guts.htm', 'rightcolumn');">☃ <b>met.a</b> has guts</a>
    <a href="javascript:ajaxpage('/code/meta/osx.htm', 'rightcolumn');">☃ <b>met.a</b> on Mac OSX</a>
    <a href="javascript:ajaxpage('/code/meta/win.htm', 'rightcolumn');">☃ <b>met.a</b> on Vista</a>
    <a href="javascript:ajaxpage('/code/meta/thoughts.htm', 'rightcolumn');">☃ Thoughts behind <b>met.a</b></a>
    <a href="javascript:ajaxpage('/code/meta/changelog.htm', 'rightcolumn');">☃ changelog</a>
    <a href="javascript:ajaxpage('/code/meta/feedback.htm', 'rightcolumn');">☃ feedback</a>
    <script type="text/javascript">
    ajaxpage('/code/meta/what.htm', 'rightcolumn')
    </script>
    </div>
    <div id="rightcolumn"><h3>Choose a page to load.</h3></div>
    <div style="clear: left; margin-bottom: 1em"></div>
    <div class="pos_abs">
    <div id='Bottom'>_</div>
    </div></body>
    </html>

Tags for this Thread

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •