Boost website speed with prefetching and the Speculation Rules API

by Alexis DegryseI think we all know the element (and if you don’t, it’s ok). It holds a list of elements, offering suggested choices for its associated input field. It’s not an alternative for the element. A field associated to a can still allow any value that is not listed in the elements. Here is a basic example: Pretty cool, isn't it?...

by Alexander MuzenhardtIntroduction Imagine you’re tasked with building a cool new feature for a product. You dive into the work with full energy, and just before the deadline, you manage to finish it. Everyone loves your work, and the feature is set to go live the next day. A few days later, you receive an email from a user who can’t access the...

by David LuhrThe Description List () element is useful for many common visual design patterns, but is unfortunately underutilized. It was originally intended to group terms with their definitions, but it's also a great fit for other content that has a key/value structure, such as product attributes or cards that have several supporting details....

by Alistair ShepherdWeb performance is incredibly important. If you were here for the advent calendar last year you may have already read many of my thoughts on the subject. If not, read Getting started with Web Performance when you’re done here! This year I’m back for more web performance, this time focusing on my favourite HTML snippet for...

by Steve FrenzelThis example is a classic - in a bad way - and can cause quite some confusion for users of assistive technology (AT). But it's also very easy to fix! It's the element missing its dear friend, the ... 😭 Bad code input placeholder="Search" /> It's not relevant for this article, but here's the "button" to submit the content of the...