Sunday, February 10th, 2019
Friday, December 28th, 2018
This article conflates progressive web apps with having an app shell architecture. That’s a real shame.
Saturday, November 10th, 2018
Rachel does some research to find out why people use CSS frameworks like Bootstrap—it can’t just be about grids, right?
In our race to get our site built quickly, our desire to make things as good as possible for ourselves as the designers and developers of the site, do we forget who we are doing this for? Do the decisions made by the framework developer match up with the needs of the users of the site you are building?
Not for the first time, I’m reminded of Rachel’s excellent post from a few years ago: Stop solving problems you don’t yet have.
Tuesday, July 10th, 2018
Rachel goes into detail on how she uses pattern libraries—built with Fractal to build interfaces. I know it sounds like we paid her to say all the nice things about Fractal, but honestly, we didn’t even know she was writing this article!
After discovering Fractal two years ago, we have moved every new project — large and small — into Fractal.
Wednesday, June 20th, 2018
A lot of the issues here are with abuses of the
placeholder attribute—using it as a label, using it for additional information, etc.—whereas using it quite literally as a placeholder can be thought of as an enhancement (I almost always preface mine with “e.g.”).
Still, there’s no getting around that terrible colour contrast issue: if the contrast were greater, it would look too much like an actual pre-filled value, and that’s potentially worse.
Tuesday, May 29th, 2018
Rachel gives a terrific explanation of CSS layout from first principles, starting with the default normal flow within writing systems, moving on to floats, then positioning—relative, absolute, fixed, and sticky—then flexbox, and finally grid (with a coda on alignment). This is a great primer to keep bookmarked; I think I’ll find myself returning to this more than once.
Saturday, May 12th, 2018
A good core experience is indicative of a well-structured web page, which, in turn, is usually a good sign for SEO and for accessibility. It’s usually a well designed web page, as the designer and developer have spent time and effort thinking about what’s truly core to the experience. Progressive enhancement means more robust experiences, with fewer bugs in production and fewer individual browser quirks, because we’re letting the platform do the job rather than trying to write it all from scratch.
Wednesday, May 2nd, 2018
Good advice on print styles from Rachel. The browser support situation is frustrating; I suspect it’s because the people working on browsers would rather get stuck in on shinier stuff.
Wednesday, April 18th, 2018
A great set of answers from Rachel to frequently asked questions about CSS grid. She addresses the evergreen question of when to use flexbox and when to use grid:
I tend to use Flexbox for components where I want the natural size of items to strongly control their layout, essentially pushing the other items around.
A sign that perhaps Flexbox isn’t the layout method I should choose is when I start adding percentage widths to flex items and setting
flex-growto 0. The reason to add percentage widths to flex items is often because I’m trying to line them up in two dimensions (lining things up in two dimensions is exactly what Grid is for).
Friday, April 6th, 2018
A remarkably practical in-depth guide to making ethical design decisions, with enjoyable diversions into the history of philosophy throughout.
Thursday, March 29th, 2018
The answers to these questions about forms are useful for just about any website:
- Is It OK To Place A Form In Two Columns?
- Where Should Labels Be Placed?
- Can We Use Placeholder Text Instead Of A Label?
- How To Lessen The Cognitive Load Of A Form?
- Are Buttons Considered Part Of A Form’s UX?
- Is It Possible To Ease The Process Of Filling A Form?
- Does The User’s Location Influence A Form’s UX?
Tuesday, January 16th, 2018
A step-by-step guide to implementing drag’n’drop, and image previews with the Filereader API. No libraries or frameworks were harmed in the making of this article.
Friday, January 5th, 2018
A nice overview of the Payment Request API, which is getting more and more browser support.
Tuesday, November 28th, 2017
Smashing Magazine has launched its lovely new design, but more importantly, it has launched its lovely new business model. Ads are gone. Patronage is in. This is a resource worth supporting.
Saturday, September 30th, 2017
A great practical article from Rachel answering some frequently asked questions about—what else?—CSS Grid.
Tuesday, July 25th, 2017
A great example of progressive enhancement in action.
You can perfectly use CSS grid layout today if you don’t expect exactly the same appearance in every single browser, which isn’t possible to achieve nowadays anyway. I’m well aware that this decision isn’t always up to us developers, but I believe that our clients are willing to accept those differences if they understand the benefits (future-proof design, better accessibility and better performance). On top of that, I believe that our clients and users have — thanks to responsive design — already learned that websites don’t look the same in every device and browser.
Thursday, July 20th, 2017
Tuesday, July 11th, 2017
Vitaly’s been bitten with date-picker fever. Here’s his deep, deep, deep dive into one interface element.
Thursday, March 23rd, 2017
Chapter 3 of Resilient Web Design, republished in Smashing Magazine:
In the world of web design, we tend to become preoccupied with the here and now. In “Resilient Web Design“, Jeremy Keith emphasizes the importance of learning from the past in order to better prepare ourselves for the future. So, perhaps we should stop and think more beyond our present moment? The following is an excerpt from Jeremy’s web book.
Wednesday, March 22nd, 2017