A better HTML input experience (custom elements and the AOM) (2017)

Lion web components is a good starting point for anyone who&#x27;s interested in building a UI framework that comes with a lot of these accessibility features built-in.<p><a href="https:&#x2F;&#x2F;lion-web.netlify.app&#x2F;" rel="nofollow">https:&#x2F;&#x2F;lion-web.netlify.app&#x2F;</a>

For webmasters removing `outline` on `:focus` elements, a special cauldron in hell is prepared.

This article is from a long time ago and the spec changed substantially.<p>It&#x27;s now all done with properties on ElementInternals:<p><a href="https:&#x2F;&#x2F;developer.mozilla.org&#x2F;en-US&#x2F;docs&#x2F;Web&#x2F;API&#x2F;ElementInternals" rel="nofollow">https:&#x2F;&#x2F;developer.mozilla.org&#x2F;en-US&#x2F;docs&#x2F;Web&#x2F;API&#x2F;ElementInte...</a><p>They also decided not to ship AccessibleNode&#x27;s which is unfortunate because it removed the clearest path for canvas+wasm based UIs.<p><a href="https:&#x2F;&#x2F;github.com&#x2F;WICG&#x2F;aom&#x2F;blob&#x2F;gh-pages&#x2F;explainer.md">https:&#x2F;&#x2F;github.com&#x2F;WICG&#x2F;aom&#x2F;blob&#x2F;gh-pages&#x2F;explainer.md</a>

Having inputs look consistent between applications is a core plank of usability. Rolling your own custom widgets is just spending a lot of time and effort making the UI worse.

FE engineering is about making everything look like a printed pamphlet.<p>showing native elements is fine and safer. and browser should just plug the backdoors they found over the years to style them, since they are all technically click jacking attacks.<p>and all FEv will hate this comment because they don&#x27;t even know what&#x27;s a click jacking attack.