Standardizing `select` And Beyond: The Past, Present And Future Of Native HTML Form Controls — Smashing Magazine

While a handful of form controls can be easily styled by CSS, like the button element, most form controls fall into a bucket of either requiring hacky CSS or are still unable to be styled at all by CSS.

Despite form controls no longer taking a style or technical dependency on the operating system and using modern rendering technology from the browser, developers are still unable to style some of the most used form control elements such as select. The root of this problem lies in the way the specification was originally written for form controls back in 1995.

Stephanie goes back in time to tell the history of form controls on the web, and how that history has led to our current frustrations:

The current state of working with controls on the modern web is that countless developer hours are being lost to rewriting controls from scratch, as custom elements due to a lack of flexibility in customizability and extensibility of native form controls. This is a massive gap in the web platform and has been for years. Finally, something is being done about it.

Amen!

Standardizing `select` And Beyond: The Past, Present And Future Of Native HTML Form Controls — Smashing Magazine

Tagged with

Related links

SCALABLE: Save form data to localStorage and auto-complete on refresh

When I was in Amsterdam I was really impressed with the code that Rose was writing and I encouraged her to share it. Here it is: drop this script into a web page with a form to have its values automatically saved into local storage (and automatically loaded into the form if something goes wrong before the form is submitted).

Tagged with

HTML Web Components | Go Make Things

Chris walks through a really good example of an HTML web component he made for NASA: wrapping a regular form element in a custom element to add Ajax functionality.

This approach let me slash the JavaScript used for this project in half, easily progressively enhance the UI, and provide an authoring approach that’s much easier to read and make sense of.

Tagged with

TIL: You Can Access A User’s Camera with Just HTML

The capture attribute is pretty nifty—and I just love that you get so much power in a declarative way:

<input type="file" accept="image/*" capture="environment">

Tagged with

Bring Focus to the First Form Field with an Error :: Aaron Gustafson

A handy little script from Aaron to improve the form validation experience.

Tagged with

Sentence Forms (not Mad Libs) | Adrian Roselli

Apparently the sentence forms that I kicked off with Huffduffer are making a comeback.

Tagged with

Related posts

The datalist element on iOS

Some buggy behaviour has been fixed in iOS 18 but now there’s a new bit of weirdness.

Hanging punctuation in CSS

A little fix for Safari.

Three attributes for better web forms

Better UX through better HTML: inputmode, enterkeyhint, and autocomplete.

Good form

Science, the web, and user experience.

Get safe

It should be safe to visit a web page.