Collective #468

Inspirational Website of the Week: Mathieu Lévesque
A portfolio with nice typographic effects and interesting details. Our pick this week.
Get inspired
Northwestern's Online MS in Information Design & Strategy
Build skills to translate data into compelling visuals and narratives and learn how research and analytics can drive communication strategies and tactics.
Find out more
Web.dev (beta)
A new site by the Chrome Developers team that aims to help developers learn and apply the web's modern capabilities to their own sites and apps.
Check it out
Web High Level Shading Language
WebKit introduces a new graphics shading language for the Web inspired by HLSL. Follow the interesting discussion on HN about this.
Read it
Squoosh
This great web app by Google lets you optimize images and reduce their size dramatically by editing the advanced options of various image compressors.
Check it out
A Brief History of Flickering Spinners
An interesting article by Mikael Ainalem on the troublesome case of too quickly ending loading animations.
Read it
Inlining or Caching? Both Please!
Scott Jehl explores caching inlined files and shows a proof of concept.
Check it out
VisBug
Make any webpage feel like an artboard with this browser extension by Google. Watch the video.
Check it out
Turtletoy
Turtletoy allows you to create generative art using a minimalistic JavaScript Turtle graphics API. By Reinder Nijhoff
Check it out
Why using 'tabindex' values greater than “0” is bad
Karl Groves lists the reasons why defining a number for tabindex should be avoided.
Read it
Developer page concept (digital design)
Dulov Evgeniy's delightful developer page concept.
Check it out
State of Houdini — Director's Cut (aka. Honest Edition)
The uncensored version of a great Chrome Dev Summit 2018 talk by Surma.
Watch it
Why Facebook's api starts with a for loop
A very interesting article by Antony Garand on the JSON hijacking vulnerability.
Read it
Free Font: Wanderlust
A unique looking slab serif font designed by Jan Henkel.
Check it out
Head: Free header starter kit (Sketch)
A nice set of hero starter templates by Stefano Peschiera.
Get it
#codevember 7/2018
A lovely jellyfish demo by Noel Delgado.
Check it out
The Writable Files API: Simplifying local file access
Pete LePage explains what the idea of the Writable Files API is and what you could do with it.
Read it
Emojious Free Icons
More than a hundred free icons from the adorable Emojious icon set.
Get it
Icons 8 Beta
An update of the useful icon web app with thousands of free icons.
Check it out
What is First Input Delay?
Ire Aderinokun's summary on the First Input Delay (FID) metric.
Read it
The 1.1.1.1 App
Private internet by Cloudflare now as a mobile app.
Check it out
My journey had lasted seven hours
Gerard Ferrandez created this demo of randomly and recursively generated trees.
Check it out
Page Flip Layout
A template with a two-sided, magazine-like layout and a flat page flip animation. The layout is powered by CSS Grid.
Check it out