Practical SVG

“Sizing svg is more complicated than sizing an img,” writes Chris Coyier in this excerpt from his new A Book Apart title Practical SVG. But, he continues, it’s complicated in a good way—it gives us more control and opens up some interesting new possibilities. Read on.

Using Webfonts

Using webfonts begins with a simple CSS declaration, but creating usable font stacks and fallbacks is not as simple as it might sound. Bram Stein sets us up for success in an exclusive excerpt from Chapter 2 of his spanking new Webfont Handbook, available now from A Book Apart.

Semantics to Screen Readers

As an extension to our From URL to Interactive series, designer and front-end developer Melanie Richards takes a deep dive into how our content is accessed by a wide array of screen readers, which are highly customizable to users. Understanding the nuances of accessibility APIs, thorough testing approaches, and the wealth of resources available, site creators can create the most widely accessible content for the most users possible.

Tags to DOM

In the second installment of A List Apart’s four-part “From URL to Interactive” series, Travis Leithead, former editor of W3C’s HTML spec, walks us through the process of parsing HTML: from how browsers create trees to how the DOM responds to events. Equipped with this knowledge, you’ll be able to make smarter DOM decisions, reduce time to interactive, and eliminate unintended reflows.

The Best Request Is No Request, Revisited

Now that HTTP/2 is enjoying greater ubiquity than ever, it’s especially important to challenge the once unquestionable rule of resource bundling in client side performance. Join Stefan Baumgartner as he walks you through the potential pitfalls and ill effects of bundling in HTTP/2 environments.

Integrating Animation into a Design System

Like color and typography, a cohesive animation system can help express a product’s personality and make the interface feel connected and whole. To achieve that, animation should be established holistically, almost as a system in its own right. Alla Kholmatova shares a way to approach interface animations in a systematic way.

Web Animation Past, Present, and Future

Despite the rise and fall of Flash on the web, designing with animation has fiercely stirred us for decades. And yet nothing compares to its latest surge of evolution. Rachel Nabors lays out the array of tools and techniques that are fundamentally reframing our ideas about animation, and looks ahead to see where this path is taking us.

Finessing `feColorMatrix`

CSS filters lack the ability to do per-channel manipulation—a huge drawback. They may be convenient, but CSS filters are merely shortcuts derived from SVG; as such, they provide no control over RGBA channels. SVG (particularly the feColorMatrix map) gives us much more power and lets us take CSS filters to the next level. Una Kravets guides us through feColorMatrix and shows us how we can harness its power to create detailed filters.

More Resources for Accessible Animations

Earlier this week, we learned about designing safe animations for those living with motion sensitivity. Today, Val Head shares additional resources for creating more accessible animations.