MTL Murals

Back in December I stumbled across Montreal’s Open Data portal. When I spotted a data set of the city’s beautiful murals and their locations, I decided to create MTL Murals, a simple website that plots out Montreal’s murals on a Google Map.

MTL Murals preview

My original goal was to learn about the Google Maps JS API and practice my ES6 chops but I ended up getting much more out of it. In this post I talk about what I learned from making MTL Murals and how much mileage I got from this little side project.

I wrote about common accessibility issues

I wrote about common accessibility issues, using as an example.

Check out the article here!

I wrote my first Medium article

The other day I published an article on Medium for the first time, under the Shopify UX publication.

It’s about accessible, mobile-friendly data tables, and the lessons that I learned making it. You can check it out here 🙂

Hopefully many more to come!

Accessibility improvements to my blog

These past few months I’ve been super-interested in web accessibility (a11y). As I was learning more about it, I was also compiling a list of a11y-related issues on my own blog. This weekend I spent some time to finally scratch the ol’ itch and crush a bunch of these issues. This is great news for all ten of my readers!

VoiceOver, tables and visually hiding columns

I was working more on tables when I ran into another weird issue in VoiceOver. I needed to visually hide a column in a table, but not use display: none so that it could still be accessible by screen readers.

I tried out the “position content off-screen” technique outlined by, and that worked great until I started testing in VoiceOver.

a11y: Tables and Borders

The past few weeks at work I’ve been working a lot with tables. I was testing for accessibility using VoiceOver when I ran into an interesting discovery.

Preventing the annoying over-scrolling inside modals

Oftentimes websites have modals with scrollable content inside. A common annoyance with modals is the ‘over-scrolling’ that happens when the user scrolls past the bottom of the modal’s contents. In other words, the browser starts to scroll the contents of what’s behind the modal.


Scrolling past the bottom of a modal will cause the content behind it to scroll, and vice versa. Demo of this annoying behaviour here.

I was working on modals with my coworker Dom when we discovered an easy way to prevent this with CSS and a bit of Javascript!