#16
  1. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    This thread now has my attention as well. This is clearly a polarizing issue but please try to discuss this in a professional manner.


    Remember that JavaScript is not simply on or off. Any external script might fail to load at some point. Browser extensions including NoScript and the various ad-blockers can selectively disable scripts. And last but not least, as Kicken said, visually impaired users might find many sites much easier to use with it disabled.

    Progressive enhancement is still the best way to use JavaScript in a web site. (And yes most web apps require JS, but that's not the issue here.) I recommend you all read these:
    Why is Progressive Enhancement so unpopular?
    Pragmatic progressive enhancement - why you should bother with it

    Not requiring JavaScript be enabled helps reduce the many ways your web pages can break.

    Originally Posted by NotionCommotion
    [...] but when getting to the signup form, wouldn't it be better to just tell them to enable JavaScript on their browser if they wish to proceed?
    In that case, yes, it would be better to put a notice at the beginning that JavaScript is required to complete that action.

    What you need to remember is that with so many things in web development, and programming in general, there are not all that many one-size-fits-all solutions. You need to decide what is best on a case-by-case basis.

    Originally Posted by NotionCommotion
    [...] I find it arrogant to expect that every site must cater to a very minority population for no reason other than they do not want to use JavaScript.
    Free and open access for everyone was one of the founding ideas for the World Wide Web. Not requiring JavaScript is part of that. Also we're not saying that everything must work without JavaScript. We're talking about the core features of the site, like the main text and perhaps images, of each page that serves an informational purposes, e.g. information about product, service, company, or person.

    It's interesting that the phrase "do not want to use" has been used multiple times in this thread. It makes me wonder if the people who use it appreciate and understand the many reasons to "not want to use JavaScript"?

    Originally Posted by NotionCommotion
    Other times, it could detract from the JavaScript user's experience, and why risk the majority of our users going elsewhere for such a small percentage of the population?
    Would you please share an example or two of such cases?


    Originally Posted by Kravvitz
    I would like to repost portions of one of the deleted posts:
    Originally Posted by Jacques1
    You might wanna read up on cross-site scripting attacks. It's one of the most common vulnerabilities on websites. If you have any doubts about that, just pick a few threads in the PHP section and read the code.
    Originally Posted by Jacques1
    It's called risk assessment. People apply it intuitively in the physical world, but they obviously have a hard time doing the same thing on the Internet. [...]
    Originally Posted by derplumo
    In your vision 'everybody' uses google chrome and 'nobody' uses for example opera but the fact is that they also have the right to see your website like you wanted it to.
    Good points, but perhaps you haven't heard that Opera 15+ now use Webkit which is also what Safari uses and is the basis of Chrome's "Blink" engine.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  2. #17
  3. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Sep 2006
    Posts
    1,922
    Rep Power
    533
    Originally Posted by Kravvitz
    Would you please share an example or two of such cases?
    Given enough time, money, and skill, I suppose we could implement almost any scenario without JavaScript. One could implement a primitive Google Maps by rendering everything server-side, and sending a map image with a bunch of links superimposed over it. Unfortunately, I do not have unlimited time, money, and skill, so instead of trying to go down that rabbit hole, I should assess my resources and the needs/expectations of my majority intended audience, and determine how far I want to go.

    Google Maps might be an extreme example, and I posted my original thread when flow-charting a sophisticated signup form, and finding multiple steps where I would need a very different UI for JavaScript and non-JavaScript users. Sure, I could do it, but the question remains "should I do it?" Please don't try to answer this rhetorical question as you could only given pros and cons, and the ultimate decision is mine alone.

    I appreciate many of the the rational (and even extreme) replies to this post as they have helped me better cement in my mind a pragmatic approach to this question.
  4. #18
  5. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2012
    Location
    Burb of Detroit, Michigan
    Posts
    86
    Rep Power
    76
    After completing 3 web courses in college, there is no reason not to have the best of both worlds. It's also required here in the U.S. for government websites (maybe more have to comply?) that websites fall in 508 compliance. It's really not that hard to make a website to be useable if JavaScript is turn off and still look good.

    Google Maps can easily be done without JavaScript, granted it won't look as "pretty" but if looks good (graceful degradation) and works that is all that matters.
    Last edited by Strider64; February 19th, 2014 at 06:37 AM.
    PDO Registration and Login tutorial @ http://www.jrpepp.com/displayPage.php?page=193
  6. #19
  7. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Sep 2006
    Posts
    1,922
    Rep Power
    533
    Originally Posted by Strider64
    After completing 3 web courses in college, there is no reason not to have the best of both worlds. It's also required here in the U.S. for government websites (maybe more have to comply?) that websites fall in 508 compliance. It's really not that hard to make a website to be useable if JavaScript is turn off and still look good.

    Google Maps can easily be done without JavaScript, granted it won't look as "pretty" but if looks good (graceful degradation) and works that is all that matters.
    I believe 508 compliance is just for individuals with physical disabilities, not (dare I say) individuals who chose not to enable JavaScript.

    Maybe Google Maps wasn't a good example, and agree websites are better if they work without JavaScript.

    By the way, https://www.healthcare.gov/ doesn't work without JavaScript. Maybe President Obama doesn't know about progressive enhancement
  8. #20
  9. No Profile Picture
    Contributing User
    Devshed Novice (500 - 999 posts)

    Join Date
    Oct 2009
    Location
    Nebraska, USA
    Posts
    867
    Rep Power
    275
    I apologize for going off-topic here , but, just wanted to reply to NC's following comment:
    Originally Posted by NotionCommotion
    Maybe President Obama doesn't know about progressive enhancement
    I dare say that President "King" Obama doesn't know much of anything, including the "US Constitution".[except how to give the Country away]
  10. #21
  11. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    407
    Rep Power
    8
    No offence, but keep politics for the lounge part of the forum
  12. #22
  13. No Profile Picture
    Contributing User
    Devshed Intermediate (1500 - 1999 posts)

    Join Date
    Sep 2006
    Posts
    1,922
    Rep Power
    533
    Right after I left this post, I thought "oh crap, I brought up politics! Given this groups emotional outburst regarding JavaScript, what next?"
  14. #23
  15. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    407
    Rep Power
    8
    Only things we can put to use, or nothing

    Also is there a good way to check if the uses has Js enabled?
    Last edited by derplumo; February 19th, 2014 at 02:53 PM.
  16. #24
  17. Wiser? Not exactly.
    Devshed God 1st Plane (5500 - 5999 posts)

    Join Date
    May 2001
    Location
    Bonita Springs, FL
    Posts
    5,934
    Rep Power
    4033
    Originally Posted by derplumo
    Also is there a good way to check if the uses has Js enabled?
    Probably the best way would be to send a quick ajax request on an initial page visit. If the request is received you can assume JS is enabled and store the result in a session variable. Until such proof is received assume that JS is disabled.

    It's better if at all possible to avoid needing to know in the first place. Design the page so it's at least functional without JS and then have it enhanced with JS if necessary. One tip with regard to this and altering some basic layout stuff depending on whether js is enabled or not is to have JS add a class to the body and you can then write CSS to do different things based on whether JS is enabled or not. For example:

    Say as part of a CMS Menu system users could either enter a URL manually or popup a dialog to browse pages within the CMS and select them. The browse function only works if JS is enabled so if JS is disabled you want to hide the browse button. You would code that something like this:
    Code:
    <script type="text/javascript">
    jQuery(function($){
        $('body').addClass('js-enabled');
        $('#urlPicker').click(function(){ 
           //Open dialog to pick url.
        });
    });
    </script>
    <style type="text/css">
    #urlPicker { display: none; }
    .js-enabled #urlPicker { display: inline; }
    </style>
    <body>
     <p>URL: <input type="text"> <button type="button" id="urlPicker">Browse...</button></p>
    </body>
    By default the button is hidden. If JS is enabled then the js-enabled class gets added to the body causing the button to be displayed.

    If you wanted to know if JS was disabled, you could use a similar approach and pre-load the body with a js-not-enabled class then on load have JS remove that class. There's also the <noscript> tag for that as well. For example, auto-submitting select lists I usually code as such:
    Code:
    <select name="blah" onchange="this.form.submit();">
     <option>....</option>
    </select>
    <noscript>
      <input type="submit" value="Go">
    </noscript>
    For users with JS, they see only the select menu and changing it's value will submit the form. For users without JS they will see an additional submit button.
    Recycle your old CD's, don't just trash them



    If I helped you out, show some love with some reputation, or tip with Bitcoins to 1N645HfYf63UbcvxajLKiSKpYHAq2Zxud
  18. #25
  19. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    407
    Rep Power
    8
    ok thank you,

    I have a list of items which I want the user to select it (and it will get a class so he can see it is selected) and I'm using Js for that. This is an important part of the website so I also want it to work for the non-Js users and making it possible with checkboxes.

    Besides that, is there also a way to check if Js is turned on without ajax? I prefer not to extend the loading times IF it could be done faster (and maybe easier).
  20. #26
  21. Wiser? Not exactly.
    Devshed God 1st Plane (5500 - 5999 posts)

    Join Date
    May 2001
    Location
    Bonita Springs, FL
    Posts
    5,934
    Rep Power
    4033
    Originally Posted by derplumo
    Besides that, is there also a way to check if Js is turned on without ajax? I prefer not to extend the loading times IF it could be done faster (and maybe easier).
    The only way to let the server know if JS is enabled is to do something with JS that will cause a request to be made to the server, how you make that request is up to you. Aside from the ajax request you could do something like add a <img> tag, load your scripts via a .php gateway, do a redirect, etc.

    What you need to decide is whether it's actually necessary for the server to know if JS is enabled or not. Generally the only time the server would need to know is if you need to output additional content which would normally be loaded via ajax.

    Unless you are loading your list items dynamically somehow and need to instead preload all of them with js is enabled, it sounds like in your case the server doesn't need to know. Just output your checkboxs within <noscript> tags so they only show if JS is disabled. Yes it will add some additional size to the page but it'd say it's probably not enough to justify the extra work involved in trying to prevent their inclusion if JS is enabled.
    Recycle your old CD's, don't just trash them



    If I helped you out, show some love with some reputation, or tip with Bitcoins to 1N645HfYf63UbcvxajLKiSKpYHAq2Zxud
  22. #27
  23. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4304
    I was hoping for a common example you've personally encountered, not commonly given extreme examples.

    Originally Posted by NotionCommotion
    By the way, https://www.healthcare.gov/ doesn't work without JavaScript.
    That's one of the most publicized examples of how not to make a website. I've also heard that the company that made it was hired through the "old buddy network", not through the normal request for bids that government projects are supposed to go through.

    As much as I would love to rant about politics, this is not the place.

    Originally Posted by kicken
    If JS is enabled then the js-enabled class gets added to the body causing the button to be displayed.
    I use a class for the same purpose but put in on the <html> element. Also sometimes I'll add a class that serves the same purpose to the top level element used for a given feature.

    Originally Posted by kicken
    There's also the <noscript> tag for that as well.
    That will not work as intended if JavaScript is not fully disabled or if the script for that feature fails to load. IMO, <noscript> should only be used when there are no other alternatives for providing a no-JS fallback.

    Originally Posted by kicken
    For example, auto-submitting select lists I usually code as such: [...] For users with JS, they see only the select menu and changing it's value will submit the form.
    Jump menus! Noo! Are you aware that they cause problems for some users? I recommend you try to find an alternative.
    More information:
    Drop-Down Menus: Use Sparingly
    Creating Accessible Forms: JavaScript jump menus
    Accessible JavaScript onchange select menu

    Originally Posted by kicken
    Just output your checkboxs within <noscript> tags so they only show if JS is disabled.
    My intention is not to pick on you, but why? Why not just mark up the list of options with a <ul>, <label>s, and checkboxes in the first place and then style things as needed when JavaScript is available?
    Last edited by Kravvitz; February 19th, 2014 at 06:39 PM.
    Spreading knowledge, one newbie at a time.

    Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  24. #28
  25. Wiser? Not exactly.
    Devshed God 1st Plane (5500 - 5999 posts)

    Join Date
    May 2001
    Location
    Bonita Springs, FL
    Posts
    5,934
    Rep Power
    4033
    Originally Posted by Kravvitz
    That will not work as intended if JavaScript is not fully disabled or if the script for that feature fails to load. IMO, <noscript> should only be used when there are no other alternatives for providing a no-JS fallback.
    Good point, I don't use any script-disabling add-ons or something that would cause scripting to be disabled while still preventing <noscript> from displaying so I hadn't considered such a possibility.

    As for a script failing to load, pretty much the only place I use <noscript> is for the jump menu button as shown above and I tend to still use an inline onchange attribute there rather than external script so the script failing to load wouldn't be an issue.


    Originally Posted by Kravvitz
    Jump menus! Noo! Are you aware that they cause problems for some users? I recommend you try to find an alternative.
    I have started to move away from them, as I am aware there are issues with onchange being triggered by keyboard navigation of the options.


    Originally Posted by Kravvitz
    My intention is not to pick on you, but why? Why not just mark up the list of options with a <ul>, <label>s, and checkboxes in the first place and then style things as needed when JavaScript is available?
    I would mark it all up with ul, labels, etc. My suggestion to them was to simply put the checkbox in <noscript> if they didn't want it to show when scripting was enabled. Hiding it with CSS instead of using <noscript> would be alternative (probably better, given the note above) solution to accomplish the same task.

    --

    I rarely do anything extensive with JS these days, so I don't typically spend a lot of time dealing with it or actively thinking about js on-vs-off since my stuff typically doesn't rely on it at all. For this thread I mostly was just trying to point out common mistakes I see people make which result in their unnecessary dependence on JS and provide a few tips I've learned over the years for handling such situations.
    Recycle your old CD's, don't just trash them



    If I helped you out, show some love with some reputation, or tip with Bitcoins to 1N645HfYf63UbcvxajLKiSKpYHAq2Zxud
  26. #29
  27. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Aug 2012
    Location
    Burb of Detroit, Michigan
    Posts
    86
    Rep Power
    76
    Originally Posted by NotionCommotion
    I believe 508 compliance is just for individuals with physical disabilities, not (dare I say) individuals who chose not to enable JavaScript.
    )
    That was my intention, because federal websites have to be 508 compliant (or should be) websites have to look good without JavaScript enable. I sometimes don't make myself clear.

    Oh since this is a php forum, php can help a lot with making websites look good with JavaScript disabled.
    Last edited by Strider64; February 20th, 2014 at 09:17 AM.
    PDO Registration and Login tutorial @ http://www.jrpepp.com/displayPage.php?page=193
  28. #30
  29. Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2013
    Posts
    407
    Rep Power
    8
    Originally Posted by Strider64
    Oh since this is a php forum, php can help a lot with making websites look good with JavaScript disabled.
    Yes it does, but IMO one of the better parts of PHP is also it's weakness. It runs on the server so it can't change things client-side like Js does. Too bad

    The things PHP can do for making the website look good is limited, while Js would open more doors to it.

    Luckily every language is used for something, so we can choose which one suits the needs.

IMN logo majestic logo threadwatch logo seochat tools logo