Uncommon controls

Uncommon controls

I received an email a few weeks ago from Sergio asking me about filter controls. I didn’t get the light bulb of the idea until today. Sergio was interested in creating a more standard image to set users expectations of how a text box will behave with filters. This got me thinking that this type of edit box as a very common problem. Not just for filters but for all kinds of text based data-entry.

This turns out to be an issue on most web-sites and it ends up in the web-developers lap to create controls that properly filter, interact and show data. What if the browser makers got together and agreed on something more meaningful then an RSS icon?

Imagine a set of defined icons and behaviors that can integrate with system level functionality and applications. The set of icons is based off the standard combo-box. Derivatives would allow type filters, date filters, email addresses, postal addresses and passwords.

The control itself would have a standard look but it would be up to the browser/OS to determine the pop-down action. For example the calendar pop-down could display your current schedule and appointments. The email drop-down could integrate with your email application allowing you to easily email friends and family by name. The password drop-down could allow you to generate a password or perhaps retrieve the password from your list of saved passwords.

The key idea is to create a small (3-6) set of standard control that would have predictable behaviors across both web-applications as well as client side applications.

Post to Twitter

One thought on “Uncommon controls

  1. It is a neat idea, but this shows how CSS (in IE) is a complete mess.

    I tried doing this, adding a class to my inputs.

    basically set padding on the right, and position a “middle right” background image… simple, right?

    well, not quite… try typing in the box in IE… as soon as you get near the image/padding IE starts moving the icon image.

    Otherwise I’m with you. it would make things look much better.

Leave a Reply

Your email address will not be published. Required fields are marked *

*

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>