Empathetic Web Design

Recently at work (and outside of work) I've been re-entering the frontend world of javascript and responsive web development. It hasn't been an easy return. The last year or so of working with package management, server configuration, and API best practices has been a lot of fun. I've never enjoyed frontend quite as much, especially because every visible web project seems to get mired in the design-by-committee antipattern. However, it has given me the chance to approach things from a fresh point of view.

Many web designers and developers tend to build things in their image. That is, a frontend developer will use Chrome or Firefox on a large screen from an overpowered computer and fast internet speed, worrying about tweaking an animation or maximizing the screen size to fit even more content. That's not to say that they don't build things to work on smaller devices: Bootstrap has built-in breakpoints, after all. They just miss the point.

Responsive design is a great start, as is automated cross-browser testing (if you are so lucky to have such tools in your deployment workflow), but they're both short-sighted solutions to a larger problem. Developers (myself included) tend to build things that fit our needs and usage. They build web applications that have huge footprints and disgusting memory usage and can barely render on mobile browsers, let alone anything that isn't the latest webkit nightly build. We need to be more empathetic.

Instead of thinking of what we want from an application, or the devices we use, or our workflows, we need to be aware of how users are using things. We can't let bootstrap or cross-browser testing close that gap. We should be actively building and testing things against the same tools and patterns users are using. Device labs is a great way of doing this, as well as user interviews and testing. And when a bug report comes in about someone on Windows 7 using IE8 comes in being unable to do something because of a shortcoming in jQuery, that's important. For every bug that is reported by a user there are a dozen disappointed users who simply gave up and left.

So the next time I approach a fronted project I'm not going to hope that Bootstrap and jQuery will gloss over the fine details and make most of my users happy. Bootstrap and jQuery can barely handle the most basic of cross-device usage. Instead I'm going to put myself in the user's shoes. What do they expect from the site? How many years has passed since they last updated their browser, or even their operating system? How many popups are they subjected to during a given day? How long are they willing to wait while my hundred assets load? Then maybe, just maybe, I can build something that people outside of the internet's one-percent will actually use.