Building accessible websites is a hot topic these days. Web developers recognize that their products need to be usable by different kinds of input devices and readable by different kinds of screens or screen readers. Little discussion involves how well our websites print, however.
To be clear, I’m talking about the kind of printing that involves paper. You know, the thing that we used to put everything on and that we have been happy to abandon? Yes, it seems quaint to even consider these days.
I work with a lot of people with little to no computer access. Almost all of them need to print all of the information they get online. In other words, if it’s not printable, then it might as well not be accessible. Something I quickly learned was that most websites are not printer-friendly.
I can’t tell you how many times someone has asked me, “how do I print this?” and I struggle to answer.
At first I assume it will be easy. “Just click the thing that looks like three lines (the Chrome menu) and then click ‘print,’” I’ll say.
But then we’re both staring at a jumbled mess of a print preview. “Never mind, I guess that doesn’t work,” I have to sheepishly admit. “Well, you can probably copy and paste content into a Word document and print it from there.”
Most of the people who I help don’t know what copying, pasting, or Word is. At this point they are rightfully confused as to why this is so complicated.
Like most accessibility features, printability isn’t something you automatically get for free with HTML. Modern web pages, with their interactive menus, sidebars, icons, links, and, regrettably, advertisements, can be hostile to printing.
Have you tried printing a Facebook photo directly from the browser? How about your Facebook messenger conversations? A random job description? How about a blog post that has 200 comments?
Keep in mind that paper and ink costs money. How would you feel if you tried to print a 500 word article and ended up paying for 20 pages of menus and buttons?
While writing this post, I decided to reach for a quick example. I loaded the first article I saw on npr.org and hit
If I was in charge of certifying printability, NPR would fail, but many sites are far worse. Their sidebars and ads will overflow and cover the content. Blank pages randomly get inserted. There’s no telling what new and exciting ways a web page will break when sent to a printer.
Printability isn’t an unknown issue to everyone, though. I’ve seen some websites make surprisingly good effort to make their content look excellent on paper. But I’m not aware of any consensus on what guidelines developers should follow.
For example: Should linked URLs be displayed next to their anchor text? How should we represent animated or interactive content? How should a decorative image, like in a header, be displayed?
I think having a group consensus of best practices would be a great step in the right direction. If anything, it would spread awareness and encourage developers to press