Lately, I’ve been wanting to play with layout that had more of a magazine feel. One thing that I noticed is that they’ll play with grids to create visual interest or to move your eye through a more dense page. Magazines have the advantage of a fixed size. For the web, we need to consider everything from watches to wide screens. CSS Grid seemed like a great way to play around with different options.
I first got into web design/development in the late 90s, and boy, it was horrendous. I mean, being able to make stuff and put it online where other people could see it was pretty slick, but we did not have very much to work with.
I’ve been taking for granted that most folks doing web stuff still remember those days, or at least the decade that followed, but I think that assumption might be a wee bit out of date.
I’m here to tell all of you to get off my lawn. Here’s a history of CSS and web design, as I remember it.
In this post, we’ll set up a demo site and tutorial for headless WordPress, including a starter template! We’ll use the WordPress dashboard for rich content editing, while migrating the front-end architecture to the JAMstack to benefit from better security, performance, and reliability. We’ll do this by setting up a Vue application with Nuxt, pulling in the posts from our application via the WordPress API.
For a recent New York Times article, I wanted to see if it was possible to create SVG charts that would work without JS. I haven’t seen the same combination of techniques used elsewhere, so I figured I’d write up the process. I’ve also created an experimental Svelte component library called Pancake to make these techniques easier to use.
I’ve been looking for a way to let users enter a destination country. Unfortunately, native HTML form controls just aren’t good enough for this type of interaction. And so we need to build a custom autocomplete control from scratch.
A word of warning though: this is one of the hardest UI components I’ve ever had to make—they’re just way harder than they look.
It’s 3019, how has writing stylesheets changed? Ire covers topics such as progressive enhancement, accessibility, internationalization, and performance as it relates to writing CSS in 3019 (and, of course, today).
There are many ways to start using a new feature in CSS without waiting for full cross-browser support, but “feature queries” are the most clear and explicit. We can use them to test for browser support, and provide targeted styles only where they are supported. Now we can do the same with new selectors, like ::marker or :focus-visible! Miriam Suzanne will show you how it works, and how to start using this new feature query right away.