« Return to video

Text Accessibility On Mobile Devices: More Than Meets The Eye [TRANSCRIPT]

SOFIA LEIVA ENAMORADO: Well, thank you, everyone, for joining us for the webinar entitled, “Text Accessibility on Mobile Devices– More than Meets the Eye.” I’m Sofia Leiva from 3Play Media, and I’ll be moderating today. And today, I’m joined by Nick Lum.

Nick is the founder of BeeLine Reader, an innovative technology that makes reading on screen easier, faster, and more enjoyable. Nick’s startups have won international social impact awards and have been featured in The New York Times, NPR, and BBC. Nick has been invited to speak about technology, accessibility, and media at the United Nations Solutions Summit, the World Forum for Democracy, and universities like Stanford, Northwestern, and UCLA.

We’re so excited to have you here today, Nick. And, with that, I’ll hand it off to Nick, who has a wonderful presentation prepared for you all.

NICK LUM: Hi there, everyone. Good afternoon. So this presentation is about text accessibility in a world that’s increasingly mobile. And it’s something that has generated a lot of interest in past conferences where I’ve given this presentation. And hopefully, you’ll enjoy it, as well.

Here’s a quick overview of what it is I’ll be talking about. First, who are the affected groups that I’ll be discussing? Second, why it is that mobile matters, as opposed to desktop accessibility. I’ll go over some of the research that exists, mostly related to desktop accessibility, which has, obviously, been around for much longer than mobile has. And then, lastly, I’ll talk about some new technologies, including some that are going to be launching in the next couple of weeks, which are really exciting and can help to improve mobile accessibility in ways that haven’t previously been possible.

So I’ll start off talking about who the affected groups– who cares about mobile accessibility. And, today, I’ll be talking about a couple of different groups related to vision, low vision, and the binocular vision communities.

I won’t be talking about accessibility for text for the blind for a couple of reasons. One is that would be much too long of a presentation to try to do that and what I’m doing today. Also because, when it comes to mobile, the text-to-speech engines are built into the OSes, into Android and iOS. There’s less that you can do with that as a third party. And so it’s really more relying on the work that the OSes are doing themselves.

So I’ll be talking about how text accessibility affects people with low vision. For those who are not familiar with binocular vision problems, that has to do with how the eyes team together, meaning how they are pointing at a particular point in space. When you look into the distance, your eyes are parallel, essentially, because they’re looking just in the same direction. But when you’re looking at something up close, your eyes actually have to converge, is what the term is, meaning they’re angled inward at a particular point.

And then as you move your eyes across a screen, your eyes are teaming to move from one character or one word to the next. And that’s something that is not measured in a vision test where you just look at an item and say, that’s the letter A. People who have binocular vision problems may not have issues picking out particular letters or shapes. But when they try to move their eyes in the way that you need to move in order to read, they might have difficulty.

This is something that is largely undiagnosed in young children and students. Often, it’s misdiagnosed as dyslexia or something else. Students are regularly screened for vision impairment in schools, but they’re not necessarily tested for binocular vision problems. So it’s something that can go undetected, and it can be problematic there.

Then I’ll also be talking about how ADHD and dyslexia, which are two of the highest-incidence learning differences that affect about 20% of the population, somewhat more among the student population– how these are affected by text accessibility, especially on mobile, because of course, students and young people are on small screens even more than the rest of us.

The ESL or ELL population of English Language Learners is a large chunk of the US population and, of course, the population worldwide. And it’s interesting. Although you might not think that text accessibility is particularly related to language learners, there are actually some interesting bits of research about how visual tracking is somewhat less effective in a new language. And so it can be helpful for these people, as well.

And lastly, I’ll talk about the traumatic brain injury community. To some people, this sounds like a small, esoteric group, but it actually includes all of stroke. So anyone who has a stroke has had a traumatic brain injury. So when you think about stroke and how common that is, as well as bicycle accidents, car accidents, concussions that athletes have, it’s all of that wrapped together.

And TBI, or Traumatic Brain Injury, can cause visual tracking issues not unlike binocular vision problems. And so it can create large difficulties for people who have them when it comes to reading text on screen. So that’s who we’ll be talking about, largely, today. Although, there are some other groups that are, of course, affected in similar ways.

So let me start off this slide by talking– why does mobile matter? Why is it so important? And the first reason is because it’s just everywhere. 10 years ago, not many people had smartphones in their pockets. But now, it is just commonplace, not just in some countries, but really, around the world. This is becoming a mobile-first world.

So it’s important that we get this right. This is no longer 20% of your web traffic or 15% of your web traffic. It’s, quite possibly, 70% of your web traffic. So you need to make sure that people who are using your apps and who are visiting your websites are being able to read the text in a good way.

Of course, another difference between mobile and desktop is your screens are much, much smaller and they’re much more high resolution. So we shouldn’t be thinking about text display and text format on screen in the same way on a screen that is 4 inches or 5 inches as we would on a screen that’s a 27-inch desktop computer. These are very different sizes of devices, and the way we interact with them is different.

And that leads me to this point, which is that when you’re looking at a mobile device, you’re reading in motion. Mobile devices are called mobile devices because we read them and we use them when we’re on the go. And when you’re sitting at a desk in front of a computer, you are stationary and your computer is stationary. So the task of visual tracking and looking at websites or apps is very different from when you’re looking at a device that is moving, perhaps when you’re moving, if you’re walking down the street or something like that. And so there are different needs with regard to text display, formatting, and accessibility.

And then lastly, mobile matters a lot, in terms of how you lay out your website and how you set up your apps, because there are fewer accessibility options when it comes to mobile devices for people who have disabilities or learning differences. They may rely on browser extensions or other OS-level extensions that exist for desktop computers.

But when you get out your phone, there is no such thing as an extension for your phone. There have not been browser extensions that allow people to do the things that they have come to rely on on their computers, on their phones. There is a red asterisk at the end of this line, saying there are fewer options because one of the things I’ll talk about at the very end is some of the new options that are actually bringing this to mobile, which is really exciting.

And there is some good news about how mobile is different and it’s harder. And that is that visual tracking on mobile is more challenging for everyone. So, if you work in an organization that doesn’t necessarily want to prioritize things that are just related to accessibility, one thing you can do is say, look, team, this is something that’s actually going to be helpful for a wide range of our audience. It’s going to improve people’s ability to use our app, or to use our website, or whatever it is that your organization does. So you may be able to get more buy-in because mobile text accessibility is a problem for more people.

And, for example, I think Facebook, in their presentations on accessibility, has said that 30% of their users on mobile use a different text size than the normal text size. And that’s an incredible amount of people to have changed the text size for their device. People typically stick with defaults, as you probably well know. And that’s why it’s important to get defaults right. But there are enough people out there who have difficulty reading on screen on mobile devices that 30% of their users on mobile actually use a larger screen size.

So now I’m going to show a little demonstration of what it is like to read on mobile when I’m talk about mobile devices being mobile. The reason visual tracking is harder on a small mobile device is partly because these devices move around. If you imagine someone riding on a subway– if we ever go back outside and ride on subways– the device is moving in your hand. Your head is moving a little bit as the train accelerates and decelerates. So visual tracking on mobile devices is just intrinsically more difficult than it is on a stationary computer, where you’re sitting in a chair and the computer is just sitting right in front of you.

Now, there is some prior research about two key aspects of how we can make text well-designed, well laid out, accessible. And those relate to line spacing, how far apart the lines are vertically, and then also line length– the optimal line length for a line on the device. And the common wisdom is that your line spacing should be, oh, maybe 1.2 to 1.4x, as a multiple of your text size, and that you should have no more than 70 characters from the left side of one line to the right side. The lower bound is, perhaps, 45 or 48 in terms of how wide your lines should be.

These are important characteristics of how your text is laid out. And, on this slide, it talks about, if your line spacing is too tight, it may be difficult to track visually through the paragraphs. One really interesting point about the transition to mobile and how text appears on mobile is that a paragraph that has, perhaps, three or four lines on a computer screen is very wide.

And when you take that paragraph and you shrink it horizontally so it can fit onto a smartphone screen, it becomes much taller. It might be three times as long. So you might have 10 lines instead of 3 or 4 lines.

Now, you might think, why does that matter? How does that affect text accessibility or the ease with which people can read it? And the answer is that, when you’re reading a paragraph that has only three or four lines, the task of visual tracking is not especially difficult. And that’s because when you’re looking at a paragraph, when you’re looking at lines, you can use the top of the paragraph and the bottom of the paragraph as a visual guide.

As you’re moving your eyes from line one to line two, you’re going from the very top line to just under the very top line. And then when you’re moving from two to three, you’re moving within the only two middle lines. And then you move from three to four, which is from the almost bottom to the very bottom. And so it’s like a handrail when you’re walking down a stairway. You have the top and the bottom of the paragraph there to guide you.

But when you take that same paragraph that’s three or four lines, and now you make it 10 lines, well, you’re much more likely to lose your place when you’re trying to transition between lines four and lines five, lines six and seven, seven and eight, because you don’t have that handrail there, the guardrail of the top and the bottom of the paragraph, to guide you. So you’ve taken a paragraph that is easy to read on a computer, just based on the number of lines that there are, and you’ve squished it horizontally and it has become much taller.

Of course, you’re not moving as far in the horizontal direction when it’s a shorter paragraph horizontally. But the fact that you have to do it so many more times and that you’re doing it without the guardrails at the top and the bottom of the paragraph make this a more difficult step, especially because you may be doing it when you’re walking down the sidewalk, when you’re sitting on a train, and you and your device are both in motion.

So it’s especially important on mobile to think about how your text is laid out and how people are going to be able to visually track through paragraphs, even if they were previously pretty readable because they were short.

Of course, you don’t want your line spacing to be too tall. You don’t want too much space between your lines. And, on this slide, it shows an example of what that looks like. And it’s difficult to read for most people because the lines are just too spaced out. You’re not used to it. And the angle that your eyes typically approach the left side of the screen is off. And so it becomes more difficult and a little bit jarring to try to read text that’s too spaced out.

There’s another issue, which is, if text is too spaced out, you’re not fitting very much text on the screen of the smartphone. And so the user is having to scroll all the time. And that’s not enjoyable, and every time you scroll, you have to make sure you’ve then refound your previous position. So you have to find the happy medium here between not being too tightly packed and not being too spaced out.

The other issue that there’s been research on is, what is the appropriate line length? And so, on this slide, we have an example of text that goes from the very end of one side of the screen to the very end of the other side of the screen. And if you’re looking at this on a desktop computer, that might be a little bit more text than you want to read in a horizontal direction.

And the reason for that is because you’re making a return sweep, which is the technical term for when you move your eyes from the right side of the screen to the left side of the screen. You’re making a long return sweep when it’s this wide on a computer screen.

This is not as much of an issue when you’re looking at text on mobile, because mobile devices are just simply not that wide– except, perhaps, a full-size tablet in landscape mode. But if someone has an issue with that, they can just turn the device into the portrait orientation and fix that problem. And so it’s less of an issue to have lines that are too long on mobile devices, like we’d have on computers.

You can have an issue with lines that are too short, on the other hand. And this slide has an example of two columns of text where there’s really only two or three words on each line. And that creates an issue with regard to how we process text.

So when you’re reading, you’re typically looking at a single word. But your eyes are still processing text that’s ahead of where you are. And so if you’re looking at the word having here on this first line, having followed by short, when you look at having, your brain is already starting to process the word short. You’re not making out exactly what the characters are or what the word is, but you’re making out the shape of it. So that when you move your eyes to that word, you’re already starting to have preprocessed what the word is. And it makes you more efficient at reading.

The problem of having very short lines is that your buffer of preprocessing is not full much of the time, because you’re at the end of a line, and you’re, therefore, not preprocessing the text that comes next. And so you want to not have a line that’s too short, because you’ll make it inefficient for people who are reading and trying to maintain a fluid flow, because it will make it so that they’re not able to read as efficiently.

Now, I will say there is some research that shows that some people with dyslexia prefer reading with very short lines and are better at it. So that’s one thing to keep in mind is that, for some people, this may actually be good. And that’s because of the way their brains process text.

But, for many people, it will not be a useful thing for them and they’ll find it to be annoying. And I’m actually thinking of one app made by a big tech company that’s a news aggregator. And their mobile app has huge margins on both sides, and the lines have very few words on them as a result. And after they did the update that made it that way, I actually stopped using the app because I found it so unenjoyable to read on. So it can make a real difference on people wanting to use your app or your website.

Fortunately, there are some new technologies that can help improve text accessibility on mobile. And I’ll go through some of them here. And if anyone else has any other ideas that I’m not covering, I’d love to talk about those, as well.

So the first is the OS-level settings for text that are now available. The second is notions of word highlighting, rapid serial visual presentation– which I’ll go into all of these in the following slides– color-assisted visual tracking, as well as mobile browsers that have extensions.

So let me start off with OS-level settings for text. So there are two OS-level level, or Operating System-level, settings for text that are available now. And they’ve been around for a couple of years, but are now getting more use. And the first is dynamic type. And what this means is the user of an iPhone, for example, can set what their preferred text size is. They can tell the device, at the OS level, this is how big I want my text. And then any app that listens for that setting can then display text in the appropriate size automatically.

And this is a really cool option because before this, say you were a good citizen, and you had an app or a website that allowed people to change the text size. Well, that’s great. You’re letting your users customize their experience. What’s not so great is, if a user has a hundred apps on their phone, they now need to customize their experience a hundred times. So that need to do that multiple times has gone away because we now have dynamic type. And you can just listen for the user’s setting and change the text size in your app automatically.

What’s really cool is you can also do this on websites. This has previously not been possible. But now you can have a website that listens for the size of text that the user wants and displays text in that size. And if you want to see how this works, you can take a look at the NPR website, which does this, which is really cool.

The second is dark mode. Most people are familiar with dark modes. And it’s a mode that people use at night, often, where they have a dark background and light-colored text and light-colored other options. And dark mode is very popular within the accessibility community, especially among people with certain types of disabilities related to scotopic sensitivity, light sensitivity.

And people who have dyslexia will also often say, I really don’t like the white rivers that run through text between the words. And this will often happen when you have text that’s justified and you have large gaps between words. And having large white regions is distracting for people. And having them be dark black regions is better.

And so dark mode is something that’s now available. You don’t have to hardcode it yourself in your app and sort of build it from the bottom up. You can just say you want to enable this setting.

And if you want to see how this works, again, on a website, you can do this, where you listen for the OS setting. And the Ars Technica website shows how this happens. They have a toggle where you can change the dark or light mode that’s active on the site. But if you load the site when you’re in dark mode, it will automatically turn that on for you, which is very helpful so that people don’t have to do it manually every time.

Now, there are some techniques related to how text is displayed, and I have here some sample text on the screen so you can see how each of them works. The first is word highlighting. And this is sort of like karaoke, in that you have something that moves along and highlights chunks of words at a time. And I’ll do a little demonstration here with a yellow block that’s moving through the text and helping to guide the person’s eyes.

So this can be a useful thing for people. Someone who has ADHD and has difficulty staying focused can be pulled through the text more effectively by the yellow highlighting. People with dyslexia also use tools like this, and people who have difficulties with visual tracking find this helpful.

One thing you have to be aware of is that you can’t have too large of a yellow block. And the reason for this is it relates to how the eye processes text and how you’re able to make things out in the center of your vision, but not really outside the center that much.

So, on this screen, we have a display of the fovea, which is like the center or the bullseye of a target; the parafovea outside of that in a concentric circle; and the periphery. We’re all familiar with the term peripheral vision, which is outside of that. And in your fovea is where you process the text. That’s where text processing happens. And it means you’re looking directly at something, and you can read it.

In your parafovea, research shows you can get about 20% of the content there. And in your periphery, it’s only about 3%. So that means if you offer a feature like this, you wouldn’t want to have too large of a block, because that would encourage people to move through the text too quickly and to think that they’re getting it, even though they’re actually not getting it quite as much as they might think, because it’s not really hitting their foveal vision, which is where text processing happens.

The next concept is something people call word flashing or RSVP, which is Rapid Serial Visual Presentation. And this involves just flashing one word at a time at a fairly fast rate of speed and allowing you to just look in one place. So this sort of fixes that foveal problem, where you can just look in one place and all of the text will just appear right there.

This was a concept that first came about quite a while ago. I think it was the ’70s this was first developed. But it made a comeback in the early 2010s because on mobile devices, it’s actually kind of handy to be able to have one big word on a screen at a time. So here’s what that looks like. It’ll flash words in the middle of the screen for a few seconds here.

So it’s one word at a time, and it just displays each word in exactly the same place on the screen. And there are a couple of different implementations of how this is done. There’s a company called Spritz that repopularized it and came up with a little bit of secret sauce around how they display words. And then Amazon has implemented a version of this– I think they call it Word Runner– that’s available on their Kindle devices.

And the neat thing about this is it takes advantage of how a mobile screen is laid out, the fact that you can fit one word very easily on a mobile screen. You can make it big, and then you can run through these words more quickly. And it avoids the need to track your eyes visually through a paragraph, which is the source of a lot of problems for people who have disabilities related to reading.

Of course, you might not want to speed up the text too much if you have a visual-related disability, because if you do, then your lack of acuity might make your comprehension go down. And you do have to make sure you take breaks to let your eyes blink. You don’t want to be in a state where you’re just eyes glued to the screen, not wanting to blink, because you don’t want to miss what the next word is.

The next tool is one that I created. This is the tool that my company uses, and it uses the color of text to assist with visual tracking. And you can see on the screen an example of how this works. Each line begins with one color, and then as it traverses the line, a color slowly fades to a second color.

And then, critically, when you move your eyes from the right side of the screen to the left side of the screen to find the new line, there’s only one line that has text of the same color that you were just reading. And, as a result, your eyes are drawn toward the appropriate line and it makes it easier to track visually through the text. I’m happy to talk more about this in the Q&A. I don’t want to spend more time on it now, because it’s a pretty simple concept.

The thing I am actually most excited to share with you today is some good news around mobile browsers and extensions. This is something that hasn’t existed for the 10-plus years that smartphones have been around. Safari has had very limited extension support. They have what’s called Share Extensions and Action Extensions.

And it’s good that there has been some support for this, but you can’t activate them automatically on pages. You have to manually tap two to three times just to activate it every time you load a page. So, not surprisingly, these are not heavily used by people. And so it’s great that there are now options that are coming onto the market that allow people to use browser extensions in their mobile web browsers.

The first one that I’ll discusses is the Kiwi Browser, which is available on Android. And the Kiwi Browser lets you go to the Chrome Extension Store and just download any extension that’s available for Chrome computer browsers. That’s amazing, because there are so many of them and so many of them related to accessibility.

One downside is that the user interface for most web browser extensions is not optimized for mobile. And so it may be difficult or, in fact, impossible to effectively use an extension or configure an extension in the way it was intended to be able to be used or configured when you’re using it on mobile.

Certainly, we hope that, as the Kiwi Browser becomes more popular and as developers of extensions become aware that they may have users on 5-inch screens instead of 25-inch screens, that they will redesign how their settings are laid out and configured so that people who are on small screens can effectively use these tools. But this is a really cool opportunity.

I believe the Kiwi Browser is also available on iOS. However, the ability to add extensions is not, because Apple doesn’t allow people to direct people outside of the iOS ecosystem to purchase things, and many Chrome extensions are paid. So that’s not something, I think, that is available there. But hopefully, in the future, it will be available on iOS, as well.

The other browser I want to discuss it is for iOS, and it’s called the Insight Browser. And this will be launching in about two weeks. It’s currently in beta, and I can show you what it looks like here. So on the left side, you can see a list of extensions. And these are extensions that are actually built by the company Insight themselves. And, right now, everything is free because they’re in beta. And when they launch, I believe everything will still be free for some time.

And so you can just choose extensions. They have one that’s for inverting colors in dark mode. They have an extension that I’ve been working with them on that enables our BeeLine technology. And you can mix and match these things, so that you can use multiple extensions at once and have them overlay on each other. And, on the right-hand side, you can see a dark mode married together with the BeeLine coloring. And this is a really cool way for people to be able to customize their experience and make text much more readable in a way that is specific to them.

And their system is open to both extensions that you get through them, but you can also make your own extension in their own language. You can inject JavaScript into pages. You can set it so that the JavaScript is only injected into pages on certain domains. So you could say, well, I don’t like how this website does something. I want to always inject this JavaScript so that it makes it more readable for me.

And they include their own reader mode, like many web browsers do. But unlike many web browsers, they automatically load it when you load a page that has a lot of text, and then you can switch over to it or have it automatically come up when you land on sites on a certain domain. So this is a really exciting browser that’s going to be coming out soon. I think you can go to their website and get into the beta test still. In about two weeks, it’ll launch for real.

But this is, I think, going to be game-changing for people in the accessibility community, because it will allow you to access extensions that other people have made. But also, you can make ones yourself and target them to load on certain websites and configure your web browsing experience in a way that will make it more accessible or usable for you.

And then, on to the future. The Insight Browser is the near future, and it’ll be launching in a couple of weeks. But there’s bigger things coming, and it’s interesting to think about them.

One thing that might happen on mobile is you might have camera-linked text enhancement. What do I mean by that? Well, every time you look at your phone, there’s a camera staring you in the eyeballs. And you can use the data from the camera to make text that you’re looking at larger or, in other ways, enhance it.

I have a little bit of caution around technologies like these, because it seems like a great way to track people from an advertising perspective. Did the person look at the ad? How long did they look at the ad? What should we advertise next? It seems a little bit creepy, but it could also be very useful for people who have difficulty reading on screen. And if you had the right privacy protections in place, it could be a really cool opportunity.

Another thing that’s coming, probably at some point, is we’ll have folding and collapsible screens on our mobile devices. And this will do away with some of the downsides of the super small screens. But undoubtedly, it’ll create some new issues as we move to screens that are, perhaps, not fully opaque and have a little bit of transparency. And who knows what that would mean for accessibility. But it’s an interesting thing to think about as we move in that direction.

And then lastly, what would a presentation be on new technologies if it didn’t talk about VR and AR? No. It’s not really clear that people will want to spend time with big goggles on reading text. So that’s probably not a use case that’s coming in the near future. But as displays get sleeker and people make things that are a little bit more lightweight, like regular glasses, people might end up reading there. And we’ll be able to learn about how that experience works for people, both with disabilities and without disabilities, and how we can make it a more efficient way to consume text, in general.

So these are some of the ideas about what might be coming in the future. And that ends the formal part of the presentation. I’m happy to entertain questions and comments. And I know we’ve had several coming in along the way.

SOFIA LEIVA ENAMORADO: Thank you so much, Nick. Yeah, we had a couple of questions come in. The first one, and what a couple of people had asked, is, what’s your guidance around centering text?

NICK LUM: Yeah. So when it comes to centering text, if you have large blocks of text, that’s not going to be great from a visual tracking perspective. Justified is probably the worst. You want that ragged right edge, because it helps people in the same way that the top and bottom of a paragraph can help people the topography visually and to get to the right line. I would say centering is probably not ideal.

Obviously, it doesn’t matter as much for two or three words. Here, I have Questions & Comments centered on the page, and it doesn’t matter so much for that. But if you have large blocks of text, you want people to be able to move to the same– you can think x location on the screen. And if you have something that’s centered, then sometimes, they’re moving farther than that. Sometimes, they’re moving less far. So it’s probably not ideal.

SOFIA LEIVA ENAMORADO: Thank you. The next question we have is, does text highlighting have a timer mode to change the speed of the colored block’s movement?

NICK LUM: Yeah. So this is one of the really important things, especially for the synchronous technologies. And by synchronous, I mean the timed ones, like the text highlighting and the word flashing. It’s really important that you give people the ability to slow down or speed up the rate at which the reading is happening. And there are a couple of reasons for that.

One is, some people are simply faster readers than others. Another is, some text is more dense than other text. And so if you’re reading Shakespeare, for example, you wouldn’t want to read that at the same rate that you would read an article on CNN, because the reading level is just much higher. And so it’s really important to offer that.

And I think some of these technologies also allow a way for you to modulate the speed a little bit based on the complexity of the word, or simply the length of the word. For example, I think Spritz gives you a little bit longer when you’re on words that are more complicated, because they recognize the word “the” doesn’t need to be the focus as long as the word “complimentary,” for example.

Both because it’s a little bit longer and because it’s a word that is ambiguous between complimentary with an I and complementary with an E. And you have to think a little bit harder about what it means. So it is important to offer people different options, in terms of the speed, and in general.

I talked about line spacing and the length of the lines. If you can, if you can get your organization on board with allowing people to configure those options themselves, that really is the best, especially because with dynamic type, you don’t know what it looks like on the user side when they have their dynamic text setting set to their preference. And so if you have really big margins, that might look lousy with large text. Or if you have really small margins, that might not be great with small text. So it’s best to let people configure these things on their own, if you can get that done on your organizational side.

SOFIA LEIVA ENAMORADO: Thank you so much. The next question we have is, do these text requirements depend on whether you’re looking at portrait or landscape on your mobile?

NICK LUM: Yeah, so that’s another thing. There are some people who are big fans of one versus the other. I think people who use larger text are more likely to use landscape, because you can’t fit as much text in portrait mode. And when you’re in landscape mode, you probably do want to think more about line width than you would when you’re in portrait.

When you’re in portrait, there’s pretty much no way to have a line that’s too long. But it’s conceivable that on a large smartphone, or certainly on a tablet, in landscape mode, that you could have a line that’s too long. So you would want to think about how many characters you have. Try to keep it under 70. And the math gets a little bit complicated, because again, if you have dynamic text sizing that’s based on some sort of OS-level setting, you’ll need to calculate and see how many characters you have on a line and try to keep that under 70.

SOFIA LEIVA ENAMORADO: Thank you so much. The next question we have is, can you get BeeLine extension on Android devices?

NICK LUM: Not yet, but Insight will be coming there after they launch on iOS. So it will be available there in the near future. And, currently, we do have a partner that makes an ePub reader on Android that’s called ReadMe! with an exclamation point. And they offer both the Spritz functionality, as well as the BeeLine functionality, in their app for non-DRM ePub files.

SOFIA LEIVA ENAMORADO: Thank you so much. The next question we have is, do you know of any computer or mobile screens that are good for people with light sensitivity?

NICK LUM: That’s a good question. So some people don’t like the backlit nature of computer screens. For some people, that is problematic. Dark mode or night mode can help with that, for sure. It’s probably even a little better on OLED screens, which are the newer types of screens that can go to a darker black.

And so, for example. I believe the top-of-the-line iPhones and even some of the non top-of the-line iPhones I think now use OLED screens, as well as your top-of-the-line Android devices. So those may be better.

One really exciting development is that E Ink or e-paper, which has been black-and-white or grayscale for the last 15 years or so, since the Kindle popularized them, they’re actually now getting color. And this is something that’s been only announced in the last two weeks. They announced a new type of color display that’s targeted at the e-reader market or the smallish screen market.

And what’s really exciting about this is that it allows for a much faster refresh than previously possible in color. So they have had color for a couple of years, but the refresh has been like 11 seconds or something like that, meaning you turn the page on your device, and it takes 11 seconds and multiple scans through until the new content is there.

So I believe the new e-paper devices will start coming out probably in 2022 at some point. And those are not backlit. You have reflective lighting, either coming from the device itself or just ambient lighting. And I can geek out a little bit more if someone wants to know about how the technology works and why it’s better than the old versions of color E Ink.

But I think it’s going to be really cool when people are able to have high refresh rates on non-monochrome, non-grayscale devices, devices that have full color. And I know in the coding community, people are excited about this because they stare at a screen for so many hours a day. And they’d love to have an E Ink display that has some color in it and pretty good color reproduction, but more importantly, has that refresh rate. So be on the lookout for that, maybe late 2021 and 2022.

SOFIA LEIVA ENAMORADO: Awesome, thank you. The next question we have is, what are the best practices around fonts on mobile, like serif versus sans serif?

NICK LUM: So this is an interesting question, and it’s something that has changed a bit over time. The wisdom from the olden days was that serif is good for print. Sans serif is good for screens.

The reason for that was that print is much higher resolution than screens. Screens, if you think back to the ’90s or the early 2000s, were not very high resolution. And so when you’re trying to do those little, tiny serifs on the edges of characters, it didn’t look so good and could actually make things a little bit less readable.

Then screens became higher resolution. And now we have mobile screens that are very, very high resolution. You’ll have a 1080 or 4K resolution on a screen that’s 5 inches across, which is incredible. So you can now accurately display serif fonts very nicely on, especially, mobile devices.

Some people believe that sans serif is better for people with dyslexia, for example. That’s a popular thought. I talk to a lot of people with dyslexia, and it’s definitely not always the case. So I’d recommend, if you can offer one of each– one serif, one sans serif– that’d be great. There are definitely some people who prefer serif and find that it’s easier to recognize characters because the little flourishes of the serif make each character a little bit more different.

So, if you can offer both, that’s great. If you’re only going to offer one, maybe go sans serif. But be prepared. There’s still going to be some people who yell at you, no matter which way you go on that.

SOFIA LEIVA ENAMORADO: Thank you. The next question we have is, I see many websites now using gray text instead of black. Is that harder because it’s less contrast?

NICK LUM: Yeah. It’s getting better now. There was a period where it was super popular to do dark gray text on a light gray background. Oh, by the way, make the text as thin as possible. And so obviously, that was terrible for accessibility. And I would say in the last two years, we’ve moved away from that a bit.

Some people shy away from having full black backgrounds or full black text. They think it’s just too harsh. I don’t shy away from that. The background of my slide here is plain black. I use black text. And I find that it’s not problematic.

When you’re doing gray, you have to check and make sure that you’re meeting your contrast guidelines for WCAG. And you also need to factor in how thick is your text. So if you’re using a heavy font, then you can get away with a little bit less of a contrast ratio than if you’re using a really lightweight font.

And I’m thinking of like San Francisco, which Apple originally released for the Apple Watch and which was very thin, because obviously, they wanted to jam as much information onto a tiny screen as possible. And I believe a year or two after they released it, they actually redesigned it to make it a little bit heavier, because at least the perception in the community was it was a little bit hard to read because it’s so thin. So it’s really a combination of what’s your color, what’s your contrast, and how heavy is the font.

SOFIA LEIVA ENAMORADO: Thank you. The next question we have is, do text requirements change when you have attached documents in document formats such as PDF?

NICK LUM: So PDF is tough on mobile because it is a fixed format. It’s supposed to be a universal appearance across many platforms. If I print out a PDF, it’s going to look the same as if I look at it on my computer or if I look at it on my phone.

That’s great from the perspective of universal appearance and having things show up the same way, but it’s terrible for accessibility. And if you’ve ever tried looking at a PDF on your smartphone, you know that it’s not a great experience, especially if it’s a multi-column PDF. Then you do the little dance where you zoom in, you scroll down, and then you scroll back up and over to the next column. And it’s just really not great.

The good news is Adobe has recently released a technology that’s called LiquidText, I believe. And it’s a front-end technology that allows them to look through the documents and pull text out in a way that is reflowable and, therefore, allows the user to change the text size. So this has only been out for maybe four or five months.

I’ve actually not used it. I don’t have it on my computer. But I think it’s a really exciting possibility, and I hope the accessibility team at Adobe makes it available to third-party PDF viewers, as well, because that is one of the downfalls of PDFs on mobile, is it’s just really hard to actually read them on smartphones.

SOFIA LEIVA ENAMORADO: Thanks. The next question we have is, did I understand correctly that npr.org, the website, picks up dynamic text OS settings? I just tried it on iOS 14.4 and Android, as well, and I didn’t experience NPR responding to large dynamic text size.

NICK LUM: I should have checked it last night. This is what happens when you don’t check everything before giving a presentation. This was true in the past. I will check it after the presentation today and email the fellow I know there who made this possible. But there is a way to do it. And if you Google how to detect dynamic text– or dynamic type, I think it’s called– using JavaScript, you’ll be able to find the little snippet of code that’s required to make this happen.

SOFIA LEIVA ENAMORADO: Thank you. Someone else is asking, have you seen the interesting research going on at the Virtual Readability Lab?

NICK LUM: I have not. I’m curious to know more about that.

SOFIA LEIVA ENAMORADO: Yeah. If you want to add a little bit more, Glenda who asked. And then the next question we have is, what are your feelings about programs, like Articulate, for presentations that supposedly switch from desktop to mobile screens?

NICK LUM: I’m not familiar with Articulate. But I think the last year has shown us a lot about what life is like when everyone is in Zoom or in other presentations. And it’s not a responsive to the question, because I’m not familiar with that platform, but I will say we’ve seen there’s been a silver lining for people with disabilities.

There’s been one silver lining, which is that so many people are having screen fatigue now that companies and universities are adopting technologies that are really helpful for people with disabilities that they’ve wanted for a long time, but that now there are enough people crying out for them because we’re all spending our days on screens.

SOFIA LEIVA ENAMORADO: Great. Well, these are all the questions we had here today. Nick, if you want to let us know how we can find BeeLine Reader and how to add it to our browsers?

NICK LUM: Sure, yeah. So, first off, feel free to send me an email or find me on Twitter, nick@BeeLineReader.com and @nicklum. BeeLine Reader is BeeLineReader.com and @BeeLineReader on Twitter. We have a browser extension that has a two-week, fully-featured free trial so people can use it, try it out, see how it works. And it’s powered by the same JavaScript library that powers our integrations with companies like Blackboard and others who’ve integrated the technology into their sites.

So if you have any questions about that, happy to chat. And I’d love to learn more about the platforms that people mentioned that I wasn’t familiar with, because I’m sure I’ll give this presentation again and I can make it even better next time.

SOFIA LEIVA ENAMORADO: Great, thank you so much. Yeah, we’ve had a couple of people comment that they love the BeeLine Reader extension. Well, thank you–

NICK LUM: Awesome. Yeah, thank you so much for having me on the presentation. And, yeah, I did get emails from a couple of folks who picked it up in advance of the presentation. And I’m really happy to see that we’re reaching people in the community in this way. So thank you to the organization for hosting this.