Clickable DIVs and Other Icebergs
1:30pm Friday 15 November (Stream Two)
There are plenty of tutorials out there with accessibility clangers in them, leading many beginners to unwittingly replicate mistakes like the clickable DIV. Since clicks are just a tiny part of the DOM iceberg, we’ll walk through all the code required to actually replicate a BUTTON.
Whether you are a new developer or a leader of devs, understanding the button example opens up a range of topics UI developers need to know. Industry trends have created a knowledge gap around frontend development, so we need to ensure our learning and development plans respond accordingly.
And your onboarding needs to strip away any assumptions that devs know HTML, CSS or accessibility. There has been a sharp industry shift to JS-heavy bootcamps; and universities have never taught this well. The DIV vs BUTTON exercise leads people to understand keyboard interaction, focus and other states, disabled controls and styling concerns. At Quantium we use it as part of the “semantic HTML” onboarding tutorial.
Engineering Lead, Quantium
Ben Buchanan started creating web pages in the nineties, while completing a degree in everything but I.T.
He has created frontend systems for companies including News Ltd, Atlassian, Ansarada and Quantium.
He probably thinks about markup too much.