Projects

Table of Contents

Accessible Zonelets

Added

Accessible Zonelets is exactly what is sounds like, Zonelets, but accessible! I went into extensive detail on the changes I made and why in my blog post "How to Make Your Zonelets Blog More Accessible", but here's the TL;DR:

  • Added ARIA landmarks/page regions.
  • Added ARIA labels to help differentiate between the header and post navigation.
  • Added :focus styling for all elements that had :hover styling.
  • Added "skip to main content" and "back to top" links.
  • Changed links to have better color contrast with the background
  • Changed font size to use em instead of pixels.

The ZIP includes both the default zonelets starter pack and the bonus theme pack! I've gone through all of the themes and made sure they include the new accessibility features, while still keeping them as close to the original as possible.

Licensing: In the spirit of the original Zonelets, Accessible Zonelets is freely distributed under the MIT license. Obviously, most of the credit goes to the original creator of Zonelets, all I did was make some edits. I care more about people making accessible sites than I do personally being credited, so don't feel pressured to do so.

Added

I've been messing around with 11ty a lot lately and I plan to eventually migrate my site to it. In the past, I've really liked using Kalechip's static accessible gallery generator, but while testing I found it really cumbersome to use two different static site generators at once. This project is my attempt to adapt that gallery framework to an 11ty workflow.

I tried my best to keep it as close to the original as possible. You still organize everything in a JSON file and you create all your images pages automatically by creating pages From data. Everything should (hopefully) be pretty straight forward as long as you're comfortable using 11ty.

The only downside to mine is that you have to set the number of images per page twice, once on the index page and again on gallery-pages.njk, so that the keyboard navigation and "back to gallery" link works correctly. It's a little clunky, but it works. Also you might have to fiddle around with the permalinks in the front matter to fit your sites paths. Honestly, even if it's not perfect, I'm still pretty proud of myself. I'm just glad I was able to get it done at all.

Please don't hesitate to contact me if you have any questions or bug reports.

Licensing: This project is licensed under the GNU General Public License (GNU GPLv3)