Collective #623
Inspirational Website of the Week: Claudio Guglieri
A well designed and exciting web experience by Claudio Guglieri. Our pick this week.
Get inspired
Website Heatmaps & Behaviour Analytics Tool
Understand how users are really experiencing your site without drowning in numbers!
Try it free
Progressive Enhancement with WebGL and React
David Lindkvist explains how the 14islands team approaches mixing creative technologies like WebGL and HTML/CSS while ensuring the content is still available to as many visitors as possible.
Read it
Sidebar Webring
The Sidebar Webring is a collection of handpicked sites and blogs focused on design and the web. Read more about reviving this cool old concept in this article by Sacha Greif.
Check it out
BGJar
A Free SVG background generator with lots of patterns to choose from.
Check it out
Forms best practice
A comprehensive guide to well-made forms by Geri Reid.
Check it out
eleventy-high-performance-blog
A starter repository for building a blog with the Eleventy static site generator implementing a wide range of performance best practices.
Check it out
Sombras.app
Create and share shadow art with Sombras. Made with React-three-fiber and cannon.js.
Check it out
How to use CSS clipping
Another great article by Rachel Andrew where you’ll learn the different ways to create a clip-path.
Read it
Learn CSS Centering
A visual guide to everything you need to know about centering in CSS by Ahmad Shadeed.
Read it
An Introduction To Running Lighthouse Programmatically
This article contains a brief introduction to Lighthouse, discusses the advantages of running it programmatically, and walks through a basic configuration.
Read it
How to Use Fetch with async/await
In this article Dmitri Pavlutin shows the common scenarios of how to use the Fetch API with the async/await syntax.
Read it
Mirrors
React-three-fiber powered mirrors made by Marco Ludovico Perego.
Check it out
Is this evil?
Lars Wikman asks an interesting and important question reagrding some “evil” things that can be done with CSS.
Read it
Understanding the Event Loop, Callbacks, Promises, and Async/Await in JavaScript
In this article, you will learn about the event loop, the original way of dealing with asynchronous behavior through callbacks, the updated ECMAScript 2015 addition of promises, and the modern practice of using async/await.
Read it
Voronoi Pebbles
Beautiful Voronoi pebbles by James Hancock.
Check it out
Crumbskees
Such a cool game: The Crumbskees are lunch-munching couch potatoes on the hunt for more food. Eat as many snacks as you can before your show comes back from commercial!
Check it out
fr.js
An amazing Three.js demo by Yuri Artiukh.
Check it out
Learning About CSS 3D Transforms and Perspective
Michelle Barker shares her journey of learning 3D transforms and perspective.
Read it
Tooltip Sequence
A simple step by step tooltip helper for any site.
Check it out
The tangled webs we weave
Dave Rupert shares another reflection on modern web development.
Read it
How to use CSS masking
Rachel Andrew explains how to use the mask-image property in CSS, which lets you specify an image to use as a mask layer.
Read its
Writing even more CSS with Accessibility in Mind, Part 1: Progressive Enhancement
The first article in a series on writing CSS with accessibility in mind by Manuel Matuzovi?.
Read it
Setting Up Tailwind CSS in a Vue.js Project
Learn how to craft better looking Vue.js apps using Tailwind CSS. This tutorial explains what Tailwind is and how to set it up in a Vue project.
Read it
You Really Don’t Need All That JavaScript, I Promise
An interesting presentation by Stuart Langridge at GOTO Chicago 2020.
Watch it
Tools should not only be for experts – they should turn us into them
Christian Heilmann argues that it is high time we moved away from the concept of “tools for experts” towards one of “using this tool over time makes you an expert”.
Read it
Managing several displays with the Multi-Screen Window Placement API
Thomas Steiner article about the Multi-Screen Window Placement API that allows you to enumerate the displays connected to your machine and to place windows on specific screens.
Read it
LED Switch
A very nice switch made by Jon Kantner.
Check it out
Menu to Inner Page Animation with Image Grid Background
A website layout with a menu and background image grid that animates to an inner content page.
Check it out