A deep dive into webfonts
read the full articleInspired by Ben Halperns discussion about webfonts, I decided to take a deep dive into the subject. What are Webfonts, where did they come from and how do we load them as fast as possible?
7 habits to get into an accessible mindset
read the full articleIn times of crisis like the one we're facing now it's more important than ever to make our applications as accessible as possible. People rely on getting information from the apps and websites we design. Not being able to get a certain information because of poor network connectivity, weak hardware, or (most commonly) some stupid design mistake can be critical.
What most of our workflows right now are optimized for is MVP-and-ship. If your app somehow runs, it's good enough. Testing for accessibility pitfalls can be time consuming and arduous, so it's mostly ignored.
But we can fix that. By adopting a few habits we can get ourselves into a working mode that incorporates A11y into our daily grind.
Frameworking my Site
read the full articleI don't use one of the major frameworks to power my site. I instead opted to write my own - and in the process understand what a framework is and how it's built.
In Defense of the Separation of Concerns
read the full articleI'd like to make a point for the separation of concerns in web development.
HTML is a language that's been created for structuring and linking documents. CSS is for styling said documents. JS provides additional functionality. The three languages are heavily specialized to their intended use. They're also really good in what they're supposed to be doing.
But where's light there's also shadow. Straying away from their paths means you'd have to accept (or even mitigate) some disadvantages. Let's take a look at some of those.
Animation for Developers
read the full articleThis is going to be an article about motion in Interface Design. You'll hear me rambling about the implications of animation, when and what to animate, and how to be responsible with it. None of what I say is set in stone. I'll just try to give some general advice for handling animations in UI. However, you won't find any actual code snippets or step by step tutorials here.
Write an SPA in CSS
read the full articleLet's build a website. Let's make it about food, because I like food. Also, we need cats, because the Internet is made of cats. Also, because it's 2019, it can't have page reloads. What's that? All those small pages use way too much Vue and React and all of the Javascripts, you say? Alright, let's try without then, let's have it your way.
Battleship
read the full articleThis article appeared first on CSS-Tricks. Thank you, Chris & Geoff!
This is an experiment to see how far into an interactive experience I can get using only CSS. What better project to attempt than a game? Battleship seemed like a good challenge and a step up from the CSS games I’ve seen so far because it has the complexity of multiple areas that have to interact with two players. Wanna see the complete game?