jQuery developers, where is the progressive enhancement?

Recently me and my colleague Johan Ahlin have been on the hunt for jQuery plugins that enable styling of HTML elements that are normally hard to style, such as dropdowns. The most recent example was a slider where the visitor is able to select a value on a scale by dragging a handle. This clearly maps to an ordinary list of radio buttons. We have found a lot of slider plugins but almost all of them expects the values that the user can select between with the slider as javascript parameters. Similarly for dropdown plugins most expects to find the values for the dropdown in an unordered list element. In my humble but ranting opinion its obvious that the source for the values should be a regular dropdown.

So, my question is this: there is a lot of talk about progressive enhancement among UI developers, but where is it? It might mean slightly more code to make a dropdown plugin that transforms a SELECT element instead of a UL element but doing so means that the function will work for visitors that don’t have javascript and for the visually impaired. Doing so also means that the markup is semantically correct and that the server code developers are able to ignore the UI code and just render, and save input from, ordinary HTML elements.

Anyhow, here are two great plugins that we have found for dropdowns and sliders that actually does progressive enhancement. Kudos to their developers!

jQuery UI Slider by Wilfred Nas

Stylish Select Box by Scott Darby

PS. For updates about new posts, sites I find useful and the occasional rant you can follow me on Twitter. You are also most welcome to subscribe to the RSS-feed.

Comments

  1. Bohdan Ganicky's avatar

    Bohdan Ganicky 1 years ago

    Hi, you should really check out work of Filament Group guys.

    Select replacement:
    http://www.filamentgroup.com/lab/jquery_ui_selectmenu_an_aria_accessible_plugin_for_styling_a_html_select/

    Slider from select:
    http://www.filamentgroup.com/lab/update_jquery_ui_slider_from_a_select_element_now_with_aria_support/

  2. Joel Abrahamsson's avatar

    Joel Abrahamsson 1 years ago

    Looks like a great tip Bohdan, thanks!

Add a comment

Allowed tags: <b>, <em>, <quote cite="">, <code>, <c-sharp-code>, <css-code>, <sql-code>, <xml-code>, <javascript-code>. If you want to display code examples, please remember to write &lt; for < and &gt; for >.

Follow me on Twitter

  1. Bookmarked: Google Scribe http://bit.ly/9iDp8s 2 days ago
  2. Blogged: The future of EPiMVC http://bit.ly/ck6EPg #episerver 2 days ago
  3. At Skånegläntan, as always #parentalleave 2 days ago
follow me

Latest comments

  1. Svante wrote "Yes, I noticed that it was a singleton, and I guess the real..." on Something to beware of when using EPiAbstractions and an IoC container
  2. Joel Abrahamsson wrote "Well, first of all you wont get any arguments from me regard..." on Something to beware of when using EPiAbstractions and an IoC container
  3. Svante wrote "Hmm... Since the issue really is with the public instance co..." on Something to beware of when using EPiAbstractions and an IoC container

About this site

This blog is built with EPiServer Community, EPiServer CMS, ASP.NET MVC and a bunch of other great products. The source code is available for download at the projects page, where you also can read more about this site and my other projects.

read more