Categories
Accessibility Code

If It Looks Like a Duck: A Cautionary Tale

“If it looks like a duck, swims like a duck, and quacks like a duck, then it’s probably a duck.” I recently worked on putting a plan together for improving the accessibility of a search component on WordPress.com. The existing interaction worked like a combobox where the focus was kept on the search input and […]

Categories
Accessibility Code Wordpress

Podcast Player block: Behind-the-Scenes Accessibility

On my team at Automattic, we built the new Podcast Player block released in Jetpack 8.5 and on WordPress.com. This post is intended to give you a behind-the-scenes style look at all the little details that went into attempting to provide a good, accessible experience for everyone. I’ll be focusing a lot on Screen Reader-specific […]

Categories
Code Tutorial

Learning via Terrible Ideas: Replacing Text on Click, Part 2

In Part 1 of Learning via Terrible Ideas, we learned how to: Open the Console Set a variable Add a Click Listener But adding a click listener doesn’t make it accessible to people who use a keyboard or different kind of assistive technology. To make our example accessible, we’ll need to: Give a “focus indicator” […]

Categories
Code Tutorial

Learning via Terrible Ideas: Replacing Text on Click, Part 1

JavaScript is pretty fun. You don’t need to know much to start playing around with it. Let’s jump in with a Terrible Idea that You Should Never Do.™️ Note: This article is intended for beginners (and kids!), but has plenty of extra tidbits along the way. I’ll be intentionally glossing over most topics, but give […]

Categories
Accessibility Code

The Importance of HTML

In 1917, the artist Michael Duchamp submitted his work, “Fountain,” to an art exhibition. It’s a used urinal. And it stirred up yet another conversation about, “What is art?” I’ve only taken one art history class, so forgive my simplification here. Essentially, art is subjective. If you personally don’t like Duchamp’s urinal, it doesn’t make […]

Categories
Code Wordpress

Taxonomy Queries with WordPress v2 REST API

In order to access posts by a taxonomy query via the v2 WP REST API, you’ll need to do a little set-up first. Let’s say we’re starting a beer blog, and we’re attaching two custom taxonomies to our posts: “styles” and “breweries”. Creating the Taxonomies When you register the taxonomy using register_taxonomy, you have to […]

Categories
Code

Tutorial: How to Minify & Version a JS File with NPM Scripts

One of the studies with the Center for Media Engagement needed a straightforward way to maintain and deploy a single JS file. I didn’t want to use a big fancy WebPack or Gulp setup when all we needed was to minify and version a single JS file, so I turned to using npm scripts. tl;dr […]

Categories
Code Wordpress

WordPress Actions Made Simple

I was coding WordPress themes for an embarrassingly long time before I fully understood how to use WordPress actions. This is how I wish someone had explained them to me when I was beginning as a developer. I’m going to walk through this abstractly, not with actual WordPress hooks. The point of this article is […]

Categories
Code

Basic HTML Boilerplate Structure

When you only create a new base template every few months (or longer!), it’s hard to remember the little details of the structure that you don’t touch often. As of HTML5, the <doctype>declaration and structure has gotten a lot easier, but it’s still easy to forget. Here’s the basics: Notes on Easily Forgotten Structural Tags […]

Categories
Code Wordpress

Switch WordPress Database based on Git Branch

I’m working on a large redesign project where lots of database changes are going to take place. In order to not mix-up the current master branch with the new redesign changes, I made a new database so I can keep things separate. The only trick is to remember to change out the database in wp-config.php […]