Currently our webapplication simply shows a textbox with no validation at all. There is a small icon placed next to the textbox that allows the user to open the URL in a new browser window to check the validity. This is not a good way to stimulate a user to input a valid URL and with no other validation in place, our customers databases are full of stuff like e-mail addresses and "See Notes". We would really like to improve this situation, but with no UX-specialist on our team, we seem not to be able to find a proper way of allowing URL input.
I imagine a simple textbox would be easiest to use, but would also be hardest to validate. For example, we would like to allow the to enter URLs as http://www.google.com/ or www.google.com and only google.com. Splitting the protocol and allowing users to select it in a dropdownlist (defaulting to http://) would make validation easier and perhaps also entering the URL. However, the user would then be bugged with technical terminology. Only about 1% of the current URLs in the database are properly prefixed with the protocol and we suspect these are the result of copying the URL from the browsers addressbar.
As for the validation, I know there are a lot regular expressions out there for URL validation, but I assume these suffer from the same problems as e-mailaddress regular expressions in that either they are to strict or very, very loose, or are a couple of pages long.
So my questions are:
- What (combination of) control(s) would allow the user to enter a URL a easy as possible?
- What kind of validation would suffice so all valid URLs are allowed, but the most obviously wrong are not?
Answer
If you really care about UX - validate the URL automatically. E.g. if user types "example.com" - change it to "http://example.com".
If you want to add an ability to navigate to the URL that wasjust typed - just underline it and make it blue; the user will understand that this is a link.
download bmml source – Wireframes created with Balsamiq Mockups
No comments:
Post a Comment