Talk by Darice de Cuba
Digital accessibility is more than just coding your website according to WCAG, passing tool tests and being usable with screen readers. It’s about inclusive design, which starts on day one of your project. In my talk I show based on personal stories and real life examples how accessibility is part of inclusive design. That it takes more than just valid and accessible code to make your website or product usable for everyone. How diversity helps you avoid pitfalls when designing websites and services.
Watch Darice’s Presentation
Transcript
Allie Nimmons: All righty, welcome back everyone. Uh if you’re just joining us welcome to WordPress Accessibility Day my name is Allie Nimmons and I’m your host for this session. We are about to get started with “Unmeasurable Accessibility, The Case for Inclusive Design”, with Darice de Cuba.
Please make sure to add your questions to the YouTube chat feed and we will answer those together at the end of the presentation. Just a little bit about Darice before we begin.
Darice is a Web Developer and Blog Writer for the Independent News Magazine and Website of Rotterdam University of Applied Sciences, where she enjoys uh writing a blog, brainstorming with the team about the editorial, working on new designs, optimizing pages and maintaining and improving the WordPress website. Being late deaf which gives her a unique insight into inclusive design, she likes to write down her musics on her, musings on her website. She loves to explore the food scene in her hometown The Hague and in the Netherlands.
She is keeping track of cool places she finds in her food guide. Today she’s going to be explaining Unmeasurable Accessibility, The Case for Inclusive Design. So I’ll go ahead and pass things over to Darice.
Darice: Okay, hi everyone um it’s exciting to be speaking to a worldwide audience today and I ask you to bear with me, because I have a several screen including my own transcriber.
So thanks to Allie for the introduction.
So you know my name is Darice and I recap very short, I’m a web developer so I have experience with HTML, CSS, PHP, CSS and of course WordPress. And the rest you’ve already been told by Allie. And today I talk to you about Inclusive Design and user usability and my own experience.
So what most people understand on the accessibility is stuff like ARIA for screen readers, keyboard tabbable, colours with a minimum contrast ratio of 4.5 to 1 and CSS at media preference reduce motion reduce, that is to reduce the motion for people who get sick from it.
And the most important thing about all these things, are all testable, the tools are manual. So you can have a totally accessible website by those standards, but yeah your website may be very unaccessible to many people. There are several types of disability. You have visible and non-visible disabilities.
Non-visible disabilities: it’s a deaf or hard of hearing person, a person with autism, a person with brain damage, chronic illness and depression. And also under the number chronic illness, there are several kind of disabilities. You just pick a few, someone with, say, MS that make their hands shake which uh on the other hand makes it very difficult to use a smartphone or keyboard. So you know non-visible disability the person may look healthy to you, but they may have bad, many disabilities.
In our lifetime most of us will have to deal with either long-term or short-term illness, broken bones, high stress for long periods of times, all kinds of illness or injuries that can make you temporarily disabled or disabled for the rest of your life. So most people aren’t born disabled, but become disabled later than life. I became disabled later in life. When I was 25 years old I had a brain hemorrhage.
And when I had that brain hemorrhage it disabled my left arm so I had to re-learn how to use my left arm.
And for the first time at the very young age of 25 years, I experienced how hard it is to use a keyboard when you’re just recovering from brain hemorrhage. A year later when I was 26 years old, I used to be hard of hearing, but then I lost the rest of my hearing.
So one day I was still hard of hearing and the next day I woke up completely deaf.
So I had to like drastically adjust my life in one day. So I don’t consider myself disabled, rather I am made disabling by the obstacles created by society. A society built only for the seeing, hearing, talking, walking, healthy straight, cis male, white people.
Every time I leave my home this is what my life looks like outside when I’m deaf. I’m constantly avoiding things and adjusting.
So now a quick few facts about deafness and that many people are not aware of. There are two kinds of deafness. You have deaf with capital D which means a person who is culturally identifies as a deaf person. That those persons are born deaf or became deaf as very early in their life as kids and their primary language is sign language.
Then you have people with lower d deaf, that’s people like me amongst other and we became deaf later in life. And like I was hard of hearing since I was a kid, but I had a hearing life and later on I became deaf. And you have people who have been, have perfect hearing in your whole lifetime, but maybe they had an accident or they took some medication and it is known that some heavy medication may destroy your hearing and from one day to the next people went from perfect hearing to deafness. And of course this spoken language is primary language.
So they will depend more on caption and transcribe instead of sign language. Inclusive design is a design approach that takes as many individuals, their background, their needs, experience and ability into account from day one of the project. Accessibility is a part of inclusive design. We want as many people as possible to be able to use our products.
Smart examples that have big impact.
So this is a screenshot of delivery.com. Um I’m from the Netherlands so we have one of those ordering, food ordering is deliverable. And I have never used delivery. And I don’t know how well you can see the screen, but basically I’m just going to have already taken my dinner and now I have to pay. And on the screen there’s nowhere, there is an option, a text field, where I can fit in that I’m deaf. And imagine something is wrong with my order or the restaurant needs to contact me.
There’s no way that I can let them know that I’m deaf, so they can please send me an email or a text message instead of calling. And sames goes for the delivery person, there is no way I can put that they should text me. Imagine they ring the doorbell or something is wrong they are going to call me, because I can’t let them know I’m deaf.
So this place lost my business and my money, because it’s not accessible to me. And I like other foods, so every time something goes wrong this is the feeling I have. No food for me.
So one of the good things to use for such website are chat widgets. And little by little some place start using chat widgets, but they are not using them optimally to make them accessible to everyone. A lot of them have a bot behind tools ah I as a deaf person have no use for a bot. So if you’re going to implement a chat widget to communicate with the client, you should think about the real people behind it, reasonable waiting time and the widget should work with all web browsers.
In the Netherlands we have like a social government social service and they have a chat which is specially for deaf people, because they know we cannot call, but the first problem is that you have to click like three or four times on the website to finally arrive on that chat widget. And the chat widget will work with Chrome or maybe it will work with Firefox and every time they develop or they make upgrades it’s like a surprise with which browser is going to work.
Just make sure it works in all modern browsers.
Another thing that makes your website very unaccessible that you may not be aware of is, is using a no-reply email. So you have your WordPress website and you followed all advice to make it accessible: screen readers, the colours are working well, your links work well, but then when you enter active clients you will send them mail with a no-reply and there will be no contact info and the only thing you’ll be providing is a phone number. And this has happened to me several times and then I need to contact that company, I have no way to do it.
So if you’re gonna use a no-reply email make sure you do have options in that email for people who cannot call to contact you. Let it be an email address that you are reachable at, a chat widget or just a contact form. Another thing is when people write web blogs, I mean a lot of us start WordPress as a web blog and then we expand it with woo-commerce and everything, but people write so difficult.
I as a developer, many times I’m looking for things, how to do things in PHP, how to do things in Python how to do things in CSS and stumble across a web blog and it’s written so difficult. And it’s not only web blogs, the same government website also has to contact many people of all social economic status in the country.
And I don’t know if you know, but if you make a mistake in your social things and you may get a fine, but when you get a letter from them or an email from them, it’s written so difficult. I’m a college university graduate and even I have difficulties reading what are they telling me because it’s difficult.
Imagine a person with no education who works a low-paid job and they get a letter like that. So no one ever said when reading a web blog or a website, I wish this was written more difficult.
So leave the difficult words out and try to write like a writing for kids in sixth grade. A photo says more than a thousand words. This screenshot is of Spec Saver and it’s a Dutch website and after selling glasses they also sell hearing aids. And if you see the photos on this home page, they assume that only elderly people use hearing aids.
And that is a huge, huge assumption that is totally off base because like I mentioned, I became hard of hearing, oh I think I was born, nobody knows for sure, but when I started school they discovered I was hard of hearing. So I think by the time I was 12 years it was recommended that I had hearing aids.
So imagine nowadays you have a business and you just make an assumption of who your client base is and you design your website based on that. If I was 12 years today in 2020 I would want to scrape hearing aids with colours and you know, I’ve seen some photos, they are very very much more fun looking, than when back then. And imagine you have parents who have money or willing to spend money to have, to get the kids great hearing aids and they arrive on a website that looks like this.
And some they click away, right away because this website assumes there’s only old people who were hearing aids and the products will probably not be to the liking of a 12 year old here.
So when you have a website and you focus on commercial and clients, think very hard who are actually your client base, because it can cost you money in the long run. So captions, Facebook made a very bad d/Deaf research. I mean for them easy, because they can track everything.
And Facebook found out that increased view time of videos on Facebook was for 12 percent when they added subtitles. And they have a huge, millions of people to test on because we can count Facebook and Instagram on it.
And captions have so many advantages and it’s not only for hard of hearing and deaf people, but watching videos in noisy places or the silent train coupe and imagine you’re at the library studying, and you take a break and you want to see some video you’re going to need captions. It’s also very handy for the search engine optimization, because Google cannot index sound, but Google does index text.
So if you have captions Google will find your website and your features very much faster. And when spoken language is not your primary language, so if you are English speaking and maybe you understand a bit of Spanish, but it will be handy to have captioned maybe in English or as Spanish, but as long as you can follow extra well. And also if the speaker have an accent, I know I have an accent, because I speak four languages and not one mother tongue.
So I know my sound very confusing and I’m sure the caption will even help hearing people follow me along. I don’t know how many of you are familiar with the SRT subtitle file, but for me this SRT file is the biggest evidence that way more people want caption than who don’t, because the SRT files has been popular since the internet was fast enough to download media. And there are websites, out there thousands and thousands of captions and they are hugely popular.
So like everyone needs or want captions on their videos, so it shouldn’t be a question if you’re gonna put a video on your website, like should I put a caption on a video, it’s gonna cost money, it’s gonna cost time, but the answer is, yes. Because everyone, everyone wants caption and sometimes whether they know it or not they’ll prefer captions. So this is another huge fact, if, if you’re gonna caption, never ever do this. Do not caption ball sounds like this. I mean it’s just offensive to deaf people, especially and hard of hearing people.
But when Janice in Friends is laughing, that you do caption. And why? Because in this context one of Janice’s most annoying characteristics was her annoying laugh. And I can imagine, I’m hard of hearing, so I saw the whole of Friends before I became deaf, but now Friends is on Netflix and a whole new generation is meeting Friends for the first time. And I can imagine some some who never heard Friends who would appreciate exactly knowing why people are annoyed when Janice laughs.
So do think why, when you caption something, if you are doing the correct way and not in the offensive way.
So everyone likes, they pointing out to me that YouTube has auto captioning.
Auto captioning is not good enough. The first thing auto captions suffers from bias, because it doesn’t recognize accent and that is also little non-inclusive. When you have a team of the same people. I don’t know, I’m going to pick because most tech people are white and high socioeconomic captioning they are going to be thinking the same and now everybody is going to think “oh, there might be people who speak with accent.”
It fails with names. It depends on clear articulation. If someone mumbles it won’t get, caption it right and it also depends how slow someone speaks. And I practice, I sometimes recommend people to do it is, is you know like even for a day, I thought I would like some to do it for a week, but if you watch YouTube a lot, mute, mute the sound and watch YouTube on mute for a week long, and only, you’re gonna have to do it like deaf people do, depend on caption.
Auto captions, if there are captions, are they going to be good? And so I dare people who are here, for a week or maybe just try a day of watching YouTube on mute and you’ll find the horrors of auto captioning.
So for me the best and good examples are Netflix and TED. And the Netflix is the best because um English is not my first language, but my first language is Papiamento. I don’t know how many of you know that, because I was born and raised on Aruba, so unfortunately I won’t find Papiamento captions anywhere in the world, so my next go to is English and not Dutch like many would think, but English. So when I watch a movie on Netflix I will always choose the English captions first.
But even so, Netflix has many, many options and when I’m watching a movie from Spain, for example, I would put, I won’t block the language, I will let them speak Spanish, because I can lip read some, but I will also choose the Spanish captions.
Because if I know those people are speaking Spanish, I prefer to see Spanish captions and on the other hand if I’m seeing English movie, I know they’re speaking English, I want to see English caption. And again this is me, that is late deaf person, so you should not assume that early deaf person have the same preference .
And that’s attitude, there is no one deaf person.
Every deaf person – late born, late deaf or early deaf, they all have the individual preference of how they like a caption or sign language.
And Netflix also also has a very good day and lots of deaf people, lots of blind people and have audio description. So imagine someone who is blind is watching a horror movie, for example, and right now the screen is silent, but everyone who can see is looking a creep creeping outside the window. And the audio, caption will let the blind person know that there is a creeping person creeping outside.
So on that point I think Netflix was doing very well up until now with captioning, but there is also one thing you have to take into account. Yes, when I’m watching a movie, I don’t know how many of you know One Day at a Time? It’s a movie about American Puerto Ri, no a Cuban American family so they speak English most of the time, but the grandma, a lot of times speak Spanish.
And that’s one factor I have with captioning and why the English as the main language would be spoken and the moment they have to speak Spanish they will not caption it at all. There will be English, no Spanish caption, or maybe they’ll just put, person speaking Spanish.
And that is also inaccessible, so you have to pay attention to small details like that. And that that has captioning also blank and all main languages and depends how old, how long the video has been online. They also have podcasts and just podcast has auto transcription. So for me Netflix, and Ted are the go to places to see videos and talks, and all transcriptions not only for the deaf and hard of hearing.
And you know, I love to acquire knowledge and follow thoughts and but but, this at a new point of inaccessibility. But This American Life understands, this. They had all the trans and all the artists transcribed years ago and they did it in a few months.
They transcribed all their podcasts and since then every time an episode is published, within 24 hours it will have a transcription. And they have done, you can, I have a link under this slide you can look it up later and you have other statistics, huge research and since they have been captioning their listener has gone up, because Google can index, caption uh transcriptions.
So they had an increase of visitor, they have an increase of unique visitors. They can see that the transcriptions are being read and they can see they have more people visiting their podcast. And why transcript matter, there’s a huge list.
Because podcasts right now without transcriptions they are inaccessible to deaf people, hard of hearing people, people with hearing insensitivity, people with ADHD, people in noisy environment, people in silent environment as the train or the library.
And transcripts are also good for the search engine, people’s primary language isn’t English, and also for fast referencing or quoting. So imagine you have a podcast and it was a hit and you have it on your WordPress website your WordPress website is super accessible. You have a podcast that just went viral, but now you have problem. You don’t have transcript so Google won’t be indexing it and you’re going to use lose out on a huge group of people for which is inaccessible.
And that fast reference quoting and imagine a journalist came to your website to write about your podcast and the person has it, really doesn’t have time to go listen to all podcast. And in this sense, transcripts are very good, because people can scan them really fast looking for the point and they can quote from it and they can reference it in an article or another website. So the advantages of having transcripts are enormous.
So how inclusion works and why I’m going to tell you this, because when you have a project and maybe even a small project, it’s always good to have someone outside your bubble giving you feedback and their point of view on your product. It doesn’t help you to have a bubble of the same people who think like you, are the same culture of you. So diversity is having a seat at the table.
Inclusion is having a voice, and belonging is having that voice heard. I’m a person who can be considered the diversity in the Netherlands, because I am not Dutch.
I’m chronic ill and I’m deaf and many times that happens that people ask me to join them and to be, you know, the other voice. And that’s very nice to be sitting there and it’s nice to be talking, but sometimes you talk and people don’t listen.
And so it’s very important when you expand your bubble to really be aware, I am really listening to this person’s voice. I’m not saying you have to do everything someone tells you, but one should really listen and you know comprehend what they are being told about their website about the product.
And that’s the best way to be inclusive. And now I’m going to give you a perspective, because uh since I’ve been doing this, I got that question many many times: but it costs money, it costs money, it costs money. And the first thing you have to think about when you have a budget and you’re getting ready for stuff, whatever project, so you look I’m gonna use WordPress, that’s free, thank you that’s free.
The host is going to cost money and maybe I have to hire a programmer, but in that budget you should also think of about accessibility. That should also be from day one, because if you’re gonna have to later, it it’s gonna cost even more money. So day one you have your budget, accessibility is going to be part of your budget.
And this is the perspective: abled people will say disabled people are only what, like five percent increase in our web audience? Who cares about making the web accessible. And also abled people: our sign-ups increased of five percent. Bonuses for everyone!
So that’s really something you should always think about when you’re going to start a project. So thank you for listening and do you have questions for me?
Allie: Wonderful thank you so much, that was amazing. I learned a ton. I was tweeting through the whole thing. I really appreciate everything that you just shared. I do have the questions pulled up so I will make sure that we go through them from first ones to the most recent. Let me go back. Okay, so the first question that we have: How many fonts should I use when designing a website?
I found some websites using more than two fonts.
Darice: Okay the font thing, um I think just not only for disabled people, I think um like I like gifs and I get annoyed if there are too many gifs on the website I’m trying to read, but one or twice okay. Uh okay I do actually design longest web pages for my job and I stand by three fonts.
I will use one for the headers, and one for the body, and one for the block quotes, and maybe a fourth one, but just offer a small text the captions, because if I caption a photo I will always do that in a monotype space, but no more than four. And you show us, make sure they’re like in some flow and to just four. I know it’s very hard, I mean there are people who have font expert and I don’t think I’m a font expert, but like on Typekit from Adobe and Google fonts, you can always Google the fonts combination and it’s sure the combination work.
So you don’t have to guess and mix and match, but I will keep it four fonts max and which of two are the main ones: one for the header and one for the body.
Allie: Next question: Do you see enough changes in diversity in relation to digital accessibility?
How can we improve and what area needs it most? What is the first thing you address when you start a project? So that’s three questions in one.
Darice: Okay, I mostly advise people. And then it’s like, I don’t know how it is, I know I’m speaking to a worldwide audience, so I’m going to speak from the Netherlands for faster and the majority of the population here is white.
And after the industry at international products to do web apps and stuff, I remember back then there was a huge thing because it was a group of young guys in Silicon Valley who made the app for woman and they had it all wrong.
Why? Because they didn’t have a woman in the team.
So you’d have to do it on day one and you’re gonna hire people and freelancers and try not, I know after you’re investing, you hear a lot is, yeah buddy don’t fit in the work culture.
See that’s the problem, the work culture. You want people that don’t fit in your work culture because your audience and your clients are not going to be part of your work culture. So look for people who are very different from you. I’m not telling just pick someone because they’re a woman, because they are brown or because they are disabled, you’re gonna pick some because they know the job, but you’re not gonna pick them because they are the same as you. So that’s the first thing you have to think.
Allie: All righty, that was fantastic answer. Could not agree more. The next one we have up: YouTube auto captioning is not perfect, but can those captions be used as a reference to edit and fix the errors?
Darice: Okay, ah, yes that’s what I do at work. Do we have videos online you’re captioning them and yes the advice is you upload on YouTube and YouTube will generate the auto captioning and it’s going to be full of mistakes. And what you can do is you can edit that file.
So it does help that you don’t have to start from scratch. So you just get that auto generator from YouTube that’s going to be full of errors and still will take some work for at least you’re not starting from scratch. It will have all the minutes already noted and so you just have to go through that text and correct all the mistakes and then you have fun, well working captions. So yes, that’s advice, but never just generate it and leave it like that. You can correct them.
Allie: Absolutely, that’s fantastic. All right, next question. Um captioning is possible in YouTube Vimeo etc, but how can I use it in HTML type videos? So I guess that means videos that they’ve just embedded directly into the
site and not from a third party?
Darice: Well that’s a good question. You have to see the experts on that. I’m sure today there will be someone speaking about that.
Because I’m deaf myself, I’m not able to test these things and create the captions. But if I’m not correct [unintelligible] my video I just embed files, so you have to like burn the, uh, caption hard coded in the video. Because right now YouTube gives you the options turning it on or off and the menu too, but if you’re gonna embed it [unintelligible] then you make sure to make sure that you burn those captions in the video. So that’s what I thinking about, yes.
Allie: Awesome, uh so this is actually the last question that I’m seeing so, but we do have some time so if anyone has additional questions please put them in the chat so that I can grab them, uh, and pose them to the speaker here. So the last question I’m seeing right now is: Is it good to use “here” when providing links and if not what is the right method?
Darice: No it’s not right to use “here”. I, so I always like explain what the link is and that explanation part going to link, but here as well, yes. No, so if I’m going to link to this talk later on on my website I’m going to write, yesterday I gave a talk to the WordPress Accessibility.
You can view my talk on YouTube and I will link “you can view my talk on YouTube”. I’m not gonna say you can view it here, a link here, no.
Allie: All right, so we have one more that just came in. The question is: What are your thoughts on YouTube community captions being discontinued?
Darice: Okay, I think YouTube community is very big. I don’t think there is one YouTube YouTube community, because inside YouTube you have several sections. And I think uh yes, uh let’s say for example since this pandemic that we have been sitting at home, I’ve taken a liking to see these interviews writer who released the books. So they are not going on book tours anymore, so everyone is talking to the bookstores on YouTube and several of them are captioned. I’m not 100 percent sure if it’s auto caption or not.
I’m going to assume they were corrected, because they’re pretty good captions, but there’s time I’m missing. I also like seeing night talk shows from the United States. You know like [unintelligible], I can keep them apart, but I noticed that Conan never ever has captions. So I never ever, have yes, Conan and lately I just stumbled upon him in the recommendation and I saw he had captions. But before that Conan did not have subtitles on YouTube.
And I think it’s Kimmel, Kimmel has subtitles, but his subtitles are always delayed. And so it’s it’s very hit and miss in in in the YouTube sphere, but what I am very upset about is the decision of Google to stop community captions. I don’t know if you people have followed, but Google is gonna stop, uh, the possibility for people, like you have a channel and you have a video and someone can write the captions for you and submit them. But they are going to stop that.
So Google is actively working against accessibility on that point.
And it was also your thing with Twitter because Twitter started voice tweets. And I want to ask this world, well others, to think twice before you start using voice tweet, because they announced it voice tweet. And then everybody was like, okay what about other deaf and hard of hearing people? And it turns Twitter hadn’t even talked about with their accessibility team. It turned out they didn’t really had an accessibility team. So when people got mad they had to scramble and get that team set up, because you cannot think Twitter is highly accessible right now.
Write the text and you’re always giving tips how to keep the text accessible for screen readers and I want to advise this, that won’t be accessible to deaf. So now the voice threads are going to launch soon just here and the captions will follow later. So I’m asking right now the worldwide artist please do not use voice tweets. Please just keep writing your tweets and so many letters.
Allie: There you go. All right folks, that’s all the questions that I’m seeing for now. So we are going to go ahead and, um, wrap up. Thank you Darice so much for all that fantastic information. You made so many amazing points and it was such a pleasure and an honor to hear you talk today.
Additional Resources
WP Accessibility Day has not assessed speaker-provided presentation resources for accessibility.
How many fonts should I use when designing a website? I found some website using more than two fonts.
While I’m not a font expert. When I design longread pages I keep a maximum of 4 fonts. 1 for the headers, 1 for the body text, 1 for blockquotes. And I use a monotype font for image and illustration captions.
I always check design resources for best font pairings. To make sure they don’t clash.
Do you see enough changes in Diversity in relation to digital accessibility? How can we improve and what area needs it most? What is the first thing you address when you start a project?
I think we still have a way to go on diveristy on all areas, digital and otherwise. I believe that one should consider diversity on day one of starting a project or team. Let go of the believe of hiring people “who fit wih our work culture”. You want people with different perspective than you have. People outside your bubble. Your team, project or product is not going to be diverse if everyone for example, and just an example: is male, abled, white, likes soccer and the team building outing is a soccer game and beers afterwards.
Imagine the next project of that team is building an app for pregnant women to track their pregancy. Or an hospital app for patients to access their appointments, results, keep track of questions they have for their doctors and such. There are many issues to such apps that won’t even occur to the team. Imagine if the team had women, disabled people, POC, different reiligion. You’ll start the project way ahead.
Thank you for your talk Darice. As you said, YouTube autocaptioning is not perfect. But, can those captions used as a reference to edit and fix all errors?
Yes! It saves time to have a basis with the time annotations. You’ll just have to go through all the text and correct them where needed. It will save time instead of starting from scratch.
Caption is possible in YouTube, Vimeo, etc but how to use in HTML type videos?
I have no hands on experience with this. But I’ll say probably, you’ll have to “burn” the captions in the video file you will embed with HTML. An .mp4 or .avi file for example, you’ll need to add the captions with a movie editor and save the video with them.
Is it good to use word “here” when providing links? If no, what’s the right method.
No.
Links always need to have descriptive text. For screenreader users and abled users. No one likes being confused with where “here” goes to.
What are your thoughts on YouTube community captions being discontinued?
A huge let down from Google. I have read the supposed reason they are discontinuing them is spam. I find it hard to believe that a company like Google with the best engineers in the world can’t solve that problem and instead are removing an accessible functionality on which millions of people depend on.
How much is too much for captions? How descriptive, colorful, etc when describing the activity?
I actually guided students last semester on a captions project. I saw many creative examples. It was for a think outside the box kinda project. But right now in the real world:
Simple is always best. Sans-serif for spoken text. White on black or yellow on black. Italics for sound and music.
For transcripts: Make the name of the speakers bold and maybe with a light coloured background. Enough white space between paragraphs of speakers. A comfortable line-height for sentences. Almost black colored (I prefer #222) text on white background. If you use dark contrast, dark grey background and white text.