#HackOnMDN

Published 2018-09-25 events

This weekend I joined a bunch of web developers, tech writers, web standards lovegods and other friendly folks in London, to work on accessibility documentation for MDN, Mozilla’s platform for learning about web development.

I had a brilliant time, meeting familiar faces from Twitter IRL and catching up with others. Not only did I learn lots about nails and stools (thanks Seren and Estelle), it was also great to be amongst like-minded people to overhear deeply technical accessibility discussions between people who already wrote about accessibility when I wasn’t even born yet.

People standing around table one man in front with laptop on lap Photo: Bruce Lawson, with a hipster filter added, as we were in Shoreditch

On the first day we got to know each other and picked projects to work on. While others looked at adding screenreader compatibility data and documenting WAI-ARIA better, I teamed up with Seren, Eva and Glenda to improve and add accessibility information on MDN pages that were about non-accessibility topics.

What I liked about that particular project, is that it exposes accessibility knowledge to people who are not necessarily looking for it. If you want to know how order works in CSS, you get some information about how it affects screenreader users for free. I’m optimistic. I believe most developers will do the right thing for their users. As long as they have the information on what the right thing looks like in code, design, strategy, testing, et cetera.

After lunch a lot of us gave lightning talks! Eva talked about the problems of automatically translating content and making technical videos available with captions, and Michiel did a great TED-style talk on when to use ARIA. It was just one slide.

Although MDN is a developer network, there are pages for many others. So on the second day I worked on revamping the page Accessibility information for UI/UX designers. It was fairly outdated, so it felt sensible to replace it with more hands-on advice.

On the last day I continued work on that page and did a PR to improve icon accessibility. I also gave a short lightning talk entitled “Making password managers play ball with your login form”, which is also a blog post on this site.

People sitting at tables with laptop, one girl smiling into camera Photo: Bruce Lawson

Others in the room did great work on getting screen reader compatibility data onto MDN, adding ARIA reference pages, cleaning up docs, modernising Spanish content, updating the WCAG reference with 2.1 content and improving MDN’s tooltips. There were also very informative lightning talks about focus styles, display properties and semantics, WCAG 2.1 and beyond (Silver) and accessible syntax highlighting.

It’s been a great three days. I’ve thoroughly enjoyed both doing contributions to MDN, as well as meeting and learning from like-minded people. And I’m proud we got so much done!

If you also want to contribute to MDN, all you need is a GitHub account. All pages have an ‘Edit’ button and people are more than welcome to help out.

Comments, likes & shares (11)

Ruud Steltenpool, (((Janet Swisher))), Eva Ferreira , and Peter Grucza liked this

(((Janet Swisher))), Eva Ferreira and Mozilla Hacks reposted this

Bruce Lawson wrote on 25 September 2018:
Hidde's blog post about last weekend's a11y #HackOnMDN that I gatecrashed.
Hidde de Vries wrote on 26 December 2018:

The year is about to end, so it is time for another year in review post! I love reading what others write about their years, hopefully mine is interesting to some people.

Like last year, I’ve divided stuff into highlights and things I learned. To be clear, that doesn’t mean I had a year consisting of 100% highlights and learnings, there is also stuff that went wrong, wasn’t amazing or was personal, I just think they’re for elsewhere (in person over drinks).

Highlights

Projects

In 2018, I spent most of my time in Mozilla’s Open Innovation team, working specifically on the IAM project. For those unfamiliar with it, IAM is short for identity and access management, it is about how people proof who they are and get access to stuff with as little friction as possible. It’s been super exciting to build most of the front-end for a project codenamed “DinoPark”.

In the last quarter, I’ve also spent a day a week working at the City of The Hague, specifically helping with improving accessibility and profesionalising front-end development of their digital services. It’s been great to see improvements shipped both in the application’s code as well as the content management system product.

Other short engagements included:

  • teaming up with Jeroen and Peter, I helped NOS, the Dutch broadcaster, with an accessibility audit, user tests with visually impaired users and an in-house presentation on technical accessibility
  • I ran a one day workshop on accessibility guidelines at Zilveren Kruis
  • with Peter, I worked on JavaScript to power a chat-like interface for the Dutch government

Volunteering

I did not do a lot of volunteering this year, but I did translate the Inclusive Design Principles into Dutch and worked on improving MDN documentation on accessibility.

Conferences and events

This year, I attended these events:

I spoke multiple times, too:

I did my CSS Layout workshop three more times (for Fronteers and at Front-end United) and ran a new accessible components workshop (for Frozen Rockets).

Organisers, thanks so much for having me. The first time conference speaking was stressful, time-consuming and very scary, but also satisfying. I got great feedback, both praise and things I can improve on (thanks, you know who you are).

I’d love to speak more in 2019, please do get in touch if you want to have me present at your event or give a workshop.

Writing

I published 26 posts on this blog, not including this one. Like I said in last year’s review: I very much recommend writing, it can be helpful in many ways. It is also great to be able to do this on a domain you own, on pages you designed. If anyone needs mentoring around this, get in touch, I would love to help!

Some of the most read posts:

Reading

It felt a bit weird to have the Goodreads app keep me in check reading-wise, but it did the job. I managed to read more than the goal I set. Some that readers of this blog might find interesting:

Book covers of brotopia, klont, common sense and killing commendatore
  • Brotopia, about the ‘bros’ that founded some of the biggest Sillicon Valley corporations and the culture they created. I must admit some doubts towards the word ‘bro’ , but wow, the book taught me a lot about how I don’t want to be and where I don’t want to work.
  • Klont – if you read Dutch, get it! This novel brilliantly captures the phenomenon ‘datafication’ and how it endangers some of the basic concepts of free societies, as well as, unrelated, the phenomenon of ‘experts’ traveling the world to give talks
  • Common sense, the Turing test and the quest for real AI – sometimes fairly technical and academic, but I loved the hype-free thinking about artifical intelligence and what to expect from it
  • Killing Commendatore – if you’re into Murakami or want to start reading his work, this is great. It is a lot of pages, in two parts, but worthwile. I read the Dutch translation, it is available in many other languages, too.

For all the ‘big data’ and AI expertise that Amazon, which owns Goodreads, has, the app is still very bad at recommending new books. For me, it doesn’t go beyond what the most generic airport bookshops stock. The real human beings I have befriended there brought much more reading inspiration.

Things I learned

Some random things I learned:

  • I finally got my hands dirty in declarative client-side component frameworks. My framework of choice was Vue.JS. I learned concepts like routers, props down / events up, reactivity and lifecycle hooks, enjoyed working in this paradigm, but even within that, I mostly wrote just JavaScript, good markup and sensible CSS. I have a blog post upcoming on this.
  • I learned in multiple projects this year how hard it can be to explain the concept of focus. It exists as a thing in the browser (the document.activeElement), but also as a thing in people’s thinking, not necessarily the same way. And then I’m not even talking about indicating focus yet. In my talk in Groningen I spent a number of slides trying to get it crystal clear. I like Laura Carvajals “You wouldn’t steal their cursor” and tried a streetlights metaphor (they are not pretty, but if they’re not there, you can’t see where you’re going at night)
  • I worked with WCAG 2.1 in real projects (testing for the newly added success criteria and talking about them in slides)
  • I added CSPs to some sites (see also How I learned to stop worrying and love CSPs)
  • I did more background reading to better understand the world we’re developing front-ends for (super meta), inspired by various colleagues, conference speakers and friends

What I want to get better at next year:

  • writing and presenting
  • I want to try and build something with Rust
  • get more people excited about having a personal website with a blog

With that, I wish all readers a fantastic 2019! If anyone has written year in review posts, I’d love to hear about them in the comments/webmentions, and read what you have done.