Designing for Readability
Self-led project.
The goals I have set for myself:
- Identify core factors that inhibit or are detrimental to long-form reading.
- Understand specific methods for designing digital content for readability.
- Create an intervention that adjusts an existing system to increase readability on a digital platform. ++ If you can work on both desktop and mobile.
First, some notes from the the readings I did to get into this in the first place:
“You Won’t Finish This Article” Slate Magazine
- “I was beginning to worry about your attention span, even your intellig … wait a second, where are you guys going? You’re tweeting a link to this article already? You haven’t even read it yet!”
- Just learned the term “bounce” which means you spent no time engaging with the content.
- “According to the data, for every 100 readers who didn’t bounce up at the top, there are about 50 who’ve stuck around.”
- I know that engagement analytics are a huge field of business and research, but this chart gives me a pretty brief intro into the percentage of users who read Slate article plages:
- important point: although they did determine that over 50% of users scroll below the “fold”, this is in part due to the page design of the website: It’s designed specifically so that you have to scroll in order to read anything with content.
- “We live in the age of skimming.”
“Why the modern world is bad for your brain”
- “At the kitchen counter, cosy and secure in our domicile, we write our shopping lists on smartphones while we are listening to that wonderfully informative podcast on urban beekeeping.” I love this. I feel like I saw myself in this text.
- New technology has allowed us to do more things ourselves, but it makes us constantly distracted
- Earl Miller, MIT neuroscientist: our brains are “not wired to multitask well… When people think they’re multitasking, they’re actually just switching from one task to another very rapidly. And every time they do, there’s a cognitive cost in doing so.””
- Something important: the prefrontal cortex has a novelty bias, which means that it’s attention is “easily hijacked by something else”, and as a result, we get a bunch of little mini dopamine hits everytime we do a small thing off task, at the expense of focusing on one thing for a sustained amount of time.
- The brain apparently is super good at deluding you into thinking you are multitasking efficiently, when in reality you are just jumping back and forth and sacrificing cognitive ability to both tasks.
- Holy shit, apparently people will play video games for 50 hours straight until they die of cardiac arrest. Like rats. In a rat experiment.
- Basically: the world is addictive and terrible for our brains. And there isn’t much we can do to turn it off.
- Also interesting how they compared the immediacy of email to the effort it took to send actual mail, but then jumped down to compare the effort it takes to send a full on email compared to a text message. All of these feel like different layers of effort. I would even think that snapchat is like a shorter version of texting in some ways, if you consider these all a form of image-sharing.
“Distracted Reading in the Digital Age” Vassar
- Annotation Studio — created by lead programmer and Vassar alumnus Jamie Folsom ’92 — allows students to make digital annotations to words, phrases, or sentences within a given text and to comment on some aspect they find of interest
- This article is very focused on the progress Vassar is specifically making towards combating distracted reading: they bring up points about students lacking a reading habit when coming into college, and not having tools that push them to focus hard on texts.
- Something to take away: building a reading culture. Designated a space in the library etc. specifically for reading only might foster this culture of slowing down and concentrating only on reading. Personally, I didn’t completely understand the effectiveness of this, since students often always have some sort of reading to do and siphoning off one area sto do it is kind of ineffectual if reading is combined with other schoolwork. I’m not sure.
- “Which brings us back to patience. It’s clear to see that even if we accept the role that technology is playing in all of our lives, that cultivating the kind of patience necessary for “close reading” will enhance a variety of areas of study — from art history to chemistry.”
Initial thoughts from this reading: Basically, the internet is terrible for our brains, and we can’t pay attention to anything anymore. We live in a world that is filled with notifications and alerts that are specifically designed to trigger our prefrontal cortex, especially the novelty bias that makes us feel good when we switch around to multiple things at once. Having the autonomy to do-it-yourself makes us literally do more things ourselves, and this in turn makes us wound up little screen junkies who get our hits from switching between types of content quickly. If we want to continue to publish content online and through screens that’s intended to be digested and read without distractions, we need to implement techniques that support metacognitive reading behaviors and prohibit the tendency for distraction and multitasking.
Now, some perspectives from designing for longer reading:
- slate article mentioned designing so that readers don’t “bounce” but have to scroll and engage with an article long enough to read past the fold.
- From here: visual progress anchors give users an idea about what they are getting into and their progress throughout the article (think scroll bars). Anticipating a user’s needs, specifically whether they have enough time to dive into an article, is crucial to successful UX design for long form reading.
- There’s a chrome extension already, called Ochs, that works with NYT articles to remove all the extra things, like reading assistants and other noise (not sure exactly what they determine is noise) so that it’s much easier to dive into. Also mention looking into navigation usage patterns, which can show when areas are too cluttered for people to use the navigation, etc.
- Important: do lots of A/B testing with your type decisions. It’s not just if it looks good, but is it comfortable to read.
- “Respectful Advertising” making ads customized to the user, uniform position and size, not obnoxious or covering content.
- “Give your readers a reason to enjoy your website as it is, instead of a reason to reformat the content and turn the page as fast as possible.”
This seems to touch on the concept of ad blockers as well. But I’m curious, when people use an ad blocker, are they doing it because they believe ads are distracting them from reading online? Or do they just dislike adversititments in general? Or is there another dominant reason why people use blockers?
I found some answers. From a poll conducted by HubSpot:
It seems like page load time is a big factor as well. Which is something to think about when comparing reading experiences digitally to physical: you don’t have to wait for a physical book page to load. You just physically turn the page.
Also, from “Think with Google”:
Saying ads are “annoying” isn’t the full answer I’m looking for though. Annoying to what? Inhibiting what behavior? From my research above, it seems like we struggle enough to focus on a task already, I’m not sure if advertising is preventing much long-form reading, since its unlikely a lot of it is occurring already.
Privacy is also another factor. The Google article mentioned a large amount of people are concerned about their information being used for targeted ads.
Specific Tips for Long form reading design
When I first started looking for techniques for long form reading design online, I was surprised at how basic and relatively unhelpful these “listicles” were. However, I pulled insights that stood out:
- Intuitive scrolling: “Scroll experience on a long-form content should be seamless and users shouldn’t have to think about it.”
- Tell an exciting story: as opposed to creating an infinite scroll. Those are annoying.
It seemed like a lot of the stories pitched by Pitchfork showed up as popular examples of good long form design. They remind me of a lot of the interactive NYT articles that I cherish deeply.
This Daft Punk article was especially exciting. I think one effective tactic to take from here (besides using flame animations that are attached to parallax scrolling) is the alternating margins for type and image. It’s quite relaxing, and kept me engaged all the way down the article.
Looking through more of the interactive cover stories that Pitchfork publishes, I realize that they have a pretty basic initial format for this content: alternating single column type, often justified, and then they add interesting graphic elements often activated by the scroll. It’s clean, interactive, and highlights the artist. I’m impressed.
Exploration of “the fold”
“The fold”, as I’m growing to understand it, it the point where the content is hidden until the use scrolls. If you can engage the user and convince them to consume content beneath the fold, you’re doing a good job.
Bon appetit nails it, I think. But they have the privilege of excellent food photography to add interest:
Another example of successful utilization of the fold: Man Repeller. I think this site employs tasteful maximalist design decisions to create a reading experience that is entertaining without being distracting. I find myself finding the bottom of long articles here than on similar fashion sites. Here, they employ the fold technique:
The New Yorker also does this with their homepage, to an extent: The main article is not completely visible until you scroll. However, I think the goal here to get users to engage with initial links to click on the full article, so introducing the full headlines more manageable is a smarter move:
Because then, as you continue, opening an article warrants scrolling to get anywhere oast the hero image:
Overall, implementing the fold tactic seems like an engagement/marketing strategy over anything else, but it’s an interesting device to explore.
Considering decisions for long form content design
Ok, first a clarification of what makes something “long form”:
Some pros of longform content:
- It’s seen as more authoritative. People trust it more, on average
- It’s evergreen. It continues to be shared and engaged with long after its publication.
- Specifically from a marketing perspective, it gets more shares. Yay for increased traffic.
- Content with powerful infographics, and list posts (not sure how I feel about these, but fine) get most shared over social media networks.
