Mark Boyden: All right, we're at a minute past the hour, so we're gonna go ahead and get started.
You are tuned in to Knowbility's Be a Digital Ally, and today we are doing a presentation on tools and techniques of a blind accessibility auditor.
First, a little bit about Knowbility.
We... Welcome to Be a Digital Ally. The goals of Be a Digital Ally is to cover the basic skills and principles behind accessible digital design. We do a different topic each month for about an hour.
And to make digital content accessible to people with disabilities. Our audience is generally content creators of any skill level, and especially those newer to accessibility.
We thank you for letting us be a part of your journey, and we always strive to create inclusive and accessible spaces, so we ask everybody to be kind, polite, and respectful throughout this presentation.
And we strive to ensure accessibility.
Knowbility was founded in 1999, where a 501c3 nonprofit based in Austin, Texas, and operate globally around the world.
Our mission is to create an inclusive digital world for people with disabilities.
We do that through several community programs. One's ongoing right now called the Accessibility Internet Rally, or what we affectionately call AIR.
We bring together web developers who want to learn accessibility techniques for websites, and pair them up with nonprofits who need websites,
And it's an 8-week-long competition. We're almost 4 weeks in.
And we'll be announcing the awards in January.
AccessU is our annual conference that happens in May. I'll tell you a little bit more after this presentation about what's upcoming in 2026.
Access Works is a program that we operate working with people with disabilities who do user…
testing, um, for pay, and, uh, at good rates. And if anybody's interested, you…
So you should reach out to us after this program. Um, K-12 Digital Accessibility, we bring… we bring in, um,
or bring content and programs related to parents, teachers, and anybody
involved in K-12 education. And finally, this program, be a digital ally.
We also have some services that help us fund the program work that we do.
So we do accessibility testing and auditing of websites and smart apps.
We can also come in and work with organizations and corporations on their leadership and strategic consulting, and provide strategic consulting
on how to build internal accessibility programs.
We can put together training programs. We have some that are already built, and sometimes we build
Ones that are specific to the needs of our clients.
I've already talked briefly about AccessWorks, but it's also one of our service side of things.
And then we also have an accessibility help desk, where organizations and corporations may,
purchase hours and set up for some assistance on anything you're dealing with related to accessibility.
Okay, little housekeeping for this program. You can ask your questions anytime in the Q&A. The Q&A is in the menu item at the bottom of your screen. It's a little different on the…
The smartphone and tablets.
Um, you may ask in person if you'd like to ask a question in person, you may raise your hand. You could also put in the Q&A that your question and that you'd like to do that, and we'll call on you.
You may also type in the chat, but we'd prefer the Q&A as much as possible, because I understand there are still some accessibility issues related to the chat for some folks.
At this point, I would like to bring you to a…
Uh, to introduce to you Janine Leinbeck, who has years and years of accessibility training, testing,
And previously, we served as president of the local chapter here of the National Federation for the Blind, and has been involved with the NFB for quite some time.
So, Janine, I'm gonna let you take it away.
Jeanine Lineback: Hi everybody, can you hear me? I hope so.
Mark Boyden: We can. So go ahead and share your screen.
Jeanine Lineback: Okay, so I'm gonna share my screen, and we'll get started here.
All right, well, I'm just about there.
More options for participants drop-down button.
The video thumbnails are minimized to optimize for video sharing alert.
Can you see my screen, Mark?
Mark Boyden: We can see and hear.
Jeanine Lineback: Oh, bueno! Hey, everybody! Um, my name is Janine, as Mark said.
You have stock Mark. Participants can now see your…
Um, I'm going to be demoing how you would test.
That I actually updated just before this meeting. So I'm I sent him a new copy. So.
If you haven't received that yet, you will, with the just some notes and the websites that I'm looking at, and.
A few additional resources, that there. There is a lot more out there than what I put in the.
Babel has joined the meeting.
The document. So As Mark said, I've been doing this for way too many years to count, so I won't.
I started as an assistive technology trainer back in the way day.
And I moved on into accessibility, testing and auditing.
My 1st experience with this was in 2,007, with testing and auditing. So that gives you a.
Framework of time. I'll Dutch as much as I'll say about that.
Iphone 3.
We're gonna go ahead and get into the actual testing. If you have questions.
Sorayas.
This is very interactive. I really want people to ask, so I'll be stopping.
Soraya is.
Periodically, as long as we don't run too close to time, because showing some of these unlived.
Demos. It takes its time, right? So. You know as much as I can. I will stop for questions.
Alright. So I'm gonna start off by just talking about the 3 different kinds of screen readers.
Presentation notes dot text presentation notes dot tech. Screen. Sharing meeting controls are a 1 column, 2.
And.
Screen, sharing, meeting controls, window. Presentation, note web, aim, web, accessibility in mind, Google Chrome column, 3: web, aim.
There are 3 for windows, or for 2 for windows that we primarily use for testing.
The 1st is Nvda, which stands for non.
Visual desktop, app. So if you didn't understand the 4 letters when I said them so quickly, Nvda.
Not Nvidia, but Nvda. That screen, reader, is primarily used for testing and auditing.
By developers and.
Auditors, because it is free. It is also out of the box. One of the more.
Constantly say. Not adding a lot of extra stuff.
Which would.
Enable, disguising. Developer flaws.
So a lot of the other screen. Readers. No disk to them.
Christopher, chest.
And they're trying to help the end user. We understand that.
But they do have things turned on that. You may have to go in and turn off to test more effectively to make sure that you're actually getting accurate results.
So the other 2 screen readers, and these are these are well. The Nvda is for windows, as I mentioned.
And we use Google Chrome. Or Microsoft Edge.
Browsers to test with those you can use, either.
Cory Johnson has joined the.
Chrome is recommended by Nvda, but either works I've used both.
Andrew as Joy.
And sometimes we're in environments where we have to, you know, the developer tells us, Hey, you know, we work within this particular environment. So that's what we do.
And the
3rd Screen reader, or the second is Jaws, JAWS. And it stands for job access with speech.
Jaws is an awesome screen. Reader. It's used primarily in business and enterprise environments.
However, a lot of home end users don't often own it, therefore they often use the 1st screen. Reader I mentioned.
As a fun tip or fact. Just this year. Finally, Nvda, which is free.
Became the number one screen reader being used by the blind and visually impaired.
That was a study, I believe, done by web aim. It might have done being done by the International Association of Accessibility professionals. But I think it was Wemmy.
Webbing either way, they both are equally. Quality screen readers. They have equal quality. They, you know, have different things. They do better.
They both contain some AI features. However, an Nvda, those AI features are not turned on by default.
In jaws. They aren't fully turned on by default, but.
George does some interesting things. So, for example. You know there are some deprecated tags.
In HTML, as I'm sure most of you who are developers may be aware.
And jaws will do things like. Allow those tags to be recognized as valid code.
And thereby read them. So like a title. Tag.
And it will go ahead and use that, and I know that's been undeprecated. But there are.
There was a time when it was deprecated. Then it came back.
I don't know where it stands now, but you get the point.
Jaws is very expensive. It is not free, it costs.
Over a thousand dollars. They've just changed the pricing scheme.
And I could not, for the life of me explain it, so feel free to use the link I provided in the handout to go. Read about that, if you.
Are interested in purchasing it, or your company's interested in purchasing it.
Great But a lot of developers. Just go ahead and use the Nvda cause. It's a free download, and the link is there.
In your handout. The 3rd screen, reader, is voice over.
And voice over is used. On Mac OS.
And Ios. So you're operating systems from app.
You can also test with android screen reader called Talks.
But I did not include that here, because most testing is not done that way.
Most people are gonna look and test an app or a website through.
Windows, or. Through an apple device.
Whether it be a Mac or. An ios device.
So, having said all that, I'm gonna. As quickly as possible. Try to give you an idea of how screen readers work, and then I'm going to take a break before we do any.
Setup so. 1st off screen readers, you might wonder well, how in the world do they give you the information.
If you're not blind and you've never used one. It seems pretty amazing.
The truth is, they look at the code. As much as they can.
But they use a buffer, so there is some delay, so they see the code.
They grabbed a code. They put it in a buffer and they spit it out to us.
And how you develop that code makes a difference in how it's received by the buffer, and then how it's spoken to us.
So that's really important to keep in mind. I'm not reading what's actually physically visible on the screen in the way that you are.
So you could think of it, as you know, reaching into the candy bag, not knowing what you're gonna get.
And you get what you get.
Brendan, fierce has joy.
And if you don't know anything about looking at source code, you could be lost in some cases. Trust me.
It it happens. So it's really important.
The more you can use semantic HTML the better it is for the screen. Reader, user, and most people honestly.
I'm sure you guys are familiar with Css, you know, putting your style sheets, putting things related to style in there is really important.
Screen. Readers rely on that kind of stuff because the HTML is used for structure.
The style is supposed to be in the style sheet as much as possible.
We also have aria. Application. Rich. What is it called? Accessible? Rich Internet applications.
Anyway, you get the point. I'm sure you know what aria is, even if you've never used it. You probably heard the word, not from game of thrones.
She was yeah. A character, anyway.
The way is screen. Reader reads to a blind person. It reads from top to bottom.
And left to right. So think about that for a minute.
You can see the whole screen or big chunk of the screen, I guess, depending on how much is on your screen, and how.
Proud of your windows are. Maybe you have 3 screens going at 11. I don't know. Some people do.
But a screen. Reader, user can only hear one thing at a time.
If you're on zoom with the screen, your user and Mark starts talking to me right now.
I can't hear my screen. Reader. Because I'm hearing Mark, or I can't hear Mark, because I'm hearing my screen. Reader, I'm ignoring Mark.
So I can only hear one thing at a time.
But it also only reads one line at a time, or one word at a time.
Okay.
So there are different ways to navigate, but the important thing to remember is the way you.
Order things on a website makes a difference.
And doing it with HTML. Logically as much as possible is important.
So we're gonna try to demo some of that stuff.
Soon There's 2 different.
Modes that a screen reader can be put in.
For Nvda we call those browse mode and edit mode.
And when you load a website you're automatically in browse mode which allows the screen. Reader, user.
Noel has joined the meeting.
To do several things. One is they can. Tab through the website, which might take a long time, like, if you're on the Hb. Website that I'm going to show you in a minute.
When you'll.
Or you could use. What's called quick navigation keys.
Which allows a screen reader user to jump to things like headings, landmarks, images.
Buttons form controls, edit fields, all kinds of stuff. We'll demon.
Demonstrate a bit of that. As well, and you can also arrow.
Whitneyster.
And this is why logical order has some.
Play in this, because when you force.
The focus, and sometimes I understand it's necessary to do so.
But as much as you can stick to semantic HTML, and not do that. It's really helpful.
Because I can't arrow through things and find where I am. If I need to read something.
Tamerzaid has.
Around an area where I have tab 2. So, in other words, you forced the keyboard focus. Say, to go one place.
But if I arrow I'm somewhere else. Well, I don't know where that tab is. I have to look all over the page. I may or may never! I may or may not ever find.
So without deliberating that point. Just think about that, because I'm sure when you're looking with your eyes, and you want to find something in Hcb to buy. It makes a difference.
If you can, or can't find it, or how quickly.
Bobsacones.
So. Now I want to talk just a little bit about.
Let me see here. I wanna make sure I cover it.
Screen sharing meeting controls. Ro. 1 column, 2 presentation notes dot text unique titles for pages.
The most important things that I wanted to do for this.
Check for all texts. We just text at this rugs unique to Nvd, how is green relank.
How is Greenweater reads Tech and Vda setup vision, check hut.
Yeah, we got that. So. We're gonna do a bit of questions, Mark. Are there any questions.
Mark Boyden: Currently. I don't have any questions.
Showing.
Jeanine Lineback: Okay, go ahead, then. Let's move forward. So I'm gonna do a little bit of screen reader setup. Now, if you're blind. I know I heard a couple of my friends names in there, so I'm not gonna say any, but I know there are some out there.
In your testing. With the cited person.
You're gonna want to go into. Well, and if you're cited you're gonna want to do this, too. You're gonna want to go into the Nvdas.
Menus, which you can do by pressing.
The insert key and the in. Let her n as in Nancy Key.
So these you you use this green reader by.
Implementing a series of. Keyboard combinations. A keyboard user.
Is also a screen reader, user: and 9 times out of 10 they're not gonna be.
Using a mouse. I say it that way because there is a function.
That allows people using screen readers to do some things to try to simulate a mouse, but it's pretty.
Hit and, miss, I'll just put it that way. It's a little bit better within Vda, in my opinion.
But I would still say it's not an ideal thing, and it wouldn't, Mat. It wouldn't pass WICAG, anyway. You still need the the screen. Reader.
To be able to. Work with the keyboard, and have the keyboard. Work with your site or your app.
NVDA menu. Preferences, sub menu. P.
So I'm gonna go into the Nvda menus. And we've got preferences. We're gonna go into preferences. We're gonna go to settings.
Settings. S. Speech, dictionary, settings.
Generalist Item Focus selected one of 18. Speech to everything.
Then. We're gonna go to vision.
Audio list. Item, 4. 18. Speech to ovitine braille, 3. Ovitine audio, 4. Ovitine vision, 5 0. 18.
I lost speech there for a minute. I don't know why.
Visionless item Focus selected 5 0. 18. Vision, property, page configure, visual aids, visual highlight grouping.
Okay. So it says, Configure.
Enable highlighting checkbox check all plus.
Visual age. Now you can see that I've already checked this, because I was testing it.
And it won't. Be checked by default.
So you install in Vva. It won't be on automatically.
Alright, you wanna check this because this allows Nvda to track the focus visually.
Otherwise you can't see where I am. Ask Mark when we tested it last week.
If it's not on you don't know where. You are. If you are sighted, and your friend who cited that you might be working with, would not know where you are.
So. Turn this on, it will automatically turn on these other 2 cursors.
Highlight system, focus checkbox, check all plus.
Sí.
That's the system focus which we just talked about. That's the one that's tracking where the keyboard user can go.
When you're tabbing. For example.
I like navigator object, checkbox check all plus.
Oh!
And then highlight navigator object, that one you're probably not gonna worry about unless you get really advanced at using Nvda, but it's a great little feature of Nvda.
If you are an actual screen reader, user, or you become a developer who says, Hey, I'm really into this.
I like rouse mode, cursor, checkbox, check all plus.
Yeah. I like rouse mode, cursor, checkbox, focus check-out, plus.
Alright. So we're just gonna. This is really the only thing. Okay, so we've got highlight browse mode.
I like rouse mode cursor, checkbox, focus checkout plus.
Browse mode cursor. Sorry I can't speak. Got a little tongue tied there.
Yeah.
Anyway, you do want it. That will automatically be checked when you check that 1st one. So all of these, right here.
They automatically get checked when you. When you check that 1st one, and some of them.
Are already checked, anyway, and that's fine. The only one that won't be checked. That you need to check is that 1st highlight.
Ari has joined the meeting. String curtain drooving, our eye is left, the meeting alert.
That's important.
Makes makes Jennifer. Dot Perkins has left the meeting alert. Always show a warning when loading screen. Curt, make screen, black immediate effect. Check always show a warning when loading screen.
And you don't want to make your screen black. If you want to be able to see what you're doing.
Always show a warning when loading screen replace out when toggling screen. Crow Caban.
Okay. But I'm focused pressed presentation notes. Dot text notepad.
And we're not gonna turn on the screen. Curtain. So we're good. We're gonna just stop there now.
I didn't have to change anything because I had already changed it, but I just wanted you to see where that is cause, if you're cited and you're using this.
To see if, you know, you can test with a screen, reader, and.
Tell how your website's working, or possibly not working well.
Gj. Has joined the meeting.
Then you definitely want that highlight on. There's 1 other thing I want to show you in the Nvda tools.
NVDA menu. Preferences of menu tool sub menu, TV. Log.
And that is.
L. Speech. Viewer: Yeah.
This is called Speech Viewer. I'm not gonna turn it on. But I'm gonna tell you what it does. And I'm gonna tell you what.
Best practice would be. So the speech viewer allows.
A window to pop up.
And it allows you to see whatever's. Being spoken by the screen. Reader, in that window.
That's good. If you're having trouble understanding it, or you're trying to get used to it, or you want to copy and paste, something into a report.
Because you forgot what the screen reader said, or whatever.
However, I give you a strong warning.
A is just like a big slog of run on text.
So keep that in mind. It's easy to copy and paste from.
Jenny Chen has joined.
Jenny Chen has.
But it doesn't always catch everything. There are some tricks to when Ari is used. You're not going to get those messages necessarily.
If it's off screen. Sometimes things don't end up in the buffer for the speech viewer.
So there's some, I guess you'd say caveats to using it.
One of the things I do like to use it for is copying source code. When I need to put some in a report, because I find it difficult to copy it in the Dom.
In the developer toolbar. Whatever.
And so sometimes I will use it for that.
But I would tell you. Just be cautious in your use of it. Make sure that you're not relying on that to understand and test.
For your screen. Reader. Accuracy alright.
Speech viewer menu item focused S. Tool sub menu t presentation notes. Dot text. Jim Power has.
So we're gonna close this. Since we're not gonna actually.
The text. Editor: edited focus, multiling and Vdis unique titles for pages.
Nvidia's Up vision check highlight. Unique titles for pages.
Turn it on.
Alright. So I'm gonna start demoing now. And the first.st Page. We're gonna work with.
Rachel García, with accessibility in mind, web, aim.
If you hear me delay occasionally, it's cause people are joining and leaving and joining.
And that's fine. Don't stop doing whatever you're doing. But.
I'm getting every one of those alerts, for whatever reason I didn't turn it off.
Rachel, gasitas.
So it. A little annoying.
No next table. Skip to main content, link, focus, link same page.
Alright. So we're the 1st page we're gonna look at.
Web, web, accessibility and migration.
System, any web, aim, web, accessibility.
Can everybody see that. Screen, the web, aim, org.
Mark Boyden: We we can. Now it's you've made it full screen.
Jeanine Lineback: Yeah, okay, I thought so. Alright. So thank you, Mark. Are there any questions before I get started? Just.
Quick!
Mark Boyden: So, for, let's see, is using the readout loud.
I'm sorry is using the readout loud. Better for Pdf documents with testing.
Or do you recommend testing with the screen, reader? With Pdfs.
Jeanine Lineback: Test with a screen. Reader, read out loud does not count as a full screen. Reader, please.
Gj. Has left the meeting.
Mark Boyden: Yeah. That's what we have at the moment.
Jeanine Lineback: I hope that answers your question. Alright. Thank you for the question.
If you want more information on that, I suggest you go to the.
nvda.org. Well, it's nv access.org site and. They can give you a full explanation. There. Why make matters.
Web, name, web, accessibility and mind, link, focus, business.
Alright. So the 1st thing it's important to do is make sure your page has a title, because it's how we orient ourselves, not just me as a person with a screen reader, but you and everybody else in the world. If you have a page, that's Johnny's.
Dough shop. We're talking dog HDOU GH here, for you know, bred though.
Then you want. You know your page to be titled, that so people know they're there.
Web, accessibility in Mind, Google, Chrome.
So there you go. This one says, web, aim, web, accessibility in mind. And if this is too, is this too fast for anybody. I can slow the speech down. I didn't. This is my.
It's a little slower than what I normally use, but not much.
So if you, if you have trouble understanding, let Mark know in the in the QA. Or raise your hand, or something, because otherwise I'm gonna keep it flying.
What aim, web, accessibility, and mind. Link focused, visited Linksain Page.
Alright. So the 1st thing is that to make sure you have a title that is representative, and.
The name of your page, and such. So we're in.
Navigation landmark, heading level 2 heading level. 2 visited same page. Link, graphic web, aim, same page, link.
Browse, mode.
And up the top. Here we can see we have a same page visited Link.
Webin, webex, heading level. Same page link. Skip the same page. Link Grant Wilson has left the meeting alert. Same page link.
Skip to main, content.
It's basically a skip to content. But I've been there before, so it tells me it's been visited.
So you could use this to go to the main part of the page.
Skip. The links are not required, but they are useful if they go to the main part of the page.
What I distress over is when I have a skip to link that a is broken.
L'oreal Carson has.
Which is a problem, or B goes to some. I don't know list of news articles that really isn't the main content.
That drives me nuts. Now, if you're cnn, maybe it is, but if you're not Cnn, probably it is.
Alright, so. I'm gonna show you 1st that you can simply arrow.
Heading Level 2. Visit at same page. Link, graphic web, aim, web navigation landmark, heading level 2.
Main navigation.
When Neil is, let's with 5 items out of list, heading level 2.
Down the page. That was a landmark. You might have heard it say so in a slightly lower voice it will announce.
The type of control it has fallen on. In that case it was a landmark, and it read of what it was.
List with 5 items visited link services.
Then it said, List of 5 items and server. This services link.
Link articles.
And now we're in the list. So it's just reading the names of the different services in the list.
Is it like resources.
And it's telling me when they're visited. So I've been to these before. That's why you're hearing the word visited in front of them.
Link projects, link. Community out of list, search line, Mark.
Good name.
Yes.
Mark Boyden: I was asked, if you could please show us how you access the accessibility tree and navigate through it, using Nvda.
Jeanine Lineback: I will try to do that before we end here. But I wanna cover some basics first, for people who are not familiar with screen readers.
Mark Boyden: Fair.
Jeanine Lineback: Because that can take some time. It it it's How shall I say? It's trickier than it should be?
I would say it's almost sometimes a little easier in Microsoft Edge, but that's not.
That's not necessarily true. I think it may just be how I feel about it.
Anyway, so you can arrow through the page like I'm doing, and you can be pretty much assured that if I tab I'm gonna get the same information. So I could tap through these links.
Navigation line mark list with 5 items: community.
So you heard it say navigation list of 5 items community link.
Like.
Projects, link resources. Visited link articles, link.
Projects I'm just having. Well, I'm actually shift having cause I'm going backwards.
And back at the top. Here, it says, services.
Services, visited link. What name web accessibility, navigation, like articles, resources, projects.
So now I'm back. Tab! Moving forward. Now did you hear that.
Like community link, search.
If you didn't. I'm so sorry it happened.
I landed in what's called edit mode, so I know I must be in some place. I can either.
Make a selection. In other words, it's interactive. I've added. I've landed in an application area or a form field.
Search Generated Focus.
guess what? It's a search edit. So yeah, I could type in here and search.
So I told you there were 2 modes. There's edit mode, which is now what I have.
What has been automatically turned on in the screen. Reader, by landing in this field, so.
The developer coded this correctly, and so when I landed in the edit field, it automatically turned on the application.
The edit app. Edit, on application.
The edit mode. That's what I'm trying to think. Say, thank.
So I could type in here. I want to search for I don't know whatever whatever I want to search for, and it would.
Then I would, you know, tap, to submit, or hit, enter, or whatever the.
Processes. Now, what let's say, I don't really want to do that. So I'm gonna hit.
Escape which allows me to go back to browse mode, even though I'm still focused on the edit field.
It doesn't matter. I've turned that feature off. So now, if I type, nothing's gonna happen with that edit field.
If I hit a letter that moves me somewhere, cause it's what we call a quick navigation key, which is what I'm about to show you.
Then I'm gonna go somewhere else on the page.
Because it will now pass that key to the screen, reader, and say, whatever you're supposed to do when this person hits H.
Go, do it, which happens to be moving to a heady.
You're in Northern has a mainland mark. We have web accessibility in mind.
Heading level, one.
So I'm gonna hit an H. So, heading level one, we have web accessibility in mind that makes sense. To me.
As a. Heading level, one.
Expanding a potential of the web for people with disabilities, by empowering individuals and.
Banner Landmarks.
Now I'm gonna pick another. Type of quick Nav key, which would be a G.
Web, name, web, accessibility in line, graphic visit at same page, link heading level 2.
And that gave me the Graphic for their website.
No. Next graphic. No previous graphic.
And that's the only one it's finding on here. So that's.
Same page, link skip to main, content.
I think accurate. However, if I really wanna know, I can pull up a list of all the elements with the insert key and.
And F. 7. It said, elements, list, dialogue, tree, view.
So. We can see all the links here.
Elements, list, dialogue, tree, view. Skip to main content. Same page, preview itemfoque, skip to main, content, web, aim, web, accessibility in mind, skip to main content. Same page one of 4. Web, aim, web accessibility in mind, visit it. Same page 2. At 42 services visit at 342 level articles for 42 level, 0.
Resources visited 5 Bypa, 42 level 0. Project 6 of 4 type grouping.
Now, if I want to change. What I'm looking at instead of links. I want to see.
Links, radio button check. All plus. Okay. Landmarks. Radio button check all d.
Let's say, I want to know how many landmarks are on this page, because sometimes.
Developers have decided to use landmarks instead of headings, or in combination with headings.
So we've got Banner.
Preview. Banner expanded one of 3 level 0. Level, one navigation, one of 2.
Search. 2 of 2 level, one.
Navigation. And it tells me what level they're at. That's important as well.
Level, 0 main, 2 0 3 content, info, 3 0 3 level, 0, main, 2 0 3 level, 0.
Content info 3 of 3 level, 0. Main 2 of their content in both the main 2 of 3 level 0.
So see, I see main there. So that tells me that's where the main navigation bar would be.
Content. Info 3 0 3, main, 2 0 3 levels, 0.
Filter by any help plus y move to button L plus.
Yeah.
You can filter by, you can move to so you could pick one of these and move to it. I'll just go to the main landmark.
Mainline mark. We have web accessibility in mind.
So that went to the exact area which was the heading level. One we saw earlier.
So that's some of your. Basic navigation stuff that's like super super basic.
Just in his left, I mean.
If you've used the screen, reader, for a long time, most of us know these things. If you haven't your developer, or you're just new to.
Accessibility, testing. You know, maybe you don't know these things, and that's why we cover them.
Out of list, expanding a potential of the web for people with disabilities, by empowering individuals and.
So now I'm gonna get into a little bit more.
Complex. Stuff, finding a block of texts for to read.
Organizations to create accessible content. Heading Level 2: link accessibility Webin can provide web document zoom and strategic accessibility training to fit your needs.
Heading level. 2: link tech need assistance, implementing accessibility.
So you could just read some text here.
With heading level, 2. Link accessibility and procurement. Banner landmark, heading, level navigation landmark, heading level 2.
Main navigation list, with 5 items. Services, visited link.
I'm using a A. You know I was calling him Quick navigation Keys, because that's initially what they named them. But then, when Apple came and started changing on the Mac to calling those quick nav keys.
I believe people now tend to call these screen reader hotkeys or short keys. I've heard them called all kinds of things.
But they were originally called Quick navigation Keys, and I'm old school, as you already know.
Link articles.
So. Kind of stuck. Okay, I'm gonna go into articles here.
William Articles, Banner.
So I just press. Enter on that link. Now I'm gonna.
Web, aim, web, accessibility in mind, graphic visited, link, heading level 2.
Nobody is heading navigation, landmark. Main navigation, heading level 2.
I'm kind of.
Mainline, mark, articles heading. You are here. The heading level 2. The user's perspective.
Okay. Main landmark, articles.
List with 5 items out of list. Heading Level 2.
The user's perspective list with 5 items. Blustered as left the meeting, alert bullet.
Like, can spool it, link. Introduction to Web Accessibility.
Okay, we're just gonna open up introduction to web accessibility and let you hear a little.
William articles, document focus, read only. Bullet link constructing a poor bullet.
Like introduction to introduction to web accessibility. Introduction to Web Accessibility.
Banner Landmark: same page link, skip to main content.
Heading level 2 visited Link graphic web. Ame. Navigation, landmark, Main Navigation.
Heading level. 2 mainland mark. Introduction to web accessibility. You are here.
Visited Link Homegrader, visited Link. Articles greater introduction to web accessibility.
Navigation Landmark. Heading: Level 2 article contents. List with 5 items: black, square.
Same page link introduction. Black, square, same page. Link.
People with disabilities on the web, black, square. Same page, link, implementing web, accessibility.
See how it's even telling me that they're black squares in front of each one of these. That's excellent. I don't.
Necessarily need to know that that. That's 1 of the issues that we.
Wouldn't. I mean it's not a failure of Wcag or anything.
But you know, some people would consider that too much information like it's kind of decorative whether there's a black square there or not.
The main thing that it does give me is that it's a link.
And I can go there.
Black, square, same page. Link. People with disabilities on the web.
And then it's actually on this page. So if I went and moved by heading.
Introduction. Heading Level 2.
Like that. I just hit the letter H. I got to the introduction.
Most of us can hardly conceive of life without the Internet.
Some have argued that no other single invention has been more revolutionary since Gutenberg's spring press in the 1,400 S.
The world can be at your fingertips at the click of a mouse. If you can use a mouse and see the screen and hear the audio.
Now. I just let that read that whole little thing all at 11, but I could read by word. I could read my character, I could read by a whole lot of different ways. I could do phonetics.
So forth, and so on. That's just a little chunk of text, so you can see what it would be like.
That's important, because when you try to put a message.
Say, an aria. To describe an image, or to give some footnote off screen.
And it's a long. Drawn out piece of stuff.
I have to hear that all at 11. And try to understand it, and put it into context and.
Guess what. I also can't review it. Because it's not visible on the screen anywhere. It's just.
Out there, you know. It's just. Being passed to the screen. Reader, so 11 it's spoken, it's spoken, and I I either have to go and do the action again to make it.
Launch the aria, or I'm out of luck. So remember that when you're trying to use things like aria, because it it can make it more difficult than helpful.
Invention has been more revolutionary since Gutenberg's sprinting press in the 14.th
So I'm gonna go ahead and go back.
Webin be at your fingertips at the click of a mouse if you can use them.
2.
Unknown devant out of mainland. Mark blank. Blank, blank, blank, blank, blank, blank.
Webham web accessibility in my document, resources linked link.
Project, visited link resources visited link. Out of the same page, link skip to main, content.
Heading level. 2 visited same page. Link Graphic web, aim.
I'm gonna go back to their main homepage here.
Web, aim, web, aim, web, accessibility. Enterland Market List with 5 items visited Link.
Alright, so.
Service. Presentation notes dot text notepad press check for all text, which is text that disrupts the images and rapids on the page.
Unique titles for paycheck were all text, which is text at this.
So we looked at the graphics. Let me go back to this. I wanna pick out this.
Web, aim, web, accessibility. No next graphic web. Aim, web accessibility in my graphic visited same page, link heading Level 2.
Graphic. Let's see. So this one is really simple. It's just a graphic for the logo.
Navigating level. 2 visited same page. Andrew has left the meeting.
And that I mean, that's kind of. You don't necessarily have to put alt text.
For your logo. It's not a requirement of Wtag, but it is helpful to people.
If you want them to know. And it's at the top of your page. It's better than hearing graphic or slash.
Right at the top of your page. Cause. They might be trying to make sure they're in the right place by.
You know, hitting the arrow key, or whatever, and.
Having it actually with alt text. Is helpful. So this is an example of a graphic with good art text. It just says exactly what.
The pages.
Same page, link skip to main, content. Heading level, same page, link skip to main content, web, aim, web accessibility, and my graphic visit. Same page link heading Level 2.
And.
Web accessibility in mind, and then it goes ahead and tells me about the visited Skip Link. So.
Navigation line mark, main navigation. Heading level. 2.
That's fine, and there are no other graphics on this. Well, there is a navigation landmark, graphic.
Mainline mark. We have web accessibility in mind. Heading level, one accessibility, training.
Link heading level 2. No. Next graphic.
Let's see, that's it. There's no more graphics on this page. So I'm gonna go to the next.
Presentation Notes Dottex Press.
Thing there. There are things like I mentioned, with the with the little black boxes, that you would not want all text for that are just decorative images.
So I have to check for that. By going to each image.
With my. Hot key, shortcut key, whatever it's G.
In Nvda. It's actually the same key in jaws and.
And then can see. You know. Is there any alt text there, or does it say placeholder, filler, or.
Does it say? Something that's totally nonsensical? And we might see a couple of examples of those here on the Hv. Page in a second.
Is it present? Check for all texts.
3, 43 Pm. Text. Editor: Is it present? Check for all text, which is text that describes the image and rapids on the page. Is it present.
Okay, so I don't want us to run out of time. I could see we're already getting short. So I'm gonna move on.
Check for all text, which is text, that that's right. Is it present? Right? Desorition.
Not for dicker. Keep in mind a descriptions not necessarily most disruptive or accuralike.
Demo. When you load page it will be in browse mode. Demo, navigating graphics and headings. Heading should be semantic and sequential.
Okay. So one of the things we were talking about is heading. Heading should be as much as possible.
There. 1st of all, there should be at least one heading on the pace, so the person can get oriented screen. Readers rely on headings for structure.
They should be used for structure, not style.
I mentioned that at the beginning. So I'm not gonna go any further on that.
They are important. They help us green your user get.
Oriented. They've been around forever. So your older screener and your users are gonna know about them and your newer screen. Your users are gonna know about them.
Landmarks haven't always been available to us, but they are helpful when they're available.
But I wouldn't rely on them in place of screen. Reader, in in place of headings and matter of fact.
I really, I'd say, don't. Just don't. They need to be sequential whenever possible.
They should be sequential. Otherwise the page makes no sense.
Heading should not be based on style. I don't know. You're gonna hate me for saying that over and over, but I see it all the time.
Forms have a labeled it. Heading should be semantic and sequent forms have a label that's bound to the elements form field.
Alright. Get off for that. So.
I'm gonna look at the Hb. Website now, because I think we're gonna get a little more complex with it.
Errors should be spoken. India proper feedback. With him, with accessibility in mind, with aim, with accessibility in mind, Google, Chrome window.
We're gonna try to see some. Ho, some. Forms.
Enter your zip code. Dialogue.
Did I have a question.
Ambrossendorf, his left.
Not.
Mark Boyden: Well, we've got a couple of questions, so that our that some of which will hit a little bit later. But One question was about from the Forum Fields. If there's suggested text in there, will that be read aloud?
Jeanine Lineback: It depends. Okay. So you you can be read, allowed.
Mark Boyden: By the screen. Reader.
Jeanine Lineback: I.
Personally don't like placeholder text. I know some people really do. I do not.
But it can be read aloud. It all depends on how it's coded.
It's not a.
I you know. Without getting into the nitty gritty of things, I would say, the answer is Yes, it can be read aloud. That's a simple answer.
Rennie, Dixon.
Mark Boyde: Okay, yeah. It just needs to be coded correctly and tested.
Jeanine Lineback: I hope that helps.
So this required Blake.
Mark Boyden: Can a blind can a blind auditor test for color contrast issues without sighted assistance?
Jeanine Lineback: Not really to be honest. No. Not not effectively. There are.
Ways to get the screen, reader, to tell you colors, but.
They're not real accurate. You can get the Rbg code sometimes, but the best way is, if you can work.
If you're working with the dev team, the only way for you to test.
The color contrast is not really through testing. It's through saying to the designer.
Who's also on the team. Do you have your design sheets with the color, contrast codes.
Then you can take those codes and go look them all up. There's a there's a website where you can look up. Rbg: Codes.
Once you have those codes, then you could compare probably better than any cited version with the tool.
Because you have the actual numbers from the designer, but it takes a lot more time.
So in the way that you're thinking, not really.
Unfortunately. Screen readers just not good enough on that yet.
Mark Boyden: Thank you, Janine.
Zip, code. Star: Ed: Focus required blank. Dialogue.
Jeanine Lineback: Okay, I'm in a zip code field here.
Dialogue: enter your zoom patent. Dialogue, heading level 4.
And this is actually the bank page.
Select a store. List with 13 items, browse.
No, no, it's not. Alright.
Button Jovi's March upload prices in quality groceries. Google closed Button.
List with 13 items, close button list, with 13 items.
We got some pop up here.
Brows out of list. Heading Level 4. No. Next edit Field Button close.
List with 13 items. Fm. 1960. Smart shop. Out of listless, with 30 out of list button close.
I'm just gonna close it, because I have no idea why it's on that.
Jovis, Marchable Jovis Marcho blopries is clickable. Banner, landmark, button.
Department visited same page. Link Graphic Jovi's logo. Search products, edit.
It took me to.
Jovis, marchable prices and quality groceries, Google, Chrome. Login, button.
The Jodie's smart shop, and La- la, la, la.
Browsing Decadie smart shop list, with 5 items. Listening focus linked. Jim Bower has left the meeting alert. Link.
But again link lists. Out of list, visit at same page. Link graphic showpies, logo.
Alright.
I don't know why it keeps taking me to this.
But link. Listening focus. Linked button search, search products, edit.
Search products added blank.
Alright, now we've got the search products edit. So I'm gonna type in. I don't know soup.
SLUP. Christopher Chao has left a meeting. Search products at it, focused.
Soup clear. Surge input, button.
I can clear the input. I'm tabing now. I'm in what's called edit mode.
Menu. Menu focused.
and it just said, Menu menu focus. Okay. What kind of menu? I have no clue.
I have no idea.
Super region, soup. Onion soup, mix region onion, soup, mix soup, region.
no, I find out it's super agent, but I'm still in edit mode.
Onion soup, mix region onion, soup. Mix. Chicken, noodle, soup region, cream of mushroom soup, region.
Onion soup, mix chicken, noodles, soup.
Cream of mushroom soup, onion, soup, region. Onion, soup, soup, region.
I don't want onion soup.
Soup. Joey's logo, graphic visited same page, link. Departments. Button.
Jovis. Logographic visit at same page. Link.
Anyway, you get the point. It didn't really tell me what kind of menu I was in, so I had to go and look around, down Arrow and.
Llovis Marchabulo, prices and Quality Group.
That's not a good user experience at all.
Jovey's Marchavlop Departments button. Weekly. Add link, search, button.
The part. Now I'm just having departments weekly ads. La la, la, la.
And.
Mainland mark delicious to go. Heading Level. 2 Banner landmark visited same page. Mainland. Mark.
So there's a heading. Let's see if there's a heading level one on this HP. Page.
Delicious to go heading level 2.
no. They start out with a heading level 2.
Search button focused button. Heading levels.
Mark Boyden: Hey, Jeanine, just so. You're aware you're on HEB's page.
You are on.
Jeanine Lineback:Yeah, it's Jodi's smart. It's 1 of their affiliates.
Mark Boyden: Alright, fair enough.
Louis Marcha blow prices in Hollywood.
Jeanine Lineback: Okay.
It's our affiliate store.
Search button focused link view, all link, graphic product, image of Jovey's power. 600. Eat link, button, link, graphic.
If I go back to. To. Let's see.
Let me go over here and get this link, and I'll.
What a Webex certificate of deposit! Vcd. Jovis march Uplo. Prices and quality grows. Representation notes, dot text, Notepad row, one column, 2.
Get over there to just the Hv. Page. Yeah, I realized it went in there. I don't know why it opened it up, but.
Text. Editor, edit focused multi-long error. Forms have a label that's mount. Errors should be spoken and give proper feedback.
It just felt like it, I guess.
Formfield should be Smartchaplo price screen sharing, meeting control. Tools and techniques were blind accessibility. Auditor.
Document, content edited, Multiline. New line, heading to screen readers.
Nvt. Jost, voiced Nula, adding to what is a screen. A screen revisually appeared. Braille instead of a mouse, nula heading 3 key function Readsconhe adapter like new line, heading 2 browsers.
Chrome Browser, by Google, Microsoft. Nula, adding 2 pages, reviewed. Webm. Http. Passworth, Hv. Plus.
Vasrov. Hb. Plus exclamation mark.
Escitibias.
Https source selected equal, selected Google's Ampute equalselected, organic, Select ampersandselect Utm campaign equal, selected G ampers. Utm. Content equal selected 5, 82 cs. New line selected.
Newly unselected, copied selection to clipboard. Presentation Notes dot text Presentation.
Tools and technique, Jovi smart choplo prices and Jovey Smartchablo Jovi's Marchoblo, a.
So we're gonna force it back to.
A unselected Hey.
had.com slash! Master of Hgb. Shopping at best.
Hb's main site. If you look way down at the bottom of the page, the Jodies is Affiliated store, and I don't know why, opened it up their thing, but it did.
Clickable visit. Same page, link, skip, password, page, eb plus.
So, anyway, we're back to Bastrop Hcv, plus. That's where I shop.
Banner Landmark, Hb. Homepage. Link.
Hb. Homepage Link focus linked.
So this is like real life guys. Okay, so we're on the homepage.
Search generated@ev.combo box expanded as autocomplete. Editable search blank.
Now we've got an edit combo box. So that tells me that it's gonna if I type in Superior again.
S o u, e.
It's gonna give me a list of choices. Apparently.
We sitón. Submit, search button in store, app.
Submits a reset button. Search. Hd. Dot Combo boxing List.
but I didn't see any.
Soup, one of 10 soup doublings, 2 of 10.
There we go! Soup, soup, dumplings that worked well. So they did this.
Soup, one of 10 onion soup. Mix 10 of 10.
Very well. So, as you could see after I typed in soup below came a bunch of choices. Then I could just down arrow. So those are things I would want to check as a blind.
Noel has left the meeting. Bob's iphone his. Let.
Auditor, that that actually that function, that it told me that it was a combo box, that it would work.
And it did I could submit the search.
Recipient, submit, search, button.
Instagram shopping at Bastar Bag. Go to cart page.
Link main navigation navigation, like go to shopping at best in store, app.
I'm not going to. I'm let's see, I'm gonna pick one of these soups.
Button, submit, search, button.
Recipient search. Hd. Dot, Combo, box expanded list. Soup, one of 10 soup, doubling soup of 10.
Suki, 3 0 10 soup. Mix war of 10.
Suspiables. 5 0. 10 soup. Mix for search. Hd.com.
Picked soup. Mix.
Unknown. Defaultmix had com document, focus, read only clickable. Banner, Landmark, ag.
I'm gonna try to get through their checkout process real quick. If I can.
Search generated at Combo. Box expanded, has autocomplete.
Search generated@eb.combo box reset button. Submit, search, button in store at submit search, button.
Get through this quick enough.
zubmicshead.com.
Soup mix had.com document focused read-only.
So now we're on the soup. Mix.
Clipbomin landmark suit, mix. Heading level, one.
good! The heading level one worked, and it took me to soup mix. That makes me so happy.
Filter, by. Same page. Link. It's product filters list with 5 items.
I can filter by. And I'm just down arrowing here. But you could.
Lists with 3 items: Link Dilian prepared food. Out of list. Category.
Out of the same page, link, skip to product, grid.
I'm gonna try to, it, says, Skipped product grid. Let's see if that works.
Zoom makes head.com document, focus. Read, old, filtered by same page. Link.
Skip to product. Grid. 44 results. Zoom makes head.com document focused, read only sort by.
good. 44 results.
Combo box collapsed mismatch. But Link Hvv. Onion recipe soup ended. Mix 2 CT. 1 dot.
There we go. Hcb: onion soup mix. I want to see about that.
Button. Add to button, button. Link hvv. Onion with. Add to card.
And.
I can add to cart. Now I'm tabing.
But. At Hb. Frozen vegetable soup mixed to list. Add to cart.
I could down Arrow as well. It did work if I wanted to read the details before I added, it.
But.
HBB. Onion recipe sup end of mix, adjard. But.
My Gb account document, emailed, focus, email, blank.
So I'm gonna add that to my cart. Now it did something. What I it triggered.
My Gb: Account, Google, Chrome.
A pop up, or a dialogue. But it says, my HEB. Account Google Chrome. So I have no idea it triggered this.
Thing, which I'm pretty sure is a pop up, but.
Whatever it triggered it, and it put me in edit mode. I know I need to type something. It did tell me.
To put in my email address, because it wants me to log in.
Email, very focus, email.
Continue. Button, mail it, email. Heading level, one login.
I suspect. Yep, but it did not announce that heading level when it triggered this. It didn't tell me.
That would have been helpful. And that might be a situation where aria would have been useful.
Or to programmatically associate that. Heading level one as well as email, but that might be confusing with the form field, but you could do it. So just saying, there's different ways.
To go about it, but it would have been helpful to know where the heck I went suddenly.
Email blank, JEAI. E.
I'm just gonna go ahead and put my email in here.
E, n, i n.
Am I, and e dot LINE RNBA, CK.
I've had the same email forever. So 99% of the world already knows it.
At GMAI l.com. Continued. But.
And it says, Continue.
And I continued.
My Gb account document focus, read copyright, copyright and clickable, blank, blank, blank, blank copyright mainline. I agree to Hb.
Now. Now wants me to agree to their terms and conditions.
Like terms and conditions, and did not link. Password. Edit protected my Egb account. Google.
And I'm not gonna put my password in here. So.
My Egb account. Choose your oldest item, focus my Egb account document. Sure.
But forgot your password. Terms and conditions, privacy, policy, submit back.
But. My Agb account document focused read-only.
How I'm gonna go back.
Zoom makeshi.com shopping at Basterpage at A. Gb. Onion, Hb. Adjard Adlipton recipe secret Soup, and did mixed beefy onion.
Let me see if it'll add this to the cart without.
Add to card button. My Gb account document. Continue.
I don't think it's gonna let me do it without logging in.
But misty crook create one.
Like.
create one! We'll pretend.
Brain, clickable document focused, readable. Widget containing checkbox terms of service opens. It accounts.head.com slash interaction. Slash. Q. 0 4. Album, bajase qda. Xm H. Slash.
Document link. Privacy policy opens in a new tab.
Now we're in a widget. And it did tell me it was a widget.
That's not typical. I'm glad that it told me.
Jenny Chen has left the meeting alert. Document focus. Read only Outpihashamana is left to meet blank, blank, blank.
accounts.have.com additional widget containing checkbox for H cap. Security, challenge, frame, clickable checkbox, not check sub menu. I am human out of frame.
Which is containing checkbox for Hcapshot security challenge frame clickable. I am human. Select in order to trigger the.
it's a capture. Yeah.
I am human, is now checked. You are verified.
So it's selecting. I'm human. I was hoping I wouldn't have to do that. I did it yesterday, when I was testing this site.
I am human as not checked. My Agb account document focused, read only.
Mainland mark already have an account. Link had 1st name@itfirstst Name Blank.
Chagal has left the meeting alert. Jay.
So. I'm just gonna put Jay for the 1st name.
Lady has left the meeting, alert. Elizabeth Neal has left the meeting alert, mobile number and email edit, email, blank.
Put JL at.
Jail at G. Yeah. Il.
G, m a. I l.
Mobile number edited mobile number, blank.
5, 1, 2. 5, 5, 5, 0, 0, 0, 0.
And I'm I'm intentionally making mistakes here. Y'all.
Terms and conditions, privacy policy, create an account. Button.
And then I'm gonna pick, create, account. See what happens.
Logie dah I created account, but I don't hear anything.
I wonder why? So this is a perfect example.
I agree to Hb. Like terms and. But create a copyright copyright, 2025.
Of where. You're filling on a form. You don't know that you messed up.
Mainland, Mark, graphic.
You submit the form, you still don't know. Messed up. You don't know if you got it right. You don't know if you got it wrong. You don't know if you got it at all.
1st name at it. J. 1st name, your last name must be at least one character.
And I still don't know. I can find it by arrowing down after I picked create account. It says.
1st name, your last name must be at least one character.
Your last name must be at least one character, but it could have given me that information.
Before I created the account, so I didn't have to come back.
Or it could have at least announced when it came back here.
Or flash them up. But the errors existed. It didn't give me anything that is.
When they.
That's a fail. Just plat out. Fail. So that's a really important thing to remember when you're creating your forms to test them with the screen, reader and make sure the screen. Reader knows.
If they need a 5 digit, just just. Zip code, or 9 digit zip code. They have that info. If it has to be a certain format.
If they miss the format they know before they have to submit, or at least 11 they submit, they get the error message. You don't just mark with red lines or red arrows, or whatever they do.
Like red things that. Mean nothing to screen your user.
Make sure it tells them what the problem is.
Alright, I'm gonna try. Since we're here to go, let's see how much time do we have.
At 3 58 Pm.
We're almost at a time. So. I'll tell you how I do the toolbar, the developer toolbar, and if you want to try it, feel free. But it takes a lot of practice. I'll tell you.
So you can use 2 things. One is inspect code, and I do use it. The other is.
Miller. William has left the meeting.
They have to alert Devtools is not to write.
F. 12.
Devtool's document. Recorder Panel Property Page created Recorder Panel Property Page focused.
Says Devtools is doctor right?
Create recording button and customize and control dev tools, button.
Settings. Amanda has left a meeting open, console, interview, button.
Major navigation landmark, more tabs, menu button collapse. Sub menu draw shown.
Open console to view. So.
Tuldroom. Complementary landmark was new panel property page. What's new.
See all new features, cpass highlights from drawn.
Major Bar Navigator Boulevar, open console to view button.
Dro Jean Duldroom. Complementary Landmark. Console panel, property, page agb, account document. You have tools, document.
Okay.
Like tool drove complementary land. Tree code, evaluation as user action, checkbox, check, tree, evaluation as user activation.
Group. Similar messages in console Checkbox Check Group. Similar.
Autocomplete from history, checkbox selected control over hidden.
So I think the easiest way is to go through.
Drojon, tooldrocar.
My Gb account document.
This is why I say it depends on what console you have open last. It may makes it hard.
They have to alert recorder, panel, property. Page focused combo box, unavailable collapse, no recordings but an import recording, but none of it, but not available delete recording, but not available, continue, but not available to delete.
Create recording button import work, send feedback or hidden.
Show shortcuts. Button. Learn more. Link hdtps, slash, developer chrome.com slash recorder.
Create recording button, web, aim, web, accessibility in mind, document.
There we go.
Heading Certificate of Deposit View, CD. Rates and. Devtool's document button.
To a different page.
With him. Webex certificate of deposit. Devtool's document button.
Okay. So we're back in the dev tools document.
Recording Droshone, my Gb account document. Heading level. 2. Link.
I'm gonna do it this way. If you go.
Firstly, Howdy Porte she slash her, has left the meeting alert.
To source.
Emoji. When pains back, gammage, description, inspect. My Gb. Account document 1st name at it, JDOM. T. Levelton, less input auto.
And through, inspect. You get your dom tree view.
Les input autocomplete equals, given in class equals form, control.
Enable flex mode, toggle, button up breast. Ana Gonzalez! She, disable, flexible.
Enable, flex, enable flex mode, toggle, button, not rest.
Enable flex, mode, toggle, button up, rest. Disable, flex, mode, enable, flex mode toggle, enable flex mode, enabled mode toggle, button upright, net, enable, flex, mode, page, dom tree, view.
Janelle has left the meeting less level, none less.
And this is where you would go to your accessibility tree view.
Enable flex mode, toggle, button, uprest, enable, flex mode, toggle, button, uppressed.
Disable, flex mode, enable, flexible, less label class equals false, enable, flex mode, toggle, button up.
Patio entry view, clickable click of a little one, the patio entry view click of a little one.
Lestoctype paint theoeltry view click of a little one.
And then you can just go using your arrow keys down, and this is where I often use the screen.
Tool that I showed you with Mva to capture. So if I want to copy Code from somewhere.
Leslash, the Iv Grater, 3 0. 3 level 9.
Paiseo entry view, clickable click of a little one.
Let's talktalk. Hd.
So you just keep. Whenever you hear a level, you keep hitting your arrow keys to either close the level or open the level, and then if you get as far as you go, you just hit down Arrow.
So Ryan is Trinco.
So that's how you get to the Dom and the code.
And then you can tab through and find the accessibility tree and look at.
You activate that, and then you can look at that here. So.
That's a quickie on that, like real quickie. But it is a little tricky to navigate with a screen. Reader.
And I don't do it. That's not manual testing is my priority.
Drow hin.
That's what I'm here for. I'm not here to sit and look at Code all day. Really.
I get it when I need to do reports.
Drojon.
Alright. Alright, Mark, we're done.
My Gb account document.
And questions.
The Flower Route has.
Mark Boyden: We got a few questions. Most of them are about navigation. That we have left So you've gone through the access and the accessibility tree. Briefly, here.
This one. I think's pretty gonna take you some time. They're asking about tips for navigating the dev's tool area.
Of Mvda, which, is what you kind of just did. A quick highlight on here.
Jeanine Lineback: You basically have to use.
F. 6. To move between the consoles.
F. 12 to get in there and open it up or control shift. I.
See other hot key you can use.
And then you tap around.
In in the area. Now, once you're in the Dom, like I was just a minute ago.
Reading the actual code. You use your up and down arrows in your left and right, and that's where I use the.
The tool for capturing the screen that I mentioned earlier with Nvda. It's in the It's under the Nvda menu under tools.
Because I can't seem to figure out a good way to copy and paste from that. So if I want a piece of code from there to put in a report.
I let the screen capture, grab it. Alright. So that's.
Especially. I can give on that quickly.
Mark Boyden: There was also a question about if Insert F. 7 doesn't work on my laptop, do I need to be in a different mode.
Jeanine Lineback: I would say so. I've not heard of that problem. However, wait, yes, you're on a laptop. If you're in Vda key is set to Caps lock, because you've got your keyboard set to.
Laptop. I guess I should have started by saying, with all that at the beginning.
You can set your keyboard layout to laptop or desktop. It doesn't matter what kind of keyboard you have. You can just tell it what you want in the screen. Reader, preferences.
And when you set it to desktop it automatically, pick, insert, as your.
Your Nvda key. If you set it to laptop, it's gonna automatically pick capslot. Now you can change that. You don't have to leave it the way it sets it, but that's what it'll do by default.
So Capslock F. 7 is probably what you're going to use.
If insert is not working, that's my guess.
Mark Boyden: And then the last question is about some more sessions like this observing other screen readers asking questions in real time, and if there's some of that, so what we will do is we will follow up in our after this recording comes out with, and see if we can find some Resources like that, too.
Work. With that you can continue. Your exploration.
Of this Usage here. So thank you.
Jeanine Lineback: Yeah, I barely touch the surface. So I I don't blame you guys for asking. Thank you guys so much for listening to me. I appreciate it.
Adam Rubirch has left.
Go ahead, mark.
Mark Boyden: Thank you, Janine. I was just gonna tell everybody what's coming up next in November and November 20.th We're going to have an update on WICAG 3 dot o.
And that will be with Rachel Montgomery, who is actively involved with all of that.
We would appreciate you giving feedback on this session. This particular session actually came up because in previous feedback somebody asked for it, so.
Your feedback is very useful to us. I will come back to the slide in a moment.
Coming up in May of 2026 is our John Slaton and AccessU. That's the conference I was telling you about a little bit earlier before we started today. It's May 11.th Through 14. It is the Premier hands on in-depth.
Access digital accessibility training that you need to have. If you're in this world, you can find out more@Knowbility.org, slash AccessU. It is a hybrid event, so it will be online and in person.
If you'd like to stay connected with us, sign up for our newsletter@Knowbility.org slash, subscribe, follow us on social media, at Knowbility.
Or email us, at events@Knowbility.org.
And I'll leave you with this QR. Code and Knowbility.org slash BADA Survey. That's BADA survey.
Which will get you to the survey for us. We truly appreciate your time. We'll be back again next month with.
So more fun digital accessibility. Take care.
Jeanine Lineback: Thanks. Everybody.
Mark Boyden: Thank you. Yes, absolutely.