javascript - Progressive enhancement and Graceful degradation example, I don't get it -
i've read these 2 different design approaches, understand theoric difference between prog.enhancement , graceful degradation, don't example can read @ link: progressive enhancement , graceful degradation example
with g.d. creates link through javascript prints page. p.e. same, uses "buttons" instead of "links".
this code used p.e. process:
<p id="printthis">thank order. please print page records.</p> <script type="text/javascript"> (function(){ if(document.getelementbyid){ var pt = document.getelementbyid('printthis'); if(pt && typeof window.print === 'function'){ var = document.createelement('input'); but.setattribute('type','button'); but.setattribute('value','print now'); but.onclick = function(){ window.print(); }; pt.appendchild(but); } } })(); </script>
couldn't same thing keep using links? mean problem of javascript support keep existing in p.e. , solved in g.d., telling user print page himself.
thanks in advance
no. in example, there no link. <p>
. putting in normal <a>
mean js disabled , browser can't window.print()
see link doesn't or go anywhere (and possibly might throw error box if browser old enough). ui visibly broken. enhance page way, author change <p>
<a>
, chose go <input type="button">
. there lots of options.
but point of example start ui isn't broken in way -- including users have js disabled , browsers don't have required features -- , build up. that's point of pe. on other hand, gd way build page main audience , find ways hide things break, lesser browsers still nice without seeing lots of broken things on place.
i know didn't ask, in personal experience, distinction between pe , gd artificial , 2009. lot of had ie6 (a 2001 browser not die), mobile gave new urgency.
back mobile seen many people separate system requiring special treatment, , important question: built mobile , desktop , add features core desktop audience? or build site core desktop audience , trimmed on things might break on mobile.
Comments
Post a Comment