4 More HTML Concepts You Didn’t Know
by @j9t@mas.to on , tagged html, concepts, forms, focus (toot this?)
The first summary of the “HTML Concepts” series covered “body-ok,” the “nothing” content model, constraint validation, and indicators for layout tables.
Let’s look at another four concepts:
1. Common Idioms
HTML doesn’t have elements for a number of popular design patterns—but for four of them (as of 2022), it gives recommendations: breadcrumbs, tag clouds, conversations, and footnotes.
2. Form Owners
Form owners are essentially form elements that so-called form-associated elements are tied to. These are the following: button, fieldset, input, object, output, select, textarea, img, as well as form-associated custom elements.
Form ownership refers to the connection of a form-associated element with a form owner: The element is associated with its nearest ancestor form element—unless it’s a form-associated listed element (anything that’s not an img) and has a form attribute that overrides this association.
3. Commands and Facets
Commands are probably what you think they are. A command is defined as “the abstraction behind menu items, buttons, and links.” It’s what you issue when you interact with them, that is, click or press on either.
Facets, then, are rarely mentioned anywhere, but they are something a command has. There are the following facets: label, access key, hidden state, disabled state, and action.
4. Focusable Areas
Quite generally speaking, focusable areas are elements that have a tabindex and that are therefore being rendered are focusable areas.
For the tabindex attribute, its purpose is exactly to manage focusable areas. It “allows authors to make an element and regions that have the element as its DOM anchor be focusable areas, allow or prevent them from being sequentially focusable, and determine their relative ordering for sequential focus navigation.”
—The original posts come with a little more detail, and the HTML specification has even more. Follow the HTML concepts series on meiert.com (RSS feed just for posts about web development)!