Read Translating Design Wireframes Into Accessible HTML/CSS by Harris Schneiderman

In this article, Harris Schneiderman walks you through the process of analyzing a wireframe and making coding decisions to optimize for accessibility.

The most efficient way to build accessible websites and apps is to “shift left” by incorporating accessibility testing into the earliest stages of your development and design process. In this article, Harris will walk you through the process of analyzing a wireframe from an accessibility perspective and making coding decisions to optimize for accessibility in both design and development phases.

I’ve introduced John to the #GenesisWP framework, and he loves it. And thank you tons @cdils for the updated non-graphical hook and filter reference! It’s now bookmarked so I don’t lose it.
Migrating an existing site to Gutenberg, day 4, first note: John and I spent a considerable amount of time fighting with, and swearing at, the Bitnami install script for WordPress.

John’s is working right now but I’m about to go through my fourth reinstall of actual Xampp because when you attempt an uninstall of the WordPress module it doesn’t clean up after itself so you have to nuke the whole thing and start over.

Once I figure this out, (I have an idea what the problem is and it has a lot to do with unlabled fields with placeholders that you can’t easily edit), I’ll start writing down all the dumb stuff you have to do with the keyboard and your screen reader to make this work.

And it’s a lot of dumb stuff.

And we’ll also walk through removing the several plugins that get installed with this thing so you can get back to an actual out of the box WordPress installation.

I absolutely despise install scripts that install a bunch of third-party plugins without asking me first. Extra points taken away if they’re plugins I’ll never use or actively go out of my way to remove wherever I find them.

We’re still going to do the manual install as well but now I’m livid at this script and its stupidity and I keep telling myself we’ll eventually get to actual block development.

Migrating an existing site to Gutenberg, day 3, second note, this one’s shorter.

As I was writing the last note and attempting to add a code snippet, I inwardly groaned at the task of converting all the quotes and other characters into their appropriate character entities, until I remembered that I have Justin Tadlock’s old-but-still-working-just-fine code snippets plugin installed.

Nice, accessible modal for adding code snippets, generates a shortcode for the post.

So it’s coming along with me as we make this migration because the Gutenberg code block would have to be absolutely amazing to get me to switch to it for my code snippet needs at this point.

So Justin’s code snippets plugin is added to the list of plugins that will need to be redone for a Gutenberg world and I will be more than happy to do it myself because I am not giving it up.

Migrating an existing site to Gutenberg, day 3, first note: This is a long one.

John figured out that you can right-click on the button on the Bitnami page and download your preferred app installation package that way. I looked at the source code for the page and the reason the links for downloads present as buttons is because of this gem:

<a class="indirect_download_link " style="outline: none; display: none !important" role="button" data-target="#downloadFileModal-1013270" data-toggle="modal" href="/redirect/to/1013270/bitnami-wordpress-5.4.1-0-module-linux-x64-installer.run">Linux </     a>

</a>
Somebody needs to have a talk with the Bitnami people about their Aria flare, because they’ve given the links the role of button, which There are some free WordCamp talks on how to use ARIA properly as well as on how roles work, and plenty of articles written by accessibility experts on ARIA roles and on top of that some courses.

Admittedly I didn’t think to try the right-click-on-the-button trick yesterday when I was fighting with it because I still haven’t managed to wrap my brain around the why of the stupid developer trick of changing the role of a perfectly-working anchor element via ARIA when if you really wanted the thing to be a button you could have made an actual button or even styled the thing to look like a button while still making sure it actually works.

But OK, on to the other bits.

Download the file, and then press enter on it once Xampp is running, and this is where things got weirder.

john got the fields filled in for the Bitnami script, (or at least he thought he did), and got the WordPress installation up and running, only to find that he couldn’t log in and couldn’t reset username and password because the email entry apparently didn’t take.

He fought with it for something like thirty minutes using various bits of Jaws magic, and then finally decided to wait to get the assistance of a sighted person to figure out where things went sideways.

I’ve decided to skip the whole thing and just do a manual install, which I will get to tomorrow. I’m not interested with putting more time into a script for a quicker install than an actual manual install would take.

If John can figure out what the problem is then we’ll write the whole thing up and publish it as a tutorial for those who use screen readers and don’t want to do manual WordPress installs. I’m of the opinion that this is merely putting off the inevitable because when it comes to installing various javascript tools for development or PHP or whatever the command line will become unavoidable, but we’ll offer the option.