A rather geeky/technical weblog, est. 2001, by Bramus
select element
Scott Jehl, from Filament Group: The select element has long been difficult to style consistently across browsers. To avoid its shortcomings in the past, we have used workarounds like styling a parent element, adding pseudo-elements, and even using JavaScript to construct a select-like control out of different elements that are easier to style. But workarounds …
From complex ERP systems to Facebook, applications make meaning out of input. The form — in its many manifestations — provides a gateway for user submission. This article illustrates 13 different ways to present forms, and explores the future of data input. Good overview and good naming conventions used: Modal, Multi-modal, Slideout, Popover, Inline, … Form Design for Complex …
Considering the nature of people search, filtering by parameters other than first and last name is crucial. ‘John Smith’ doesn’t really help you find who you’re looking for, but a 36 year old John Smith in Pasadena, CA, related to a Susan is damn specific, and will inform you quickly if we have the data …
Continue reading “Death to Complexity: Advanced Search at Spokeo”
Life is short. No one wants to fill out a form. Be conversational. Be funny. Gradually engage. Do the unexpected. It is the role of the designer to express their company’s brand to elicit an emotional reaction. If done correctly, it will increase completion rates. Just make sure you don’t violate the rules listed here. …
I see it happening a lot: forms without any structure, with wrong types of inputs, with no proper labels, with … – And that’s a bad thing. All the required HTML elements (<fieldset>, <input> types, <label>, etc.) are there, so why not use them? This article has a nice writeup on how to properly create …
Continue reading “Designing More Efficient Forms: Structure, Inputs, Labels and Actions”
See the Pen Adaptive Placeholder by Danny King on CodePen. We’ve seen some floated labels before: when focussing a form field the placeholder seems to move towards a spot above the field. Adaptive placeholders goes a step further by also allowing one to change the text when something was entered into the field. Makes clever …
Simplistic strength estimation gives bad advice. Without checking for common patterns, the practice of encouraging numbers and symbols means encouraging passwords that might only be slightly harder for a computer to crack, and yet frustratingly harder for a human to remember. zxcvbn, named after a crappy password, is a JavaScript password strength estimation library. Use …
Continue reading “zxcvbn: realistic password strength estimation”