Preloading fonts for web performance with link rel=”preload”

by ScheppEverybody loves fast websites, and everyone despises slow ones even more. Site speed significantly contributes to the overall user experience (UX), determining whether it feels positive or negative. To ensure the fastest possible page load times, it’s crucial to design with performance in mind. However, performance optimization is an art...

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 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...

by J. Pedro RibeiroNot too long ago, building an accordion component would require you to use a combination of JavaScript and CSS. If you've been around for as long as I have, you might have used a library like jQuery or Mootools. If you went "vanilla", your code would look something like this: div class="my-js-accordion"> span>Learn more about...