Some Hands-On with the HTML Dialog Element
October 7th, 2019
This is me looking at the HTML <dialog> element for the first time. I’ve been aware of it for a while, but haven’t taken it for a spin yet. It has some pretty cool and compelling features. I can’t decide for you if you should use it in production on your sites, but I’d think…
Introducing Sass Modules
October 7th, 2019
Sass just launched a major new feature you might recognize from other languages: a module system. This is a big step forward for @import. one of the most-used Sass-features. While the current @import rule allows you to pull in third-party packages, and split your Sass into manageable “partials,” it has a few limitations: @import is…
Breakout Buttons
October 4th, 2019
Andy covers a technique where a semantic <button> is used within a card component, but really, the whole card is clickable. The trick is to put a pseudo-element that goes beyond the button, covering the entire card. The tradeoff is that the pseudo-element sits on top of the text, so text selection is hampered a…
Using GitHub Template Repos to Jump-Start Static Site Projects
October 4th, 2019
If you’re getting started with static site generators, did you know you can use GitHub template repositories to quickly start new projects and reduce your setup time? Most static site generators make installation easy, but each project still requires configuration after installation. When you build a lot of similar projects, you may duplicate effort during…
Why Progressive Web Apps Are The Future of Mobile Web
October 4th, 2019
Here’s one of the best essays I’ve ever read about why progressive web apps are important, how they work, and what impact they have on a business: PWAs are powerful, effective, fast and app-like. It’s hard to imagine a mobile web property that could not be significantly improved via PWA implementation. They can also potentially…
Awards That Look Beyond the Flashy
October 3rd, 2019
Dan Mall is judging the Communication Arts Interactive 2020 awards. These types of things are usually a celebration of flashy, short-lived, one-off designs. Those things are awesome, but Dan has more in mind: I’d love to award work that demonstrates creative use of the highest level of color contrast ratios and works well on assistive…
Adaptive Photo Layout with Flexbox
October 3rd, 2019
Let’s take a look at a super lightweight way to create a horizontal masonry effect for a set of arbitrarily-sized photos. Throw any set of photos at it, and they will line up edge-to-edge with no gaps anywhere. The solution is not only lightweight but also quite simple. We’ll be using an unordered list of…
Automated (and Guided!) Accessibility Audits with axe Pro
October 3rd, 2019
It’s important to know there are tools for automated accessibility testing of websites. They are a vital part of helping make sure your website is usable for everyone, which is both a noble goal and damn good for business. Automated tests won’t catch every potential accessibility issue, but they help a great deal, and in…
Mina Markham Should Make Beyoncé’s Site Accessible
October 3rd, 2019
I remember when this went around in January, and I’m a little shocked it didn’t happen. Mina is the perfect person for the job (like, duh) and the result would be good for everyone. Let’s make this happen. The least we can do is sign Amélie Lamont’s petition.
W3C Invites Implementations of Data Catalog Vocabulary (DCAT) – Version 2
October 3rd, 2019
The Dataset Exchange Working Group has published a Candidate Recommendation of Data Catalog Vocabulary (DCAT) – Version 2. DCAT is an RDF vocabulary designed to facilitate interoperability between data catalogs published on the Web. This document defines the schema and provides examples for its use. DCAT enables a publisher to describe datasets and data services…