[jQuery] Re: What does Unobtrusive Javascript mean?
On Aug 16, 4:13 pm, Pops [EMAIL PROTECTED] wrote: Ive seen this term referred to a few times, especially here: http://simonwillison.net/2007/Aug/15/jquery/ What does Unobtrusive Javascript mean? Hi, Pops! google: what does unobtrusive javascript mean? http://onlinetools.org/articles/unobtrusivejavascript/chapter1.html Says: The first rule of the unobtrusive Javascript club is don't talk about the unobtrusive Javascript club. No, hang on, it is... :)
[jQuery] Re: What does Unobtrusive Javascript mean?
Hey, Pops -
I'm actually getting ready to do a presentation on this - Unobtrusive
Javascript and CSS. See, when a page is designed through MS-Word, for
example, the CSS styles are embedded directly in the page (usually,
directly in the element itself). This works, but it's ugly and not
easily extensible.
The same applies to Javascript - if you've got a link, for example,
with href=javascript:alert('foo'); in it, it's hard-coded. Inflexible
and inefficient.
The jQuery way (which is way beyond jQuery, but jQuery makes this easy)
is to create elements which can be 'hooked' into (a link with an ID /
class, which CSS and JS can connect to easily). A separate CSS or JS
file can be included in the head of the document, which hooks to that
element and does something to it.
The beauty of it is, down the line, all the elements of a given
class/ID can be updated/modified in a single central location. An
example with CSS - take a look at Zen Garden sometime to see it in
action. The same things can be done via JS - if a developer creates a
page, he can swap in and out JS files which can perform drastically
different actions on the same elements.
Hope this helps!
-Toby
Pops wrote:
Ive seen this term referred to a few times, especially here:
http://simonwillison.net/2007/Aug/15/jquery/
What does Unobtrusive Javascript mean?
I am getting the idea that jQuery offers a way to bypass a user
turning off JavaScript?
How does jQuery do this?
Thanks
[jQuery] Re: What does Unobtrusive Javascript mean?
What does Unobtrusive Javascript mean? I won't be the only one who answers this, I'm sure, but I'll try and explain it as best I can. As you'll probably be aware, a lot of users, due to personal preference, or firewall or proxy restrictions, browse the web without JavaScript, meaning they miss out on all of the cool effects and tricks it's capable of. This would include jQuery - no JavaScript, no jQ. Unobtrusive JavaScript is a term used to describe the application of JS to ENHANCE a page, rather than as a requirement of that page. The ultimate aim of any well crafted website is that it should be usable regardless of the technologies on a user's machine. A HTML version of a Flash only website might not look as good, but if the user doesn't or can't have Flash installed it's what they get. Likewise, if you develop a page which will work perfectly well without JavaScript, then you can add the snazzy effects in afterwards. A website should never REQUIRE JavaScript to work. Adding effects in without impairing basic functionality is what unobtrusive JavaScript is. As an example - you may decide to program a form to require a user to tick a checkbox in order to activate a submit button e.g. I accept the terms and conditions. If you have the submit button disabled by default and use JavaScript to enable it on the clicking of the checkbox, then you're in trouble - people with JavaScript can't submit your form. On the other hand, if you leave the button enabled by default, THEN apply JavaScript to turn it off and re-enable it, then you're safe. Your server side script can then check the terms box was ticked. This is unobtrusive - the form works without JavaScript. A small example but I hope it helps to clarify things. Hope that made sense. I rarely do. :) Regards, Michael Price
[jQuery] Re: What does Unobtrusive Javascript mean?
Ive seen this term referred to a few times, especially here: http://simonwillison.net/2007/Aug/15/jquery/ What does Unobtrusive Javascript mean? Since you've already gotten some good description, I'll keep this short and show an example of the behavior from a popular site. The idea of Unobtrusive JavaScript is just a method of progressive enhancement. If your users have JS enabled they getter a better UI experience, while the users with JS disabled can still use the site (but maybe without all the bells and whistles.) A good example of this behavior is Digg.com's login behavior. Follow the steps below to see an example of Unobtrusive behavior: 1) If disabled, enable JavaScript in your browser. 2) Go to http://www.digg.com/ 3) Click on the Login link in the blue bar at the top right of the screen. 4) Notice how a login form fades in from the top of the page. 5) Disable JavaScript. 6) Refresh the page. 7) Click on the Login link again. 8) Notice this time you're taken to a standalone login form. 9) Enable JavaScript. :) This is idea of progressive enhancement and this is what the term Unobtrusive JavaScript gets you. -Dan
[jQuery] Re: What does Unobtrusive Javascript mean?
Oy Vey! First, thanks to all of you guys. Excellent Feedback. I love this jQuery group. I haven't had this much fun in months! g But I have a peeve, you see, this is what I hate about you Young Punks. g Reinventing things!! You know what this is called? - Modulization! - Consolidation! - Functional Programming! - Black Box Programming! - Component Engineering! above all: - Single Source Development, - Systems Development and - Software Engineering I mean REAL Software Engineering where all the above applies! Seriously, if you guys (speaking in general) really want to make headways into pushing jQuery and other stuff, how about talking LINGO that was understood for decades - the Wild West Days are over, the game is over, its time to clean up the mess - abeit Great looking, created! g I guess it is easier for developers who are familar with server side template processing systems to better grasp single source development or the ideas of Unobtrusive Web Development. The other day I read a guy call this AHAH and another today call it HiJax! What are you guys? Nuts! :-) Use words like Modular or functional programming, Consolidation or just Applying Software Engineering Principles to Web 2.0 Development and you will begin got turn some heads and get the Ah ha, the I feel ya from managers, and project engineering folks and CTO like myself who are trying to make sense of whats going on here!! Seriously guys! Bring it back to earth! Thanks again for all your wondeful feedback! -- HLS On Aug 16, 10:18 am, Stephan Beal [EMAIL PROTECTED] wrote: On Aug 16, 4:13 pm, Pops [EMAIL PROTECTED] wrote: Ive seen this term referred to a few times, especially here: http://simonwillison.net/2007/Aug/15/jquery/ What does Unobtrusive Javascript mean? Hi, Pops! google: what does unobtrusive javascript mean? http://onlinetools.org/articles/unobtrusivejavascript/chapter1.html Says: The first rule of the unobtrusive Javascript club is don't talk about the unobtrusive Javascript club. No, hang on, it is... :)
[jQuery] Re: What does Unobtrusive Javascript mean?
Another thought would be to embrace and use the terms that are popular today. Names change, even when the ideas remain the same. You can't fight that. This is nothing unique to software engineering, it's just human nature. I can't tell you how many times my parents have said to me, In my day, we used to call that Mike What are you guys? Nuts! :-) Use words like Modular or functional programming, Consolidation or just Applying Software Engineering Principles to Web 2.0 Development and you will begin got turn some heads and get the Ah ha, the I feel ya from managers, and project engineering folks and CTO like myself who are trying to make sense of whats going on here!!
[jQuery] Re: What does Unobtrusive Javascript mean? (OT)
same here :-) Forgive me for gong off-topic here, but I thought I'd type up a few examples that immediately come to mind: valise, satchel, davenport, icebox. Does anyone under the age of 60 use any of these words? I only use the word Davenport when referring to Pittsburgh Steelers backup Runningback Najeh Davenport. ;) http://www.nfl.com/players/najehdavenport/profile?id=DAV005111 -Dan PS - Go Steelers! PSS - And I do know a davenport is a couch or sofa if you prefer. My grandma used to always tell me to go lay down on the davenport.
[jQuery] Re: What does Unobtrusive Javascript mean?
Another thought would be to embrace and use the terms that are popular today. Names change, even when the ideas remain the same. You can't fight that. This is nothing unique to software engineering, it's just human nature. I can't tell you how many times my parents have said to me, In my day, we used to call that I think the reason names change is well the basic concept may fit the bucket of something else, they're not specific enough to the actual problem. Personally, I found the term Unobtrusive JavaScript extremely intuitive and specific. On the other hand the phrase Applying Software Engineering Principles to Web 2.0 Development is very general and vague (as it could directed to lots of aspects of your development process.) Not criticizing, just trying to point out why I think often new terms crop up to describe old patterns.
[jQuery] Re: What does Unobtrusive Javascript mean?
Word! I feel ya and I agree with you. :-) But unobstructive javascript? Why would anyone assume that software designs are naturally obstructive in the first place? I'm not debating the term, I am debating the idea that writing clean modulize, consolidated code is a new idea a new awakening that it requires a new term. In other words, the lack of discipline in the past 12 years, got people to the point to eventually discover their great looking software was not too flexible after all. Their focus was limited. It was obstrusive, as an adjective, not as a design concept in the ergonomics of the system. So I rhetorically ask, it is because of ignorance that terms like obstrusive programming are invented? Or that we really needed a new dress to express the behavior as we know it today? It has never failed that its a cycle. I've cover the industry for aleast 3.5 decades now. I'm a programmer at heart. Inevitably, at some point, we all fall into the same contraints. Your creativity and flexibility to invent is not like it use to be. At some point, you are no longer the champion. The product stays however, consistency and stabliity is required for growth. Otherwise, the next guy with the better mouse traps comes along. My point is one of marketing. To maximize its adoption, you have to craft it in ways that is broadly understood. Sigmour Cray, the father of the Cray Super Computer, when asked by his engineers, What language should we used for our new machine? He infamously replied: I don't care, just make sure you call it FORTRAN. Even in todays world of new tools, you can also do better, sell and market it better by labelling the way the entire computer industry understands. Inventing what I call Ghetto terms and worst, every blogger coming up with dozen of the terms reflecting the same with no consistently, doesn't help. Just call it what it is. Good Programming Style! Is that too old? g Anyway, hopefully I can provide some insight to some who are deeply involved with this stuff today to add alittle professionalism and standard terminology. It will help people better understand what you are doing or saying. They might be surprise by the added success it might bring. Just my 1.5 pennies. -- HLS On Aug 16, 12:21 pm, Mike Alsup [EMAIL PROTECTED] wrote: Another thought would be to embrace and use the terms that are popular today. Names change, even when the ideas remain the same. You can't fight that. This is nothing unique to software engineering, it's just human nature. I can't tell you how many times my parents have said to me, In my day, we used to call that Mike What are you guys? Nuts! :-) Use words like Modular or functional programming, Consolidation or just Applying Software Engineering Principles to Web 2.0 Development and you will begin got turn some heads and get the Ah ha, the I feel ya from managers, and project engineering folks and CTO like myself who are trying to make sense of whats going on here!!
[jQuery] Re: What does Unobtrusive Javascript mean?
From: Pops
Ive seen this term referred to a few times, especially here:
http://simonwillison.net/2007/Aug/15/jquery/
What does Unobtrusive Javascript mean?
I'm going to disagree slightly with some of the earlier replies. I think
progressive enhancement and unobtrusive JavaScript are two different
things, and they seem to be getting lumped together to some degree.
Progressive enhancement means writing an HTML page that will work correctly
even if CSS and JavaScript are disabled, and that will still work correctly
- with usability or esthetic improvements - when CSS and/or JavaScript are
available.
Unobtrusive JavaScript means clean markup: avoiding cluttering your tags
with onclick and the like.
Obtrusive JavaScript:
a href=whatever onclick=doClick() onmouseover=doHover()
onmouseout=endHover()click me/a
Unobtrusive JavaScript:
a href=whatever class=clickyclick me/a
...and somewhere else...
$('.clicky').click( doClick ).hover( doHover, endHover );
You can have progressive enhancement with either obtrusive or unobtrusive
JavaScript. They are really two separate questions.
Those are my definitions anyway. :-)
I am getting the idea that jQuery offers a way to bypass a
user turning off JavaScript?
How does jQuery do this?
It doesn't. Seeing as how jQuery *is* JavaScript, if JavaScript is disabled
so is jQuery.
It's just that part of the jQuery philosophy is to use progressive
enhancement so that your web page will still work if JavaScript is disabled.
But jQuery is out of the picture at that point.
-Mike
[jQuery] Re: What does Unobtrusive Javascript mean?
I'm going to disagree slightly with some of the earlier replies. I think progressive enhancement and unobtrusive JavaScript are two different things, and they seem to be getting lumped together to some degree. And this is why new terms crop up--to describe very specific techniques. Unobtrusive JavaScript is just one method of adding progressive enhancement. Sorry for my original earlier message, since it probably just added confusion. -Dan
[jQuery] Re: What does Unobtrusive Javascript mean?
On Thu, Aug 16, 2007 at 05:49:47PM -, Pops wrote: Word! I feel ya and I agree with you. :-) But unobstructive javascript? Why would anyone assume that software designs are naturally obstructive in the first place? Perhaps you should read more closely. unobtrusive != unobstructive -- Victory goes to the player who makes the next-to-last mistake, said chess master Savielly Grigorievitch Tartakower. Rick Pasotto[EMAIL PROTECTED]http://www.niof.net
[jQuery] Re: What does Unobtrusive Javascript mean?
I would agree with Michael Geary. My understanding of Unobtrusive Javascript is keeping a clean separation of content, presentation and behaviours.
[jQuery] Re: What does Unobtrusive Javascript mean?
http://developer.yahoo.com/yui/articles/gbs/ Progressive Enhancement vs. Graceful Degradation The concepts of graceful degradation and progressive enhancement are often applied to describe browser support strategies. Indeed, they are closely related approaches to the engineering of fault tolerance. These two concepts influence decision-making about browser support. Because they reflect different priorities, they frame the support discussion differently. Graceful degradation prioritizes presentation, and permits less widely-used browsers to receive less (and give less to the user). Progressive enhancement puts content at the center, and allows most browsers to receive more (and show more to the user). While close in meaning, progressive enhancement is a healthier and more forward-looking approach. Progressive enhancement is a core concept of Graded Browser Support. So to my understanding, Unobtrusive Javascript ~ Graceful Degradation not really a good thing and not the same as Progressive Enhancement On 8月16日, 下午10時13分, Pops [EMAIL PROTECTED] wrote: Ive seen this term referred to a few times, especially here: http://simonwillison.net/2007/Aug/15/jquery/ What does Unobtrusive Javascript mean? I am getting the idea that jQuery offers a way to bypass a user turning off JavaScript? How does jQuery do this? Thanks
[jQuery] Re: What does Unobtrusive Javascript mean?
Howa, Thank for the information.I like this graded support chart in this article. Good example of someone applying software engineering principles to Web development. I guess the good thing is that the industry is maturing. Inevitably there will be efforts to consolidate, to provide meaning and to give guidance because truth be told, it is a Freaking Mess out there. Theses are all reasons why for many years people went with one vendor. The web broke that, but if you think about, we are going back to that one vendor or narrowing down the resouces that you use. It happens to all, you, me, etc, to everything we do, to every product, to every web site, to every team or lone wolf programmer out there. I did read a blog yesterday, and I probably misunderstood him but I was taken aside by what he said because he had a damn good argument about something that I can relate to and have come across many times in many of my product development over the years. Many products come to a point where you have to make a decision where you totally revamp, start fresh, where progressive enhancement may not be a good idea. I would venturre that the older the product is, the more true this is.While one might think that a migration or phased design approach is a good idea to reach progressive enchancement, it can actually make things worst in cost of development, even adds complexity and the add to the development of Spaghetti Code. Some have the luxury to do new things without contraints, some can not afford that luxury and others can only afford to go slow at it, and by afford I don't mean just cost, but you have customers that you can't break the software and functionality on them. For us, we are in a blend of this. We have a very dated system, yet still have functionality and ideas that many are going to. For the web side, this web 2.0 hangout for me is that effort to see how much revamping we have to do. Can we migrate smoothly? Can we add more Web 1.5 or 2.0 while keeping backward compatibility? How much of the server-side template processing will change, how much will be move to the client? The jQuery discovery has helped tremendously in this effort. Anyway, I appreciate all the input and yes, even an old dog can learn new tricks or rather commands. g Thanks -- HLS On Aug 16, 10:38 pm, howa [EMAIL PROTECTED] wrote: http://developer.yahoo.com/yui/articles/gbs/ Progressive Enhancement vs. Graceful Degradation The concepts of graceful degradation and progressive enhancement are often applied to describe browser support strategies. Indeed, they are closely related approaches to the engineering of fault tolerance. These two concepts influence decision-making about browser support. Because they reflect different priorities, they frame the support discussion differently. Graceful degradation prioritizes presentation, and permits less widely-used browsers to receive less (and give less to the user). Progressive enhancement puts content at the center, and allows most browsers to receive more (and show more to the user). While close in meaning, progressive enhancement is a healthier and more forward-looking approach. Progressive enhancement is a core concept of Graded Browser Support. So to my understanding, Unobtrusive Javascript ~ Graceful Degradation not really a good thing and not the same as Progressive Enhancement On 8月16日, 下午10時13分, Pops [EMAIL PROTECTED] wrote: Ive seen this term referred to a few times, especially here: http://simonwillison.net/2007/Aug/15/jquery/ What does Unobtrusive Javascript mean? I am getting the idea that jQuery offers a way to bypass a user turning off JavaScript? How does jQuery do this? Thanks
