Redesigning your product and website for dark mode
Implementing dark mode is easy, but designing for it is less so. Here are some things you should consider when designing a dark mode version of your product or website to ensure you maintain accessibility and readability, and a consistent feel for your brand between Light and Dark.
CSS and Network Performance
In this post I want to look at how CSS can prove to be a substantial bottleneck (both in itself and for other resources) on the network, and how we can mitigate it, thus shortening the Critical Path and reducing our time to Start Render.
Organize CSS with a Modular Architecture: OOCSS, BEM, SMACSS
What if we could create interface pieces that behaved more like Lego blocks? This would speed up our frontend development, making it more robust, more organized. Our HTML would get smaller, and our CSS would get MUCH more manageable. In this article, I’ll show you how to organize your CSS architecture into HTML/CSS blocks that behave more like Lego blocks.
Implementing a variable font with fallback web fonts
With variable fonts, more typographic richness and influence is coming to the web and this at a relatively low file size. You want to benefit from that in your next web project, but still, you don’t want to bet everything on this new technique? This article will show you how to integrate a variable font in your website and use classic web fonts as a fallback.
Simplify Styling with Functional CSS
With functional CSS, your classes should apply one visual effect (e.g. no underline), and apply that every single time. So your CSS becomes made up of many small parts, that can be composed to give a specific visual effect.
We’ve invented “patterns” for handling fetching external data for our apps. Like most things, these patterns each have tradeoffs that have changed over time. In this post we’ll break down the pros and cons of three of the most common patterns, Callbacks, Promises, and Async/Await and talk about their significance and progression from a historical context.