Collective #288
Inspirational Website of the Week: Thaddé Méneur
An interesting slideshow and some smooth effects combined with some nice typography. Our pick this week.
Get inspiredLayerSnap! Markup-based SVG Animations
LayerSnap is a great open-source tool for a more user-friendly, markup-based approach to configuring SVG animations.
Check it outCSSRooster
CSSRooster takes your HTML code as input, including CSS styles, and then writes class names for your HTML tags by analyzing the patterns hidden in your code.
Check it outBridging CSS and JS with Custom Properties
Learn some best practices around using CSS Custom Properties as a bridge between CSS and JavaScript.
Read itJavaScript Start-up Performance
A fantastic article by Addy Osmani on start-up times and performance of JavaScript in the browser.
Read itMnemonist
A curated collection of data structures for the JavaScript language. By Guillaume Plique.
Check it outThe Google Analytics Setup I Use on Every Site I Build
Philip Walton shares his "boilerplate" analytics.js implementation and shows how to use some interesting features.
Read itAn Introduction to the Reduced Motion Media Query
Eric Bailey writes about the new and very interesting Reduced Motion Media Query.
Read itPreparing and Exporting SVG Icons in Sketch
A great guide on how to prepare and export icons for the Web, iOS and Android using Sketch. By Anthony Collurafici.
Read itJavaScript without Loops
Learn how control structures like loops introduce complexity and what to do about it. By James Sinclair.
Read itFree Font: Noway
Atipo's refreshing new font family with a unique touch.
Get itRings Navigation Concept
A cool menu demo by Bennett Feely.
Check it outextensions.af
If you love Chrome Exensions but not the store, then this might be interesting.
Check it outCSS Property Syntax Cheatsheet
Decipher the CSS property syntax in the specs with this helpful cheat sheet. Especially useful for understanding the new CSS Grid module. By Chen Hui Jing.
Check it outWebPack is not the only way
Learn about FuseBox, a new generation bundler and module loader for complex project requirements.
Read itTopoTopo
An awesome open-source platform that let's you search any geographic location and watch the terrain form into a physical model.
Check it outThe Insecure Designer
A delightful article on the two-sided nature of perfectionism and a designer's insecurities.
Read itCode Smells in CSS Revisited
Harry Roberts revisits his 'Code Smells in CSS' article and adds some helpful fresh insights.
Read itStatus Page
Netlify gives you a free status page for your project.
Check it outFree Font: Realla
A wonderfully artistic font designed by Gehan Magee.
Get itInspiration for Search UI Effects
A couple of schematic, inspirational proof-of-concepts for how to show the search interface on a website using CSS animations.
Check it out