Collective #716

Inspirational Website of the Week: Jorge Toloza
An excellent design with a unique feel and smooth animations. Our pick this week.
Get inspired

This content is sponsored via BuySellAds
Build websites faster with Divi Cloud
Divi Cloud is like Dropbox for your Divi websites: save something to Divi Cloud and it becomes available on all of your and your clients’ websites while you build them.
Check it out

Mobile-First CSS: Is It Time for a Rethink?
Patrick Clancey summarizes the advantages of the mobile first approach and some alternate solutions if mobile-first doesn’t seem to suit a project.
Read it

The World’s Most Satisfying Checkbox
Some great insight into how the (Not Boring) Habits app became Apple Design Award winner with a game feel approach.
Read it

Fresh
Just in time edge rendering, island based interactivity, and no configuration TypeScript support using Deno.
Check it out

Untools
A collection of thinking tools and frameworks to help you solve problems, make decisions and understand systems.
Check it out

Software Engineering
Addy Osmani shares some of the software engineering soft skills he has learned from his first 10 years on Google Chrome.
Read it

CSS Shadow Gradients
A generator for supercool shadow gradients with pure CSS. By Alvaro Trigo.
Check it out

In circles and spheres
In this Offscreen Canvas edition, you’ll learn all about looping over circles, sines, cosines, and spheres.
Read it

Simple CSS solutions
Kevin Powell shows some straigh-forward CSS solutions using pseudo-classes.
Watch it

Aspects of Accessibility (a11y) – Semantics, Contrast and… Anxiety?
An article by Sara J. Wallén that covers some a11y issues, also looking at anxiety-inducing design.
Read it

Plain text. With lines.
Kartik Agaram writes about an app he made that allows to write and draw.
Check it out

Stack Tower Game
Michal Zalobny made this Stack Tower Game with THREE.js and React based on Hunor Márton Borbély’s tutorial.
Check it out

The End of Localhost
Learn why swyx thinks that in the future, most development will not be done on localhost.
Read it

Tooll 3 – A realtime animation toolkit
An open source software for motion design and procedural content generation. Makers are calling for folks to help and try it out!
Check it out

Three.js Particle Skull
Anderson Mancini made this interactive skull in Three.js. Watch the breakdown and check out the code.
Check it out

Better scrolling through modern CSS
Learn all about improving scrolling through CSS in this article by Mayank.
Check it out

Useful utilities and toys over DNS
Free and useful services over DNS accessible on command line.
Check it out

How to: Make your multilingual website suitable for RTL
Some knowledgeable things to make your website suitable for RTL and LTR languages with just HTML and CSS.
Check it out

I’ve locked myself out of my digital life
A very interesting article by Terence Eden on a situation that shows the limits of the “Code Is Law” movement.
Read it

Calendar.txt
Keep your calendar in a plain text file with Calendar.txt. It is versionable, supports all operating systems and easily syncs with Android mobile phone.
Check it out

Patterns
The W3C Web Accessibility Initiative (WAI) shares some essential patterns for understanding when and why to use ARIA.
Check it out

Dialogs and shadow DOM: can we make it accessible?
Nolan Lawson takes another look at getting dialogs to play nicely with shadow DOM.
Read it

Sake
Sake is a command runner for local and remote hosts. You define servers and tasks in a sake.yaml config file and then run the tasks on the servers.
Check it out