Collective #671
Website of the Week: Dpt.
Innovative like its studio, this website shines with playful details and exciting interactions. Our pick this week.
Get inspired
Building a breadcrumbs component
A foundational overview of how to build a responsive and accessible breadcrumbs component for users to navigate your site. By Adam Argyle.
Read it
Streambus
A better business model for video folks where you can create your own streaming service and make money from subscriptions.
Check it out
The most efficient way to build your WordPress site
Enjoy a fully-featured website templating system that harnesses the power of Divi’s Visual Builder to design your website’s header, footer, product templates, post templates, category pages, 404 page, and more.
Check it out
Carrd
A free platform for building simple, fully responsive one-page sites for pretty much anything.
Check it out
Back to the Future with RSS
It’s always good be reminded how awesome RSS is and why we should choose it over social networks.
Read it
Custom properties and @property
Peter-Paul Koch’s interesting article about @property and how it is useful for extending CSS inheritance, yet fails to approach the general applicability one would hope for.
Read it
Vanishing Suzanne
A magical vanishing effect made by Arno Di Nunzio.
Check it out
The performance effects of too much lazy-loading
Learn about data-driven advice for lazy-loading images with Core Web Vitals in mind in this article by Rick Viscomi and Felix Arntz.
Read it
Uniclode: yet another demo of Eleventy Serverless
Uniclode is a zero-clientside JavaScript application that lets the end user select individual characters to generate a unicode-range value that can be used in font subsetting. By Zach Leatherman.
Check it out
Glitter text
This is from a while back but it’s just so amazing: make some super realistic glitter text in SVG!
Check it out
Designing for the Unexpected
Cathy Dutton explains how to create more robust and flexible designs by focusing on content that adepts to any environment.
Read it
The worst volume control UI in the world
A group of bored developers and designers has decided to start a thread on reddit to figure out who can come up with the worst volume control interface in the world. Fabricio Teixeira shows some examples.
Check it out
Svgbob editor
In case you didn’t know about it: Svgbob is a diagramming model which uses a set of typing characters to approximate the intended shape.
Check it out
The accessibility stalemate
Christian Heilmann explains what he means by accessibility stalemate and why he believes it’s the root cause which makes the topic of accessibility less accessible.
Read it
Trust in Software, an All Time Low
Lars Wikman shares why he couldn’t give a good reason why anyone should trust, or like, software the way it typically works these days.
Read it
WebSockets and Node.js – testing WS and SockJS by building a web app
Learn how to build a cursor position sharing web app to demonstrate how to implement WebSockets with Node.js, and the pros and cons of WS and SockJS.
Read it
Of Course We Can Make a CSS-Only Clock That Tells the Current Time!
Learn how to build a fully functioning and settable “analog” clock with CSS custom properties and the calc() function. By Mate Marschalko.
Read it
From A Colourblind Designer To The World: Please Stop Using Red And Green Together
Learn how designers can avoid creating problems for color blind people in this article by Andrew Wilshere.
Read it
Wobbles and bubbles
Cassie Evans’ supercool scrolltrigger demo.
Check it out
Acid Tabs
An open-source Chrome extension for auto-grouping tabs by URL patterns.
Check it out
Graphlatte
Next.js template with GraphQL, Urql, Prisma, Nexus and Tailwind.
Check it out
Creating a Typography Motion Trail Effect with Three.js
A tutorial on how to use WebGL framebuffers via Three.js to create an interactive typography motion trail effect.
Check it out