SitePoint Sponsor

User Tag List

Results 1 to 7 of 7
  1. #1
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Viewing and validating generated code

    I'm doing the design work on a site with a developer who's doing most of the actual coding. There was one place where my styles weren't working, and the first thing I usually check is to make sure there aren't any validation errors. I'm validating locally because the site isn't live yet. I used the Validate Local HTML on the Web Developer's Toolbar and got this error message:

    Line 131, Column 23: end tag for "tbody" which is not finished.

    </tbody>

    Most likely, you nested tags and closed them in the wrong order. For example <p><em>...</p> is not acceptable, as <em> must be closed before <p>. Acceptable nesting is: <p><em>...</em></p>

    Another possibility is that you used an element which requires a child element that you did not include. Hence the parent element is "not finished", not complete. For instance, in HTML the <head> element must contain a <title> child element, lists (ul, ol, dl) require list items (li, or dt, dd), and so on.

    I looked at the code and it seemed to me that the code was probably correct but that the tr's and td's were being generated and the Local Validator wasn't picking that up. Then I tried the View Generated Source (also on the Web Developer Toolbar) and pasted the output into the W3C "Validate by direct input" tool. It spit out 161 errors and 1 warning. I sent the code to the developer who said that it looked to him like most of the errors were being generated by the Web Developer Toolkit and not actually in the code itself. Have the rest of you had trouble with the View Generated Source tool? If so, is there a better way to grab the generated code?

    My developer also said that most of the rest of the errors appeared to be from missing alt tags (we're using XHTML transitional) and that developers don't typically include alt tags in generated code. That doesn't sound right to me but I wanted to double check before I get back to him. Any thoughts on that?

    Here's the generated portion of the code that I think the errors are coming from:

    HTML Code:
     <table id="t_procedures" cellpadding="0" cellspacing="0">
    			  	<thead>
    			  	<tr>
    			    	<th><img src="_images/edit.png" alt="Edit CPT Codes"></th>
    					<th><img src="_images/delete.png" alt="Delete CPT Codes"></th>
    					<th>Number</th>
    					<th>Short Description</th>
    					<th>Description</th>
    
    					<th>Minutes</th>
    					<th>Fee</th>
    				</tr>
    				</thead>
    				<tbody>
                    <tr><td><img style="cursor: pointer;" src="_images/editIcon.png"></td><td><img style="cursor: pointer;" src="_images/deleteIcon.png"></td><td>90808</td><td>SS</td><td>Individual psychotherapy, insight oriented, behavior modifying and/or supportive, in an office or outpatient facility, approx. 75 to 80 min. face-to-face with the patient</td><td>75</td><td>$280.00</td></tr><tr><td><img style="cursor: pointer;" src="_images/editIcon.png"></td><td><img style="cursor: pointer;" src="_images/deleteIcon.png"></td><td>Late Can</td><td>Description.
    
    
    </td><td>Custom billing code</td><td>-</td><td>$150.00</td></tr><tr><td><img style="cursor: pointer;" src="_images/editIcon.png"></td><td><img style="cursor: pointer;" src="_images/deleteIcon.png"></td><td>90806</td><td>Individual therapy 45-50 minutes.
    </td><td>Individual psychotherapy, insight oriented, behavior modifying and/or supportive, in an office or outpatient facility, approx. 45 to 50 min. face-to- face with the patient</td><td>50</td><td>$150.00</td></tr></tbody>
                 </table>
    <script type="text/javascript">
    //<![CDATA[
    dHTML.createWidget('t_procedures','TableProcedures','t_procedures',[{type:"Procedure","id":"1","providerID":"1","procedureStatus":"1","code":"90806","codeType":"CPT","default_fee":"150.00","default_duration":"50","units":"UN","code_text_short":"Individual therapy 45-50 minutes.\n","code_text":"Individual psychotherapy, insight oriented, behavior modifying and/or supportive, in an office or outpatient facility, approx. 45 to 50 min. face-to- face with the patient"},{type:"Procedure","id":"2","providerID":"1","procedureStatus":"1","code":"Late Can","codeType":"Billing","default_fee":"150.00","default_duration":"","units":"UN","code_text_short":"Description.\n\n","code_text":""},{type:"Procedure","id":"3","providerID":"1","procedureStatus":"1","code":"90808","codeType":"CPT","default_fee":"280.00","default_duration":"75","units":"UN","code_text_short":"SS","code_text":"Individual psychotherapy, insight oriented, behavior modifying and/or supportive, in an office or outpatient facility, approx. 75 to 80 min. face-to-face with the patient"}]);
    //]]>
    </script>

  2. #2
    Resident curmudgeon bronze trophy gary.turner's Avatar
    Join Date
    Jan 2009
    Location
    Dallas
    Posts
    990
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    My developer also said that most of the rest of the errors appeared to be from missing alt tags (we're using XHTML transitional) and that developers don't typically include alt tags in generated code. That doesn't sound right to me but I wanted to double check before I get back to him. Any thoughts on that?
    He's blowing smoke up your nether regions. If he can insert the images, he can include the alt text.

    cheers,

    gary
    Anyone can build a usable website. It takes a graphic
    designer to make it slow, confusing, and painful to use.

    Simple minded html & css demos and tutorials

  3. #3
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    That's what I thought, too.

    I've been doing some more research on the Web Development Toolbar. It looks like that the generated code IS wrong but it's not a bug with the Toolbar, but rather a problem with Firefox. Evidently the solution is to use the application/xhtml+xml MIME type. However, some of the articles I'm reading say that if you send XHTML as application/xhtml+xml, that it's not supported by IE6 and will throw errors. Yikes. I still have to support IE6. Should go back to HTML? Or are there better ways to validate the generated source? If I go ahead and put this up on the web, can I run it through a regular validator there and get reliable results? On the local validation, none of the generated source shows up.

    If I should use the application/xhtml+xml MIME type, what's the syntax for that? What we have now is:

    <html xmlns="http://www.w3.org/1999/xhtml"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>ShrinkOffice</title>
    <meta name="description" content="">

    What parts of that do I change so the MIME type is application/xhtml+xml?

  4. #4
    SitePoint Zealot
    Join Date
    Mar 2008
    Posts
    116
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by tryin_to_learn View Post
    .......... Evidently the solution is to use the application/xhtml+xml MIME type. However, some of the articles I'm reading say that if you send XHTML as application/xhtml+xml, that it's not supported by IE6 and will throw errors. Yikes. I still have to support IE6. Should go back to HTML? ..........
    Correct in that IE does not support XHTML served as content (MIME) type application/xhtml+xml -- forget it and use HTML 4.01 with a strict DTD/Doctype. (BTW XHTML served as text/html it is actually good old HTML)

    .......... If I should use the application/xhtml+xml MIME type, what's the syntax for that? What we have now is:

    <html xmlns="http://www.w3.org/1999/xhtml"><head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>ShrinkOffice</title>
    <meta name="description" content="">

    What parts of that do I change so the MIME type is application/xhtml+xml?
    Well, of course, don't use content (MIME) type application/xhtml+xml. However, there is no "syntax" for it -- it is served by configuring the Web Service Provider software to do so (association via .htaccess) or server side scripting. Content-Type designation in a Meta tag is only informational -- it does not determine how documents are actually served.

    James
    Last edited by jamesicus; Mar 4, 2009 at 21:47. Reason: changed info around

  5. #5
    billycundiff{float:left;} silver trophybronze trophy RyanReese's Avatar
    Join Date
    Oct 2008
    Location
    Whiteford, Maryland, United States
    Posts
    13,754
    Mentioned
    11 Post(s)
    Tagged
    0 Thread(s)
    I checked that table with the validator (and I eye-validated it) and all tags are accounted for. That validator is crap.

    PS: Get a new developer.
    Always looking for web design/development work.
    http://www.CodeFundamentals.com

  6. #6
    SitePoint Evangelist
    Join Date
    Aug 2005
    Posts
    574
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    More on the alt attribute issue. My developer is saying this:

    Alt tag does not serve for popup text even it is used for it. Title attribute is used for this goal.

    Is that correct? Is he saying that even if he adds the alt tag, it still won't appear - which means that the site still wouldn't validate if we keep XHTML? I really am wondering if it would be better to just go back to HTML like jamesicus suggested.

    Also - screenreaders read alt tags. If there's not an alt tag, do they also read title tags? Like if the developer is correct and the alt tags won't serve in popup text, will screenreaders still be able to read the images? These images are tool icons (e.g., edit and delete) so they're pretty important.

    P.S. I like my developer - I'm keeping him. I do think he comes more from a programming background, though, whereas I come from a Web background so we often come at things from different angles.

  7. #7
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,283
    Mentioned
    51 Post(s)
    Tagged
    2 Thread(s)
    More on the alt attribute issue. My developer is saying this:

    Alt tag does not serve for popup text even it is used for it. Title attribute is used for this goal.

    Is that correct? Is he saying that even if he adds the alt tag, it still won't appear - which means that the site still wouldn't validate if we keep XHTML? I really am wondering if it would be better to just go back to HTML like jamesicus suggested.
    He is correct, the alt attribute does not serve for popup text, and title does. This is absolutely correct. However Internut Exploder will treat the alt text like title text, and many people are used to alt text appearing on :hover.

    What he means by "it won't appear" is true when images are on and someone not using IE hovers their mouse over the image. Alt text only appears (and only should appear) when the images do not (because the user has them turned off or blocked, or because you have a faulty path name, or whatever).

    At the very least, your developer can make the code valid by adding empty alt attributes: alt="". However this is telling visitors who use alt text that those images mean nothing. If this is not true, then you will need some way of adding in the text.
    (in another thread I just posted a situation where we have people dynamically uploading photos and cannot provide correct alt text, and use (or should be using!) alt="")

    and that developers don't typically include alt tags in generated code.
    Well, he may be correct that most developers don't bother... but everyone might be jaywalking too. It's just a handy way to inconvenience some of your visitors, by not supplying some alt text.


    Also - screenreaders read alt tags. If there's not an alt tag, do they also read title tags? Like if the developer is correct and the alt tags won't serve in popup text, will screenreaders still be able to read the images? These images are tool icons (e.g., edit and delete) so they're pretty important.
    Ah, these are standard, repeating icons, generated dynamically? He can and should add in the alt text-- just add to the block of code that holds the icon, since it's the same icon over and over again. The title text is as far as I know read out in anchors and abbr tags, however I don't know if they are always read out by every screen reader when on an image-- however these icons, are they also actually form controls?? Can the user edit or delete things with them? Are they working like check boxes? In which case, you could also have off-screen labels for the screeners and lynxers, while sighted visitors just have the icon (and title text, yes this is important for the sighted too!... I remember my mother always forgetting "what the little flag in the water" meant in her car. Yikes!)

    P.S. I like my developer - I'm keeping him. I do think he comes more from a programming background, though, whereas I come from a Web background so we often come at things from different angles.
    Sounds like your developer should come here for tips and tricks on things like adding alt and title text in the right places, and how to get around any technical obsticals he may be running into.


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
  •