SitePoint Sponsor

User Tag List

Results 1 to 17 of 17
  1. #1
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Validation errors due to Javascript?

    I recently hired a freelancer to validate all the code for my Wordpress e-commerce website (http://www.projectdisobey.com/disobeyclothing)

    He told me that he had finished validating everything, but when I tested each page out using the validation service at http://validator.w3.org/, I came across a whole load of validation errors (http://www.projectdisobey.com/disobe...tionErrors.jpg). I notified the freelancer of this and his reply was:

    "The errors left are because of javascript in the source code. The website http://validator.w3.org checks the source code of the page and gives errors on javascript because the checker is not for Javascript. It checks it as a html/css and gives errors."

    Since I am no expert in this field, can anybody tell me from glancing over the list of validation errors (http://www.projectdisobey.com/disobe...tionErrors.jpg) whether he is speaking the truth or not? If any of the errors have nothing to do with Javascript and are easy to resolve, would anybody mind advising me how to do so? I'd be extremely appreciative.

    Thanks guys...

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    I only see one html error in the W3C validator. There are lots more CSS issues, some of them just because of the use of CSS3.

    I couldn't see your screen shots, though. Why not post them here? I clicked on them and just got directed to some sleazy poker website. (Someone needs to flush imageshack down the toilet.)

  3. #3
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Try the link now. I uploaded the image to my own server.

    Thanks for your help.

  4. #4
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    OK, most of those look extremely minor. In URLs it's better to use & rather than &, and most of the notes refer to that. Yes, it does seem most of the errors relate to what the JS is outputting.

  5. #5
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks. Is there any way I can validate the Javascript? Is there a validator service that validates the CSS, HTML and Javascript together?

  6. #6
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I just want to be sure all the coding is correct before I go live with the site.

  7. #7
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Validation is really just a way of checking for potential problems. It usually doesn't mean that the site won't work, but rather that, from a purist point of view, some of the code is not as pure as possible.

    The validator has flagged potential issues with the JS, so you don't really need more than that. The next step would be to go and edit the JS files.

    A bigger issue is the outdated document type that the site is using:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    That should only be used for sites from the 1990s, so why that gets used on new sites is beyond me. If you really want to validate your site, update that doctype (at the top of each page) to

    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" lang="en" xml:lang="en">
    Then if you revalidate, you will get a much better sense of how well coded the site is. The transitional doctype was designed to help old, outdated sites survive on the web ... until they got updated.

  8. #8
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I changed the document type and unsurprisingly it brought up even more errors. To be honest, I am behind schedule already and don't want to create any more unnecessary work for myself. I need to go live with the site as soon as possible. Is it that big of a deal if I stick the the document type I had originally?

    My main concern is that my site works bug-free in all (or at least 95% ideally) browsers. As long as I can be confident of that, I am happy.

    Is there anything in particular that I need to edit within the JS files?

  9. #9
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by harveylester View Post
    Is it that big of a deal if I stick the the document type I had originally?
    No, it shouldn't matter. The best thing to do is check your site in the main browsers, and if it's working, you are good to go. As I said, validation only alerts you to possible problems, but browsers are pretty forgiving.

    Is there anything in particular that I need to edit within the JS files?
    From my quick look, the main thing to change would be to replace & with &amp; in URLs.

  10. #10
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have tested it extensively in all the main browsers and I haven't had any problems whatsoever, except some compatibility issues with IE (surprise, surprise).

    I will edit the JS files accordingly. Thanks for your help!

  11. #11
    SitePoint Wizard Stomme poes's Avatar
    Join Date
    Aug 2007
    Location
    Netherlands
    Posts
    10,276
    Mentioned
    50 Post(s)
    Tagged
    2 Thread(s)
    That should only be used for sites from the 1990s, so why that gets used on new sites is beyond me.
    It's default for Wordpress, except some of the newer versions use the HTML5 doctype, which, if you're validating with that, is almost as bad as the Tranny doctype.

  12. #12
    Programming Since 1978 silver trophybronze trophy felgall's Avatar
    Join Date
    Sep 2005
    Location
    Sydney, NSW, Australia
    Posts
    16,810
    Mentioned
    25 Post(s)
    Tagged
    1 Thread(s)
    The JavaScript validator can be found at http://jslint.com/

    You just need to select "Assume a browser" when validating JavaScript that is to run in a web browser and leave all the other checkboxes empty.
    Stephen J Chapman

    javascriptexample.net, Book Reviews, follow me on Twitter
    HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
    <input name="html5" type="text" required pattern="^$">

  13. #13
    SitePoint Member
    Join Date
    Oct 2011
    Location
    USA
    Posts
    5
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by harveylester View Post
    Since I am no expert in this field, can anybody tell me from glancing over the list of validation errors (http://www.projectdisobey.com/disobe...tionErrors.jpg) whether he is speaking the truth or not? If any of the errors have nothing to do with Javascript and are easy to resolve, would anybody mind advising me how to do so? I'd be extremely appreciative.

    Thanks guys...
    I don't understand why you would not just trust the guy you hired. Since the guy you hired is the expert in the field, and you are not, I am confused. You could ask him to explain these errors and the possible consequences of leaving them as is.

    I hope your freelancer does not lurk these forums.

    Why did your free lancer not just request permission for access to the JS files then fix the errors himself?

  14. #14
    Sploghm bronze trophy Victorinox's Avatar
    Join Date
    Nov 2008
    Posts
    749
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    The site is still throwing up errors so here's a rundown of the Home page and a Product page.

    Home page: http://www.projectdisobey.com/disobeyclothing/

    Errors: 1

    Line 343, Column 16: end tag for element "div" which is not open


    The tag in question - a stray duplicate of </div><!-- content #end --> - is the last element in the page and lies outside the html element. Remove it and the page will validate.

    Also, hashes are used inappropriately in comments e.g. <!-- wrapper #end -->. # indicates an id. The standard comment format for indicating which element is being closed is <!-- #wrapper end --> (though the "end" is superfluous if the comment is next to a closing tag).


    A product page: http://www.projectdisobey.com/disobeyclothing/?p=400

    Errors: 16

    These are mostly due to the Validator reading javascript as HTML. To prevent this, mark up script as CDATA by placing // <=!=[=C=D=A=T=A=[ after the opening script tag and // ]=]=> before the closing script tag. You'll see that one script, beginning on line 54, already has this. i.e.

    Code:
    <script type="text/javascript">
    // <=!=[=C=D=A=T=A=[
        var vvqflashvars = {};
        var vvqparams = { wmode: "opaque", allowfullscreen: "true", allowscriptaccess: "always" };
        var vvqattributes = {};
        var vvqexpressinstall = "http://www.projectdisobey.com/disobeyclothing/wp-content/plugins/vipers-video-quicktags/resources/expressinstall.swf";
    // ]=]=>
    </script>

    This done, the remaining errors are...

    Line 424, Column 48: required attribute "action" not specified.

    Maybe your cart doesn't need an action? To validate, you could try adding an empty attribute: action="".


    Line 450, Column 28: document type does not allow element "style" here

    Code:
               <style type="text/css">
        #info { width:547px !important; }
    </style>
    Remove the style element and put the #info rule in either an external stylesheet or the existing embedded sheet in the head.


    Line 456, Column 38: document type does not allow element "span" here; assuming missing "li" start-tag

    <span id="tellafrnd_success_msg_span"></span> is inside a ul so should be within a li element i.e.

    Code:
    <li><span id="tellafrnd_success_msg_span"></span></li>

    Line 455, Column 72: document type does not allow element "div" here; assuming missing "li" start-tag

    This element is in the same ul as the span above. Again, wrap it in <li></li>


    The above done, the document should validate – and hopefully still work – you did keep a copy, didn't you?

  15. #15
    SitePoint Member
    Join Date
    Apr 2011
    Posts
    21
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thanks a lot Victorinox!

    I followed your instructions and managed to fix every validation error on the site except for the one below.

    I have no idea why an extra '</div><!-- content #end -->' is being inserted after the closing 'body' and 'html' tags. Please see attachment.

    Quote Originally Posted by Victorinox View Post
    Home page: http://www.projectdisobey.com/disobeyclothing/

    Errors: 1

    Line 343, Column 16: end tag for element "div" which is not open


    The tag in question - a stray duplicate of </div><!-- content #end --> - is the last element in the page and lies outside the html element. Remove it and the page will validate.
    Any suggestions as to what might be causing this?
    Attached Images Attached Images

  16. #16
    Sploghm bronze trophy Victorinox's Avatar
    Join Date
    Nov 2008
    Posts
    749
    Mentioned
    4 Post(s)
    Tagged
    0 Thread(s)
    I guess it's being generated somewhere in the Wordpress theme. If you have a program that can search a directory of files for a text string (e.g. TextMate or TextWranger on Mac) then that may identify the culprit.

  17. #17
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,176
    Mentioned
    454 Post(s)
    Tagged
    8 Thread(s)
    Quote Originally Posted by harveylester View Post
    I have no idea why an extra '</div><!-- content #end -->' is being inserted after the closing 'body' and 'html' tags.
    I see you have a separate thread for this, so let's close this one out:

    http://www.sitepoint.com/forums/show...-and-html-tags


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
  •