{"id":67991,"date":"2019-07-11T04:19:16","date_gmt":"2019-07-11T11:19:16","guid":{"rendered":"http:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/"},"modified":"2019-07-11T04:19:16","modified_gmt":"2019-07-11T11:19:16","slug":"ux-improvements-for-keyboard-accessibility","status":"publish","type":"post","link":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/","title":{"rendered":"UX Improvements For Keyboard Accessibility"},"content":{"rendered":"UX Improvements For Keyboard Accessibility<\/title><\/p>\n<article>\n<header>\n<h1>UX Improvements For Keyboard Accessibility<\/h1>\n<address>Vitaly Friedman<\/address>\n<p> <time datetime=\"2019-07-10T16:00:59+02:00\">2019-07-10T16:00:59+02:00<\/time><time datetime=\"2019-07-11T11:07:54+00:00\">2019-07-11T11:07:54+00:00<\/time><\/header>\n<p>How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re all providing an inclusive and accessible experience for our users.<\/p>\n<p>As a part of our <a href=\"https:\/\/smashingmagazine.com\/membership\">Smashing Membership<\/a>, we run Smashing TV, a series of live webinars, every week. No fluff \u2014 just practical, actionable webinars with a live Q&A, run by well-respected practitioners from the industry. Indeed, the <a href=\"https:\/\/www.smashingmagazine.com\/smashing-tv\/\">Smashing TV schedule<\/a> looks pretty dense already, and it\u2019s free for Smashing Members, along with recordings \u2014 <em>obviously<\/em>.<\/p>\n<p>We hope you\u2019ll enjoy the webinar as much as we did!<\/p>\n<figure><figcaption>\u201cUX Optimizations For Keyboard-Only And Assistive Technology Users\u201d with Aaron Pearlman (<a href=\"https:\/\/www.youtube.com\/watch?v=NdWwmMaQCjM\">Watch video on YouTube<\/a>)<\/figcaption><\/figure>\n<p><span>Aaron Pearlman:<\/span> You should be able to see my screen. Okay, right now, let me just\u2026 There we go, very good. Well, hello everybody. Like I said, I am Aaron Pearlman, the Principal User Experience Designer for Deque. And I think\u2014 Uh, let me move\u2014 Zoom tends to put a bit of UI in the way, so I apologize if I look like I\u2019m frantically moving and mouse hopefully it\u2019s not showing up. And so, today we\u2019re going to talk about the types of optimizations that you can make for Keyboard-Only and Assistive Technology users. As I mentioned a moment ago, these type of optimizations, these type of things aren\u2019t going to preclude anyone else from using your\u2026 they\u2019re not going to be unutilized by other people as well. They just tend to be things that are going to be more advantageous to users that dominantly use a system with keyboard Only User Assistive Technology.<\/p>\n<p><span>Aaron Pearlman:<\/span> For those who aren\u2019t familiar with what that means, what a Keyboard-Only User Assistive Technology is\u2014 a keyboard only user would be somebody who just typically uses your keyboard to traverse a system. So they\u2019re going to be using tab and Shift tab a lot and the arrow keys to traverse your system, so focus is quite important to them. You might find this one individual may have motor skill issues, may have vision deficiencies as well, the keyboard-only users, and then assistive technology users also use a keyboard to traverse your system, they may use other assistive technologies as well such as screen meters like VoiceOver or a braille reader or something like that.<\/p>\n<p><span>Aaron Pearlman:<\/span> So, that\u2019s kind of what we\u2019re focusing on \u2014 our users of that nature because a good portion of individuals who have disabilities tend to fall into this camp. That doesn\u2019t mean everybody. Certainly, there are a myriad of different disabilities and gradiations in between, but for the purpose of this, this is what we\u2019re going focus on today.<\/p>\n<p><span>Aaron Pearlman:<\/span> So, a little bit of an overview of what we\u2019re going to cover: we\u2019re going to talk a little bit of design process with plenty of maybe doing a little bit of an exercise type-of-thing that we might go into, maybe not, before we go to the skip links. And then skip links are going to be one of the features that we\u2019re going to cover, ways to optimize your modal, and how to handle focus. So, these are going to be the three big categories that we\u2019re going to cover and then we\u2019ll have time for questions when we\u2019re all done.<\/p>\n<p><span>Aaron Pearlman:<\/span> To start, I thought we could do a little bit of UX design process overview. I was in different workshops and stuff, I find that there a myriad of different individuals that are there from lots of different disciplines, not everybody is a user experience designer, so they may not be as familiar with the process that many UX designers employ. So for this, I thought we would just briefly go over it, we\u2019re not going to spend a tremendous amount of time on it, but I find it merits going over just briefly. Also because it\u2019s going to tie into designing accessibly as well. So, most UX design tends to go through a process called discovery, it\u2019s not always called discovery, sometimes it\u2019s called rapid ideation, rapid iteration. A lot of people have different names for it, but the point is that it\u2019s the part of the design process where a lot of the fabrication happens.<\/p>\n<p><span>Aaron Pearlman:<\/span> It\u2019s a lot of the time where we have also different ideas and requirements gathering, it\u2019s one where a lot of research and synthesizing that with your organizational goals and filtering that with all of that information, and what comes out of it are typically artifacts that allow us to be able to build the system that we\u2019re going to be making or the features that we\u2019re making. Those tend to be \u2014 they\u2019re not always \u2014 but they tend to be things like prototypes, sometimes you\u2019ll see mental models that will come out of them as well. But a prototype in some level of fidelity that is a reflection of how your target user is going to achieve their goals. The TLDR is that reiterate design and we test with users and reiterate, test with users, reiterate, test with users, and then in the end, it ends up going to be built.<\/p>\n<p><span>Aaron Pearlman:<\/span> You think that\u2019s important, is the considerations for accessibility are that we want to be thinking about and doing accessibility throughout that design process. And different levels of fidelity can merit, thinking about different types of things, it really depends. Won\u2019t go into a lot of that, but just in general, we want to incorporate those heuristics and methods, and we\u2019re going to as designers grow our powers of accessibility over time, just as we grow our powers of being a good user experience designer over time. There\u2019s not an expectation in the beginning that you\u2019re going to go and read WCAG 2.1, then you\u2019re going to read the ARIA spec, and then you\u2019re going to be done and you\u2019re not going make any more mistakes, or you\u2019re not going to miss anything when it comes to your designs and designing accessibly. That\u2019s not necessarily reasonable by any stretch of the imagination.<\/p>\n<p><span>Aaron Pearlman:<\/span> Just know that you\u2019re going to be learning over time. Certainly I still mistakes in accessibility, and everything that I work on and it\u2019s just all about getting better. So, [inaudible] because I\u2019m always designing accessibly. So one small plug though it\u2019s relevant to what we\u2019re going to be working on today is called Trane. It\u2019s our fully accessible pattern library at Deque, we use it to build our own products. It\u2019s an HTML, CSS and JavaScript front end framework, it quite similar to Bootstrap, if you\u2019ve ever used anything like that. We also have a react library that\u2019s sister library too as well. Our team develops in react. But we\u2019re going to be looking at a few of the things in here today as examples. But this is open source, it\u2019s available, there will be a link to it at the end of this deck, which I\u2019ll make available to everybody.<\/p>\n<p><span>Aaron Pearlman:<\/span> And it\u2019s free for you to use and get on get branches and use it to your heart\u2019s content or contribute to it, we\u2019d love to see a contribution to it as well. So just a small plug, but we will be referring to it as we go through. So for the first thing that we\u2019re going to look at are skip links. And for those who may not be familiar with what a skip link is, skip links are little links that will tend to show up as the very first tab stop in a web application or website. And what they allow you to do is they allow you to bypass parts of the website. Why would you want to do that?<\/p>\n<p><span>Aaron Pearlman:<\/span> Well, if you have a website that has really rich menu, that may be a big billboard menu or just has a lot of stuffs to it, if you\u2019re a Keyboard Only or Assistive Technology User, when you get to that site and your VoiceOver begins to read off of it, or even not, even, maybe you are a sighted user, you just use your keyboard only, you\u2019re going to have to tab cycle through all of those different items to get down to the contents or to the workspace that you want to begin whatever your activity that you\u2019re doing there is. And so, what a skip link allows you to do is to bypass typically, typically navigation to get to the workspace area of that application.<\/p>\n<p><span>Aaron Pearlman:<\/span> There can be multiple links sometimes and typically only see one, but we have some examples. I\u2019ll show you an example of where you can use multiple skip links as well. So I thought we could look at a couple different types of Skip links or a few different types of skip links, and then we\u2019ll look at another page that doesn\u2019t have a skip link, and maybe talk a little bit about where one might be useful there. The first one we\u2019re going to look at, hopefully you can see my screen. The first one we\u2019re going to look at is this skip link that we use on deque.com and what it is, is what I would call a displacement element in that it displaces the page. So when I tab into here, I can see the skip link is there and it will tell me to skip to content.<\/p>\n<p><span>Aaron Pearlman:<\/span> And when I select that, it will send me to the content below, and I call it displacement because it literally inserts and hides itself and inserts itself into there and displaces it. This was the skip link that we chose to use for our content, but it\u2019s one that\u2019s very common. You\u2019ll see it insert itself at the top of a website or web application. The next one we\u2019re going to look at is one at a site that I\u2019m sure that many of you have used or used quite frequently. It\u2019s Amazon, we\u2019ll look at their skip link. When I tab in there, if you look in the upper left corner there, you\u2019ll see it overlaid, this is an overlay style, this is very, very common where it\u2019ll overlay the content, and so it will often skip whatever\u2019s behind it to show you the skip to main content there.<\/p>\n<p><span>Aaron Pearlman:<\/span> The pros and cons between displacing versus overlaying are negligible. If you find that your content is something that you never want to obfuscate, then you may want to insert something and just use it, displacement one, vice versa, it doesn\u2019t matter, that\u2019s fine as well. If you\u2019re designing content that reads from right to left, like Arabic content, you may put your skip link in the upper right corner, it may merit that. It really comes down to what\u2019s appropriate. But ultimately, that discretion will be to the designer in their team. So, this is an example of two skip links that were a single skip link, and I thought I would show you one where there are multiple options inside the skip link.<\/p>\n<p><span>Aaron Pearlman:<\/span> I\u2019m going to pull up that example, this is from our pattern library. Now for this particular example, I wouldn\u2019t actually design something that had multiple skip links for it because it doesn\u2019t really merit it, but we just did it for the purpose of demonstrating it. So I\u2019m going to tab in and in the upper left corner, we use an overlay that shows you two skip links right here. And these are tab stops inside of here, so if I hit tab again, we\u2019re going to tab into the next one and if I tab away, it\u2019s going to go. If I tab again, it\u2019s going to leave and it\u2019s going to go into the header at the top there. I\u2019m going to shift tab back, shift tab back so that we can see that we can move in and out of here.<\/p>\n<p><span>Aaron Pearlman:<\/span> And then I will go ahead and enter one of these just so that you can see it. And what happens at this point when I select it, it sends me into the workspace area and it actually focuses that workspace area. What you\u2019ll see for a lot of web applications is they don\u2019t actually show the focus itself, we wanted to show that in our applications, this isn\u2019t a focus of elements so to speak, but it is something that can take focus. And then from here, we\u2019re going to focus and then we can go to the different items inside of there that are the focus of all elements that are inside of there, the [inaudible 00:12:28] elements. So, those are examples of a few different ways that you can do skip links.<\/p>\n<p><span>Aaron Pearlman:<\/span> Like I said, there\u2019s an example inside the pattern library, you\u2019re welcome to use it, we also have a version of it as well, I believe here that has errors. We have a single skip link example as well, and you can just use that as well. So we have a couple of different examples here. But those are examples of common ways that you can use skip links. And they are primarily beneficial to individuals that only use their keyboard to traverse the system when they use a system technology as a result of that.<\/p>\n<p><span>Aaron Pearlman:<\/span> But at sometimes, there can be other instances where that a skip link potentially could be beneficial. I\u2019ve seen it can be potentially beneficial. You could imagine an instance where the big workspace of your site maybe it\u2019s a bunch of search results and it does a lazy score where you\u2019ll scroll to the bottom and then it\u2019ll load more results, and scroll to the bottom and it\u2019ll load more results, you scroll to the bottom, and it will load more results.<\/p>\n<p><span>Aaron Pearlman:<\/span> Well, how do you get to the footer? And I\u2019ve had this trouble actually before, where I\u2019ve gone to search engines and I was never able to get to the footer. And what would\u2019ve been nice is the skip link that actually let me skip to the footer, because I was looking for information down in the footer. So there\u2019s ways that skip links can be beneficial to that. It\u2019s not the only way that you can solve that problem. Certainly, you can use hard keys or shortcut menus as well. There are lots of different techniques to accomplish these goals, but that\u2019s the one that skip links tend to be very good at [inaudible 00:14:13]. Some things to keep in mind when designing a skip link is that, typically it\u2019s going to be the very first tab stop on your website web application.<\/p>\n<p><span>Aaron Pearlman:<\/span> And that\u2019s commonly where it\u2019s found, and so if I\u2019m screaming or a keyboard only user, I can get to it immediately. It\u2019s the very first thing I can do when I enter in. So if it\u2019s something that a web app that I use frequently, I can get right to what I\u2019m trying to do. It should also be visually depicted where it is supposed to be in the information, in the AI basically, so you can put skip links and other parts of your application as well, like I could put one here if I wanted to, find a long scrolling stack site and I wanted to do that, and I wanted to have a skip link within something. I\u2019m fairly sure that you can anchor into different things like that, but it should visually be represented where it should be, inside of the application.<\/p>\n<p><span>Aaron Pearlman:<\/span> In general, that\u2019s extremely uncommon. Most skip links are always in the very first tab stops. In general, don\u2019t do that. I think you technically can, but I would say don\u2019t. And then the final thing is it is an interactive element and it\u2019s the past color contrast, so make sure that it does, if you decide to use like an image or something in it, I would, but if you did, it needs to have the proper accessible name along with it as well. In general, most people use texts and links, so it\u2019s going to be marked up as a link. Just make sure that it is passing color contrast so that it [inaudible 00:16:07]. Very good. So that\u2019s kind of all we have for skip links.<\/p>\n<p><span>Aaron Pearlman:<\/span> It\u2019s a fairly succinct but very common pattern that you see everywhere and it\u2019s something that you can add fairly, it\u2019s a fairly straight forward to add to your web application, but it can make a big difference for individuals who use their keyboard or system technology. So let me go ahead and close this and let\u2019s move on to modal optimizations. Chose to do this because modals are very, very, very, very common amongst most web apps and they come in a lot of different forums, a lot of different ways that modals are shaped and created.<\/p>\n<p><span>Aaron Pearlman:<\/span> But some common things that I see that show up in more of the things that we can correct, until there\u2019s some optimizations that we can do to make it a better experience for keyboard-Only and Assistive Technology users. And in general, I think your modal are much better one. One thing I thought I would show here really quickly is, one important thing that a Modal needs to do is it needs to be able to trap focus inside of it. I wanted to show an example of \u2026 it\u2019s right here. I love dribble by the way, so this is not a dig against them. This is probably just a small oversight here. I used them all of the time as a delightful site and has wonderful stuff on it.<\/p>\n<p><span>Aaron Pearlman:<\/span> So if I were to hit the sign in, oops, I\u2019m sorry, the sign up. Here\u2019s a modal here and something that can happen sometimes. If you notice carefully, I\u2019m hitting tab, tab, tab, tab, tab. As you can see behind the screen, it\u2019s a little bit difficult to see. You can see focus hasn\u2019t quite been trapped inside the Modal and this can happen sometimes. So if I was a user who\u2019s using Assistive technology or a Keyboard-Only, it would be very difficult for me to get back to this.<\/p>\n<p><span>Aaron Pearlman:<\/span> It\u2019s something that happens very, very, very, very commonly, and it certainly can happen when you\u2019re inserting different interesting things into Modal. So something we want to make sure of, and the reason I\u2019m bringing that up, the reason that\u2019s actually very, very important is when a modal is evoked, it needs to sort of announce itself to the individual that evoked it, know what they basically just opened, but they actually opened the correct thing.<\/p>\n<p><span>Aaron Pearlman:<\/span> And so, the way that it can announce itself is that, either the body of the modal needs to be focused or potentially the header of the modal can be focused so that we can tell the individual that\u2019s evoking the modal, that it is what\u2019s happening. So if they have voice, they\u2019re using for example, VoiceOver on it, it\u2019ll tell them what they\u2019re looking at. So I thought I\u2019d give a couple examples of ways that the body can be focused and then an example of how model can focus the header instead and then what we can do with that.<\/p>\n<p><span>Aaron Pearlman:<\/span> I\u2019m going to open up this really quick here. Very good. And so the modal that they have for this, I think it\u2019s a clothing site right here. And what happened is it focused the body and I can show that best by\u2026 I\u2019m going to turn on VoiceOver really quick. I\u2019m going to pull it up.<\/p>\n<p><span>VoiceOver:<\/span> VoiceOver on Chrome.] Bonobos, [inaudible 00:20:10]-<\/p>\n<p><span>Aaron Pearlman:<\/span> And you won\u2019t be able to hear it-<\/p>\n<p><span>VoiceOver:<\/span> Google Chrome, Aaron.pearlman@deque.com-<\/p>\n<p><span>Aaron Pearlman:<\/span> But you\u2019ll be able to see it.<\/p>\n<p><span>VoiceOver:<\/span> Close the card, your card is empty, group has keyboard focus. You\u2019re currently on the group in opening your card, close the card, your card is empty group. You\u2019re currently on the group inside of web content, VoiceOver off.<\/p>\n<p><span>Aaron Pearlman:<\/span> So right there when I focused it, it read out a bit of everything that was going on your card closed and your card is empty because of the buying was focused at that point. And that\u2019s perfectly valid. That\u2019s a perfectly valid way of focusing your modals. It\u2019s not a problem at all. And then from there you can tab cycle through everything that\u2019s inside of it. Another common way of when a modal is evoked is to focus the header.<\/p>\n<p><span>Aaron Pearlman:<\/span> And that\u2019s what we do in on the modals that we use for our applications is we focus the header. So I\u2019m going to evoke the modal, and as you can see right here, focus is right here where it says modal with form, focus is right there on the header. We actually, rather than indicating that as like an index, we programmatically focus that. And the reason that we programmatically focus that as I tab cycle through here, it\u2019s now going to the close button, also in the header, then to the first interactive element, which is field to the next field, to the next field, to the next fields, tabbing again to the save, tabbing again to the cancel.<\/p>\n<p><span>Aaron Pearlman:<\/span> And from here when I hit tab, if that header was a tab stop, it would go there, but we chose not to do that. Instead, we go to the close and the reason that we do that is just if somebody was using Voice Over as you may have seen some of what was being written and was going into my ears at the same time, it was actually very a bit distracting because it speaks very quickly, it\u2019s a bit chattery. And so one of the optimizations that we wanted to make for the experience here was to make it a little less chattery. So yes, we announce it, it goes, we programmatically focus modal with form when they first get there, so that it lets them know that the modal that they evoked is in fact it\u2019s what they\u2019re currently focused on.<\/p>\n<p><span>Aaron Pearlman:<\/span> But we don\u2019t need to announce it again and again and again if they were to cycle through this shifts cycling through this modal. So it\u2019s a small optimization likely would be completely invisible to the majority of your cited mouse only users. But that small optimization, you can imagine if I used modals a lot for filling out forms frequently and I was a user that used Keyboard-Only or Assistive Technology that optimization would add up over time. So, little teeny user experience things that we can do, that can make a significant difference overall in the care that we can put into our designs, so that they\u2019re the most often experience that we can provide.<\/p>\n<p><span>Aaron Pearlman:<\/span> Speaking of handling focus, the last one that we are going to go into is focus handling itself. And we saw one example of it, what can happen if focus can get lost in certain types of handling? But rather than being just something that can be a significant issue, the way that you handle focus can change significantly the experience that an individual would have. Really the rule about handling focus, especially with the two instances that we\u2019re going to look at right now, which are, removing and adding elements to your work space or whatever you\u2019re working in is that \u2026 It can definitely change how somebody interacts with it. And so we want to make it follow the expected experience that you would have for somebody who is a Mouse-Only user or a sighted user, a Mouse-Only user I should say.<\/p>\n<p><span>Aaron Pearlman:<\/span> In this instance we\u2019re going to look at \u2026 for here we\u2019re going to look at \u2026 Okay, let me drag it over. Hold on one second. I\u2019m going to have to take this out of here temporarily. There we go. So you shouldn\u2019t be able to see an example of a modal that I\u2019ve designed, it\u2019s actually a single modal, we have two kind of images of it and just one is just showing what\u2019s below the fold there rather than making one really, really wrong or I just split it up so you could see what was below in fold. And on the right side, if you look, there\u2019s a trashcan icon that is currently being focused. And so when we click on that trash can icon, assuming that there isn\u2019t a dialogue that says, \u201cAre you sure you want to delete it?\u201d<\/p>\n<p><span>Aaron Pearlman:<\/span> Let\u2019s just assume that that\u2019s not the case. The real question then goes, what happens with focus there? Because when that trash can icon is hit or is selected, it is going to remove instructions that are in right here, and it\u2019s also going to remove itself. So where does focus go? So we as designers, we want to choose where focus goes because otherwise the browsers going to choose for focus goes if you\u2019re making a web application inside of a web application and we don\u2019t want the browser to choose where focus goes because it tends to throw things to the body. So in this case, where we really want focus to go is we want focus to go to the next focusible element, not necessarily the \u2026 what I would call the analog to that, which will be focusing the next trash can, the trash can for instructions to instead we focus instructions to itself.<\/p>\n<p><span>Aaron Pearlman:<\/span> And the reason we would want to do that, is you can imagine if somebody accidentally hit, using their keyboard only they hit return, then they hit return again. It would have just deleted two sets of instructions instead of one. And we would want to, we prevent that for a mouse only user by literally having those things physically far apart. But we want to also be able to prevent that because focus is what they\u2019re using to traverse this. So I thought I\u2019d show another example of what do we do when we\u2019re deleting the last item in entire section here.<\/p>\n<p><span>Aaron Pearlman:<\/span> Now we\u2019ve got cooking instructions, the final instruction for instruction one, where does focus goes here? Now for this particular one, it\u2019s going to follow suit with what the previous one was, which is it\u2019s going to go actually up to the next focus but filled again, which is ingredient one for the same reason that we wouldn\u2019t want to throw it to the trashcan again because then if somebody again hit select again or hit return again, we would be \u2026 They\u2019d accidentally delete two things that they unintended, didn\u2019t want to.<\/p>\n<p><span>Aaron Pearlman:<\/span> For the same reason, we wouldn\u2019t necessarily want to throw that to one of these links here because we would have the opposite problem where they\u2019d be accidentally adding things as well. And we don\u2019t necessarily want it to go to the body, because we go to the body and your Voice Over user, your Assistant Technology user, is just going to start chattering about the modal again or rather than letting you continue to interact and do what you intended to do.<\/p>\n<p><span>Aaron Pearlman:<\/span> And then finally, the final example that I have here is what do we do when we\u2019re going to remove the last item in this case, in the modal here, there\u2019s nothing left. Where would I send it? And this is definitely up to the discretion of the designers to where it should go. There\u2019s no, it\u2019s not going to be inaccessible if you choose to send it to the clothes or send to focus maybe to the cancel. It doesn\u2019t necessarily make it inaccessible, it\u2019s just that, it really comes down to what would you expect? What information would you want to convey? What narrative do you want to convey to that user and where we choose to send it as we choose to send it back to the header to let the user know that they\u2019re still on the modal, they\u2019re still there, we haven\u2019t closed it on them, for example there.<\/p>\n<p><span>Aaron Pearlman:<\/span> And so that\u2019s actually a programmatic shift because like I said, it\u2019s not terrible voice. It\u2019s not as terrible focusible element like that. So we programmatically shift focus to that in this particular example. So those are some nice examples of what to do maybe with focus when you\u2019re removing items. So I thought you could \u2026 I would show an example of what you do when you\u2019re adding an item. So I\u2019ve got example of that real quick here for focus retention.<\/p>\n<p><span>Aaron Pearlman:<\/span> And right here, we\u2019re going to hit this add another \u2026 you can just focus here, add another ingredient and focus then shifts to the actual ingredient in this case, the field that you added for two reasons, one, because the assumption is by adding that next field that we wanted to interact with it and that would be the expected behavior if I was a Mouse-Only user, I\u2019d be adding that presumably so that I could actually begin to type text into it.<\/p>\n<p><span>Aaron Pearlman:<\/span> And then again, we wouldn\u2019t necessarily want to keep focus on another ingredient for the same reason that if they hit return again, we wouldn\u2019t want to add two ingredients instead of one. It should be opposite problem of the previous example. And the final, the final example I wanted to show, because I think it might be worthwhile showing is \u2026 actually I have that example, I may pull that up in a little bit. But I can describe it pretty, pretty aptly in that, if you have what do you do when you evoke a modal? For example, you saved something, the modal goes away, where does focus now go and what we tend to do, but the rule of thumb on that is that you want to send it back to whatever element [inaudible 00:31:03] gets.<\/p>\n<p><span>Aaron Pearlman:<\/span> So if you imagine if you had a little edit pencil and you select it, opens up the modal, you fill out that modal, you hit save, you\u2019d want to send focus back to that interactive element that tends to be \u2026 or we do. There may be instances where you want to send it somewhere else. If it\u2019s a wizard and it goes somewhere else after that, again to the discretion of the designer, to what the narrative that you\u2019re trying to tell us to where to go. But for things that are like the one \u2026 instance that I just described, which is very common. You evoke a modal, or you do something with it and it gets dismissed as a result of that and the context doesn\u2019t necessarily change.<\/p>\n<p><span>Aaron Pearlman:<\/span> And you don\u2019t want to send that focus back to where it was. And the reason for doing that is so that, a Keyboard-Only or Assistive Technology user can pick back up with where they are. Because remember they\u2019re in that space and that space is somewhat linear as to how they traverse and especially when you\u2019re using town to get through everything. So, I think we\u2019re just about at 40 minutes, we just about at time for all the examples and things that I had. So I\u2019m going to pass it back over to Scott.<\/p>\n<p><span>Scott:<\/span> Thanks Aaron. That was pretty awesome, and we do have a lot of questions from the attendee as well as a few from individually who couldn\u2019t make it today because he\u2019s traveling. So Poan who\u2019s a regular attendee of our webinars asks, \u201cWhen you\u2019re removing items, shouldn\u2019t we have an acknowledgement of the action and move the focus there and then move to the next element?\u201d<\/p>\n<p><span>Aaron Pearlman:<\/span> when removing an item, should you have an \u2026 are you referring to like a notice like a toast or are you saying should you have a live region that is letting you know what\u2019s happening? If you\u2019re shifting focus to remove an item, like the ones that I just showed in that particular instance the evocation of that delete for example, should be adequate enough to let them know that they in fact deleted.<\/p>\n<p><span>Aaron Pearlman:<\/span> It should be gone. Also, if they\u2019re using Voice Over, it\u2019s going to pick that up as well. If you\u2019re interacting with something and it\u2019s making changes somewhere else, for example, like you did something and then it changed some metrics somewhere for example, you\u2019re probably going to want to use a live region that does something politely to let them know that that\u2019s happened. That\u2019s something that\u2019s sort of out of the purview of where you\u2019re working in specifically. I hope that answers your question. It might be diving into something that\u2019s a little bit more technical. I may need to follow up a little bit more with some of it, if we\u2019re going to get into deep technical implementation stuff.<\/p>\n<p><span>Scott:<\/span> Perfect.<\/p>\n<p><span>Aaron Pearlman:<\/span> My developer, so they don\u2019t steer you arrive but in general that tends to be the case. The example that I showed should be adequate. If you want it to because it\u2019s a delete, you could have an interim part where you throw an alert and say, \u201cAre you sure you want him to delete this?\u201d Which case you\u2019re just reinforcing it further what happening.<\/p>\n<p><span>Scott:<\/span> Great. So, yeah, try and keep the questions user experience focused. So from a user experience standpoint, how would you manage focus for notification messages?<\/p>\n<p><span>Aaron Pearlman:<\/span> Focus for a notification? I can show you one if you\u2019d like to see.<\/p>\n<p><span>Scott:<\/span> Sure.<\/p>\n<p><span>Aaron Pearlman:<\/span> We can pick back random because we happen to have toasts, which are notifications. So I\u2019m going to open up toasts here. So this is actually being focused right now. This toast is evoked and it is being focused right now and you can actually, as you can see, you can tab into the clause right here. So, it depends. So, if I finished something and I wanted to notify them that it\u2019s been finished and I toasted it, then I want to focus it so that they can see that it\u2019s been \u2026 that I\u2019m communicating that information to them. So you want to shift focus to it.<\/p>\n<p><span>Scott:<\/span> Melanie is asking, \u201cDo you have any tips for tips or resources for navigating slideshows?\u201d<\/p>\n<p><span>Aaron Pearlman:<\/span> For navigating slideshows?<\/p>\n<p><span>Scott:<\/span> [crosstalk 00:36:00]. Very specific.<\/p>\n<p><span>Aaron Pearlman:<\/span> Yes. So navigating slideshows. We don\u2019t use them very often, so I\u2019m going to answer this as best as I can. So one slideshows especially ones that are like carousels, they need to have a control so that you can stop them. I think that\u2019s an accessibility need, is that they have to have some control and a mechanism so that they can be stopped. Anything that\u2019s an animation wise can\u2019t animate for more than five seconds at a time and then the animation has to stop.<\/p>\n<p><span>Aaron Pearlman:<\/span> That may not be relevant to what you\u2019re doing, but it is moving. And those controls then need to be focusable most carousels have \u2026 A lot of fancy new ones. we\u2019ll have menus that can come up when they get hovered over or focused on, just consider that all those controls need to be traversable, and then their very image heavy. A lot of carousels and slideshows need to be, so that you\u2019re going to need to have proper alternative texts on them. Just the things that you would expect.<\/p>\n<p><span>Aaron Pearlman:<\/span> Off the top of my head, I don\u2019t know of any fully accessible carousel that I can think of. But let me see if I can find a better example and I will try and pass it along through smashing and have that available if I can find it. It\u2019s a great question because they come up a lot. I ended up tending to solve that problem in a slightly different way because I think they\u2019re tricky, but that doesn\u2019t mean that they can\u2019t be done.<\/p>\n<p><span>Scott:<\/span> Rebecca is asking, \u201cCan you give a use case for skip links?\u201d And then similar early related, Patricia\u2019s asking, \u201cDo you know how to solve the issue with skip links in Safari plus the VoiceOver?\u201d [crosstalk 00:38:18]. Again, maybe more technical than user experience related.<\/p>\n<p><span>Aaron Pearlman:<\/span> Yes. The second one, I\u2019m not entirely sure what actually is going on that, that there may be an issue there. Again, I can try and see if that\u2019s something that our developers have encountered before and how they\u2019ve gotten around it. So we\u2019ll make a note of that and I\u2019ll try and circle back. But for the first one what\u2019s a use case for Skip links? I want to avoid giant banner menus and I want to get straight to a sale that I heard that there is today and I don\u2019t want to have to do that.<\/p>\n<p><span>Aaron Pearlman:<\/span> If I was a sighted a mouse only user, I would just visually ignore it and then go move my mouse over and just click on the sale item. If I\u2019m a keyboard only ora assisted technology user, I would have to tab through all of that menu, potentially bunch of banner items as well before I could finally get to the workspace. that has maybe the sale items. So that would be a great use for a Skip link to get right to the content. Skip to main content is a phrase you see very, very common. Skip to main content.<\/p>\n<p><span>Scott:<\/span> Okay. That\u2019s a good, good point. And I think in terms of all the user related questions from the attendees that covers them. We do have some general questions that we like to ask. So, low hanging fruit for people that are trying to build an accessible website. If somebody wants to put together a site in a few hours and make sure it\u2019s accessible, what are some the easy things that just they can check off the list right away.<\/p>\n<p><span>Aaron Pearlman:<\/span> Sure. So some things that you can do immediately with any site or application that you\u2019re working on, you can review your font choices for things like color contrast, there are plenty of color, if you put in color contrast, selector, picker or something like that, you\u2019ll get it and you\u2019ll just put it in the Hex value or the RGB value of what your font is and then what the background, whatever element the background color is sitting on and make sure that it\u2019s meeting at 4.5 to one.<\/p>\n<p><span>Aaron Pearlman:<\/span> So that\u2019s one that you can do immediately. Check your color Palette, you want to do color contrast where I see that color contrast fails a lot is when people use the endless shades of gray to have various levels of first class, second class, third class elements and things like that. Just make sure that if it\u2019s an interactive element that it\u2019s a passing color contrast.<\/p>\n<p><span>Aaron Pearlman:<\/span> Another thing, check your the images that are important, that are non decorative images. Make sure that they have all texts. Just one that you can add immediately. And then check your review, your heading structure, make sure that your h1 tags, h2 tags, h3 tags, h4 tags and so on. They all make sense with the structure of it and make sure that the content is properly paired with those heading tags.<\/p>\n<p><span>Aaron Pearlman:<\/span> That\u2019s things that you can do immediately. And then also you can just, this is a small blog but you can download AX, that\u2019s our accessibility engine. It\u2019s totally free. It\u2019s a little extension for chrome and Firefox and just hit the run button and see what you find. It\u2019s a lot of things that you can help alleviate immediately or change immediately. You can also turn on VoiceOver, for example, if you\u2019re on a Mac and start to go through your site and see what it sounds like for somebody who uses just a technology. It\u2019s a great thing that we can do immediately.<\/p>\n<p><span>Scott:<\/span> Okay. Janat, has a question here. So what is it about accessibility that interests you and how did you know you\u2019ve been doing design and UX for so long, but you\u2019ve only been doing accessibility for smaller period of time, so that catch your attention?<\/p>\n<p><span>Aaron Pearlman:<\/span> It had been something that had been on the purview of some of the design that I had done in a later part of my design career till I got here. In my design career, I\u2019ve always wanted to work on things that I felt in some way tried to make the world a slightly better place and I felt that working. And accessibility was one way to make \u2026 Very much believe in the core value of universal design or more importantly adapted design. Design that adapts itself to two different types of individuals to provide what we call GQ like digital equality. We want everyone to be able to use everything as best as we can possibly provide that universal experience that we can have. I don\u2019t know as a person that very much appeals to me. And so it was just a good fit to learn design. That\u2019s really cool.<\/p>\n<p><span>Aaron Pearlman:<\/span> Designing accessibly is a one way street. Like once you start to design accessible, you never don\u2019t not design accessible anymore. It\u2019s like UX designers don\u2019t design unless you\u2019re being tongue in cheek, you\u2019re not going to design something to have a really poor user experience. It\u2019s going to be part of your vernacular from that point forward. And once you begin to design accessibly, it never goes away. I can\u2019t like not think about accessibility as I do designing and that\u2019s a really, really cool thing.<\/p>\n<p><span>Aaron Pearlman:<\/span> It also affords you to start to think about things that you didn\u2019t think you had access to. Like, did you know that your focus on your page, you can design focus to look differently for different elements on the page? That blew my mind when I found that out and I thought that was so cool that gave me a little bit more control, I knew you could create really cool Hover States, but I didn\u2019t know focus was a state that you had full control over as well.<\/p>\n<p><span>Scott:<\/span> Our industry there\u2019s always a new trend that\u2019s just kind of how it goes, that\u2019s the web. Are there any design trends right now that you know that are inhibiting accessibility? And if so, is there any recommendations you can make to avoid that?<\/p>\n<p><span>Aaron Pearlman:<\/span> I don\u2019t know if there\u2019s anything that\u2019s super trendy right now when I look at different sites and web applications that couldn\u2019t be designed excessively. I think there are pitfalls that that we\u2019ve been falling into longer than any one trend as existed or at least has existed for some time. I just mentioned one, what I call the endless shades of gray. That\u2019s one. In general, just being mindful of the contrast for your text. It is rampant.<\/p>\n<p><span>Aaron Pearlman:<\/span> It is by an order of magnitude, the most accessibility issues, if you were to like run an engine against it, like AX, it\u2019ll be color contrast almost always. So just being really, really, really mindful of that regardless of where your text is on the page. Again, I mentioned it again, just being careful with your images. If you have an image that\u2019s conveying important information to a sited user, that information needs to be conveyed to the user. That is user as well.<\/p>\n<p><span>Aaron Pearlman:<\/span> And what I mean by information that\u2019s conveyed is if what\u2019s being conveyed is that the person is doing something that\u2019s, you wouldn\u2019t necessarily describe it as a man standing. It could be that they\u2019re playing baseball. Maybe that\u2019s the important part. So make sure that the, that the, the alternative text matches with the intended information that\u2019s trying to be conveyed, received out a lot too. Even when all texts is there, it just doesn\u2019t accurately describe what is trying to be portrayed.<\/p>\n<p><span>Aaron Pearlman:<\/span> And then the other one too is progressive disclosure menus, many times you see on Hover Menus and stuff like that. They don\u2019t do a great job of being evoked on focus as well. And they don\u2019t always do a good job of \u2026 So that is a trend I do see. I do see a lot of menus coming up on Hover, when you hover over something you get the secondary menu that was hidden before that now finds itself to the front.<\/p>\n<p><span>Aaron Pearlman:<\/span> Also making that be able to Hover or a mechanism that allows you to evoke it and that will properly capture focus inside there so that you can use it. Those are a few things off the top of my head that I can say I would see a lot.<\/p>\n<p><span>Aaron Pearlman:<\/span> So as a graphic designer, you obviously work with development teams and a lot of the times when we\u2019re doing wireframes and design of the onset of the project, they\u2019re inherently not inaccessible. It doesn\u2019t really become an issue, it seems until it comes to the development stage and people start taking that design and turning it into code. So how do you work with developers to make sure that the design that is being made from the start is going to be accessible when they\u2019re done with it. Do you do audits throughout the process, at the end of the process? Like what\u2019s the workflow with developers?<\/p>\n<p><span>Aaron Pearlman:<\/span> Sure. So the workflow for our development team is going to be, I think somewhat similar to a lot of other organizations. We work in scrum, so we work in sprints and scrum and I\u2019ll go through a discovery process. They\u2019re going to be privy to that, they\u2019re not going to see it when the design is fully finished.<\/p>\n<p><span>Aaron Pearlman:<\/span> They\u2019re going to see it throughout the design. I\u2019ll have opportunities to talk with them a little bit about what the intent of the design is. They will probably set in on some of the user research that I\u2019ve done, some of these ability testing that I\u2019ve done. So, hopefully at that point nothing\u2019s really new to them that I\u2019m not going to get any 11th hour that we can\u2019t even do this thing. I still have to deal with all the other things outside of accessibility that every other designer has to deal with, like is this feasible? Is it valuable? Is it all of those things that we have to deal with.<\/p>\n<p><span>Aaron Pearlman:<\/span> With regards specifically to accessibility, sometimes I will annotate the designs in a particular way that will indicate where tab focus should go. At the end of the slide deck that I have, there\u2019s a great resource that one of the designers from Adobe put together. I know there\u2019s like a pdf, there may be. There\u2019s like a sketch file as well in there, there may be an XD file as well.<\/p>\n<p><span>Aaron Pearlman:<\/span> I don\u2019t think, maybe just sketch. But it shows you like all of these different ways that you can annotate things like, accessible names, tab order and basically are little objects that you can place on your design to indicate some of those things as you go through. It\u2019s a really, really wonderful resource. It\u2019s all included in here as well. That\u2019s a great way of saying, \u201cHere\u2019s part of my prototype and here\u2019s the expected tab, order for it.\u201d So that you have that as part of your artifact as part of the digital documentation or annotation that goes along with it.<\/p>\n<p><span>Aaron Pearlman:<\/span> So that\u2019s one thing that we do is I annotate my designs pretty heavily. Everything from the size of how certain things are supposed to be to the Hex codes or RGBA values for what\u2019s supposed to look like and feel like. But then also, there are accessibility annotations that you can add to it too.<\/p>\n<p><span>Aaron Pearlman:<\/span> And then just communicating, looking through the builds as they go through, making sure things like if you made any custom focuses that those custom focuses, look great, check the color contrast, make sure that it\u2019s coming through, that the font choices that you\u2019ve had there are some fonts that when their weight is higher and they\u2019re bigger. Their color contrast it doesn\u2019t have to be a 4.5. It can actually be a little bit lower, but you just going to want to just keep an eye on those things. Just as you would keep an eye on the experience stuff as well. You\u2019re going to want to keep an eye on that stuff that you\u2019ve been mindful for and annotated in your designs.<\/p>\n<p><span>Scott:<\/span> So we have a couple minutes left here. So I\u2019ll ask one more question. Some people feel accessibility can stifle creativity throughout the design process. Is that something that you\u2019ve come across? How do you think creativity fits into accessible design?<\/p>\n<p><span>Aaron Pearlman:<\/span> Sure. That was one of my initial reactions to having to design accessibly, was that somebody basically put the handcuffs on me and says, \u201cThere\u2019s a much smaller box you have to be able to work in.\u201d It\u2019s true that designing accessibly means that there can be some more challenges because there\u2019s more rules that you have to follow. But in the end, I found that the experience ends up being better and I haven\u2019t \u2026 Once I removed that misnomer and began to do more and more accessible designs that were WCAG 2.0 AA accessible, I noticed that I can pretty much do everything that I wanted to do.<\/p>\n<p><span>Aaron Pearlman:<\/span> I would just need to sometimes express or solve problems in a slightly different way than I did before. I think a lot of people when they think about designing accessibly \u2026 I\u2019ll give you a very specific example. When they think about designing accessibility they think, \u201cOh, well, I can\u2019t do all of these fancy visualizations, for example. I\u2019m not going to be able to do all of those things because they\u2019re not going to be accessible, because if an individual can\u2019t see them, I\u2019m not going to be able to do that.\u201d<\/p>\n<p><span>Aaron Pearlman:<\/span> I was designing a visualization that was just basic, just sort of line graph and under those, there was a line graph, on the x axis there was I think it was time and on the y axis it was usage or something like that. And there was this nice little gradient that went down from it and there was sort of these light lines that went behind it to delineate the months and time. And when I talked with one of my subject matter experts about making it accessible, it turned out I was sure he was just going to be like, \u201cNope.\u201d But he said that there was actually just a few things that I needed to do to make this really nice looking graph accessible. One, that line at the top it need to pass color contrast because that\u2019s actually what\u2019s conveying the information of the trend over time.<\/p>\n<p><span>Aaron Pearlman:<\/span> The gradiated stuff underneath it\u2019s just decoration and as long as it\u2019s not interrupting the passing of color contrast of that and the y and x axis lines and ended up being okay. Those lines behind it were okay, but I ended up adding tick marks at the bottom there to indicate that. And then when I hovered and focused over, because sometimes you can hover over and it\u2019ll add a dot to part of the line graph, just making sure that the dot itself would pass color. contrast. I did that by doing the sort of donut thing where you put a white dot with another dot or I should say has it like a large stroke on the outside of it as well.<\/p>\n<p><span>Aaron Pearlman:<\/span> And then I added a little bit of treatment in there that would bring the those lines that were faded back forward. And it all pass color contrast and ended up being fine. It was really pretty visualizations that passed. Now granted, I\u2019m not getting into all of the accessible name stuff and being able to do that. Many libraries are on that. Put that aside, at least we call a contrast because is where I think a lot of designers struggle with. You can do it.<\/p>\n<p><span>Aaron Pearlman:<\/span> It\u2019s just about being really mindful about those types of things, and getting more examples and just trying and trying different things, and having other people that you can pitch those ideas with and bounce them back and forth and checking again, just really do that. I don\u2019t think it really inhibits anything. It just makes you have to think a little bit more clearer about how you\u2019re going to do it and making sure that you\u2019re looking through the lens of how an individual engaged with this if they had low vision, or if they couldn\u2019t see it at all or couldn\u2019t hear if you\u2019re building a media application.<\/p>\n<p><span>Scott:<\/span> One more question, but I think we should\u2019ve touched upon it. What stage in your process do you start thinking about accessibility? I\u2019m going to assume throughout the whole process.<\/p>\n<p><span>Aaron Pearlman:<\/span> Yeah, it is throughout the whole process. I\u2019ll be a little bit more rather than \u2026 I know who I say that and it sounds a little flippant. So, early on when you\u2019re doing things like low fidelity prototyping, you\u2019re going to be thinking about things like some tab order stuff. You\u2019re going to be thinking about maybe headings and structure, things like that. Those are the type of accessibility stuff that you think about. Later on as it gets higher in fidelity, you\u2019re going to be thinking about things more like, colors and your pallets that you\u2019ve chosen, maybe accessible names, alternative text for anything that may merit that, you may be thinking about, if you\u2019re doing any custom focuses, for example, that\u2019s probably where you\u2019re going to start to think about that.<\/p>\n<p><span>Aaron Pearlman:<\/span> It doesn\u2019t mean that you couldn\u2019t think about it when you\u2019re doing low fidelity just means in general, when I go through my process those things tend to fall into those categories. You\u2019re thinking about accessibility the whole time, but you\u2019re not always thinking about everything with it as you\u2019re in lower fidelity stuff, and you\u2019re ideating, and you\u2019re just thinking about ideas, and you\u2019re just working through ideas, let that creative stuff go through as you become more attuned to accessibility, it will just sort of intrinsically make its way in and there\u2019ll be less of a conscious thing.<\/p>\n<p><span>Scott:<\/span> Yeah. Fair enough. Well, on that note, we\u2019ve run out of time, Aaron. Thank you very much for your time and\u2014<\/p>\n<p><span>Aaron Pearlman:<\/span> That was great. I\u2019ve had a wonderful time.<\/p>\n<p><span>Scott:<\/span> You\u2019re going to be at the next couple of Smashing conferences, I think.<\/p>\n<p><span>Aaron Pearlman:<\/span> I will be at the one in New York. I\u2019ll be at the one in New York.<\/p>\n<p><span>Scott:<\/span> Okay. And are you guys doing a workshop there?<\/p>\n<p><span>Aaron Pearlman:<\/span> Yes, we\u2019re.<\/p>\n<p><span>Scott:<\/span> Okay. Awesome. Well thank you again for your time and just to let see the members that are still watching, we\u2019ve two webinars next week. The first one is the Power of Digital People, with Kristina Podnar. And then we have a number three in our series with Andrew Clarke, Inspired Designs Decisions, number three inspired by Ernest Joural. Thank you very much everybody for attending today. And again, this recording will be available in dispatching membership panel once we\u2019re done editing it and we hope to see you all next week. So thanks again Erin.<\/p>\n<h3>That\u2019s A Wrap!<\/h3>\n<p>We kindly thank Smashing Members from the very bottom of our hearts for their continuous and kind support \u2014 and we can\u2019t wait to host more webinars in the future.<\/p>\n<p>We couldn\u2019t be happier to welcome Aaron to our upcoming <a href=\"https:\/\/smashingconf.com\/ny-2019\/\">SmashingConf New York<\/a> (October 15-16) \u2014 we\u2019d love to see you there as well!<\/p>\n<p>Please do let us know if you find this series of interviews useful, and whom you\u2019d love us to interview, or what topics you\u2019d like us to cover and we\u2019ll get right to it.<\/p>\n<div data-component=\"FeaturePanel\" data-audience=\"non-subscriber\" data-remove=\"true\"><\/div>\n<div>\n <img data-recalc-dims=\"1\" decoding=\"async\" src=\"https:\/\/i0.wp.com\/www.taterboy.com\/blog\/wp-content\/uploads\/2019\/07\/logo-red-7.png?w=900\" alt=\"Smashing Editorial\"><span>(il)<\/span>\n<\/div>\n<\/article>\n<p class=\"wpematico_credit\"><small>Powered by <a href=\"http:\/\/www.wpematico.com\" target=\"_blank\">WPeMatico<\/a><\/small><\/p>\n","protected":false},"excerpt":{"rendered":"<p>UX Improvements For Keyboard Accessibility UX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00 How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure…<a class=\"moretag\" href=\"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/\"> Read the full article…<\/a><\/p>\n","protected":false},"author":4,"featured_media":67992,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2},"jetpack_post_was_ever_published":false},"categories":[371],"tags":[],"class_list":["post-67991","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-user-experience"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.0.1 - aioseo.com -->\n\t<meta name=\"description\" content=\"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Guest Contribution\"\/>\n\t<meta name=\"keywords\" content=\"user experience\" \/>\n\t<link rel=\"canonical\" href=\"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.0.1\" \/>\n\t\t<meta property=\"og:locale\" content=\"en_US\" \/>\n\t\t<meta property=\"og:site_name\" content=\"Design for Immersive Technologies | User Experience for Games, Virtual Reality (VR) and Augmented\/Mixed Reality (AR\/MR)\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies\" \/>\n\t\t<meta property=\"og:description\" content=\"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2019-07-11T11:19:16+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2019-07-11T11:19:16+00:00\" \/>\n\t\t<meta name=\"twitter:card\" content=\"summary\" \/>\n\t\t<meta name=\"twitter:title\" content=\"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies\" \/>\n\t\t<meta name=\"twitter:description\" content=\"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#article\",\"name\":\"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies\",\"headline\":\"UX Improvements For Keyboard Accessibility\",\"author\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/author\\\/guestcontribution\\\/#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/#organization\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/www.taterboy.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/07\\\/logo-red-7.png?fit=60%2C80&ssl=1\",\"width\":60,\"height\":80},\"datePublished\":\"2019-07-11T04:19:16-07:00\",\"dateModified\":\"2019-07-11T04:19:16-07:00\",\"inLanguage\":\"en-US\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#webpage\"},\"articleSection\":\"User Experience\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog#listItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/www.taterboy.com\\\/blog\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/category\\\/user-experience\\\/#listItem\",\"name\":\"User Experience\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/category\\\/user-experience\\\/#listItem\",\"position\":2,\"name\":\"User Experience\",\"item\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/category\\\/user-experience\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#listItem\",\"name\":\"UX Improvements For Keyboard Accessibility\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog#listItem\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#listItem\",\"position\":3,\"name\":\"UX Improvements For Keyboard Accessibility\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/category\\\/user-experience\\\/#listItem\",\"name\":\"User Experience\"}}]},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/#organization\",\"name\":\"Design for Immersive Technologies\",\"description\":\"User Experience for Games, Virtual Reality (VR) and Augmented\\\/Mixed Reality (AR\\\/MR)\",\"url\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/author\\\/guestcontribution\\\/#author\",\"url\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/author\\\/guestcontribution\\\/\",\"name\":\"Guest Contribution\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/d2aad73eb0f48c67b141e9fc978a0e498969791ed623346e361d02d19775b0bb?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"Guest Contribution\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#webpage\",\"url\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/\",\"name\":\"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies\",\"description\":\"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\\u2019re\",\"inLanguage\":\"en-US\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/author\\\/guestcontribution\\\/#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/author\\\/guestcontribution\\\/#author\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/i0.wp.com\\\/www.taterboy.com\\\/blog\\\/wp-content\\\/uploads\\\/2019\\\/07\\\/logo-red-7.png?fit=60%2C80&ssl=1\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#mainImage\",\"width\":60,\"height\":80},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/2019\\\/07\\\/ux-improvements-for-keyboard-accessibility\\\/#mainImage\"},\"datePublished\":\"2019-07-11T04:19:16-07:00\",\"dateModified\":\"2019-07-11T04:19:16-07:00\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/#website\",\"url\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/\",\"name\":\"Design for Immersive Technologies\",\"description\":\"User Experience for Games, Virtual Reality (VR) and Augmented\\\/Mixed Reality (AR\\\/MR)\",\"inLanguage\":\"en-US\",\"publisher\":{\"@id\":\"https:\\\/\\\/www.taterboy.com\\\/blog\\\/#organization\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies","description":"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re","canonical_url":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/","robots":"max-image-preview:large","keywords":"user experience","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#article","name":"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies","headline":"UX Improvements For Keyboard Accessibility","author":{"@id":"https:\/\/www.taterboy.com\/blog\/author\/guestcontribution\/#author"},"publisher":{"@id":"https:\/\/www.taterboy.com\/blog\/#organization"},"image":{"@type":"ImageObject","url":"https:\/\/i0.wp.com\/www.taterboy.com\/blog\/wp-content\/uploads\/2019\/07\/logo-red-7.png?fit=60%2C80&ssl=1","width":60,"height":80},"datePublished":"2019-07-11T04:19:16-07:00","dateModified":"2019-07-11T04:19:16-07:00","inLanguage":"en-US","mainEntityOfPage":{"@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#webpage"},"isPartOf":{"@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#webpage"},"articleSection":"User Experience"},{"@type":"BreadcrumbList","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog#listItem","position":1,"name":"Home","item":"https:\/\/www.taterboy.com\/blog","nextItem":{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog\/category\/user-experience\/#listItem","name":"User Experience"}},{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog\/category\/user-experience\/#listItem","position":2,"name":"User Experience","item":"https:\/\/www.taterboy.com\/blog\/category\/user-experience\/","nextItem":{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#listItem","name":"UX Improvements For Keyboard Accessibility"},"previousItem":{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog#listItem","name":"Home"}},{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#listItem","position":3,"name":"UX Improvements For Keyboard Accessibility","previousItem":{"@type":"ListItem","@id":"https:\/\/www.taterboy.com\/blog\/category\/user-experience\/#listItem","name":"User Experience"}}]},{"@type":"Organization","@id":"https:\/\/www.taterboy.com\/blog\/#organization","name":"Design for Immersive Technologies","description":"User Experience for Games, Virtual Reality (VR) and Augmented\/Mixed Reality (AR\/MR)","url":"https:\/\/www.taterboy.com\/blog\/"},{"@type":"Person","@id":"https:\/\/www.taterboy.com\/blog\/author\/guestcontribution\/#author","url":"https:\/\/www.taterboy.com\/blog\/author\/guestcontribution\/","name":"Guest Contribution","image":{"@type":"ImageObject","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/d2aad73eb0f48c67b141e9fc978a0e498969791ed623346e361d02d19775b0bb?s=96&d=mm&r=g","width":96,"height":96,"caption":"Guest Contribution"}},{"@type":"WebPage","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#webpage","url":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/","name":"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies","description":"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re","inLanguage":"en-US","isPartOf":{"@id":"https:\/\/www.taterboy.com\/blog\/#website"},"breadcrumb":{"@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#breadcrumblist"},"author":{"@id":"https:\/\/www.taterboy.com\/blog\/author\/guestcontribution\/#author"},"creator":{"@id":"https:\/\/www.taterboy.com\/blog\/author\/guestcontribution\/#author"},"image":{"@type":"ImageObject","url":"https:\/\/i0.wp.com\/www.taterboy.com\/blog\/wp-content\/uploads\/2019\/07\/logo-red-7.png?fit=60%2C80&ssl=1","@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#mainImage","width":60,"height":80},"primaryImageOfPage":{"@id":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/#mainImage"},"datePublished":"2019-07-11T04:19:16-07:00","dateModified":"2019-07-11T04:19:16-07:00"},{"@type":"WebSite","@id":"https:\/\/www.taterboy.com\/blog\/#website","url":"https:\/\/www.taterboy.com\/blog\/","name":"Design for Immersive Technologies","description":"User Experience for Games, Virtual Reality (VR) and Augmented\/Mixed Reality (AR\/MR)","inLanguage":"en-US","publisher":{"@id":"https:\/\/www.taterboy.com\/blog\/#organization"}}]},"og:locale":"en_US","og:site_name":"Design for Immersive Technologies | User Experience for Games, Virtual Reality (VR) and Augmented\/Mixed Reality (AR\/MR)","og:type":"article","og:title":"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies","og:description":"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re","og:url":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/","article:published_time":"2019-07-11T11:19:16+00:00","article:modified_time":"2019-07-11T11:19:16+00:00","twitter:card":"summary","twitter:title":"UX Improvements For Keyboard Accessibility | Design for Immersive Technologies","twitter:description":"UX Improvements For Keyboard AccessibilityUX Improvements For Keyboard Accessibility Vitaly Friedman 2019-07-10T16:00:59+02:002019-07-11T11:07:54+00:00How can we provide an accessible user experience for keyboard-only and assistive technology users without affecting the experience for any other users? We\u2019ve kindly asked Aaron Pearlman, Principal UX Designer at Deque Systems, to share some practical tools and techniques to ensure that we\u2019re"},"aioseo_meta_data":{"post_id":"67991","title":null,"description":null,"keywords":null,"keyphrases":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_custom_url":null,"og_image_custom_fields":null,"og_custom_image_width":null,"og_custom_image_height":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"location":null,"local_seo":null,"created":"2021-02-07 19:01:20","updated":"2026-09-01 15:26:52","focus_keyword":null,"additional_keywords":null,"truseo_locale":null,"primary_term":null,"og_image_url":null,"og_image_width":null,"og_image_height":null,"twitter_image_url":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"Article","isEnabled":true},"graphs":[]},"limit_modified_date":false,"ai":null,"breadcrumb_settings":null,"seo_analyzer_scan_date":null},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/www.taterboy.com\/blog\" title=\"Home\">Home<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">»<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/www.taterboy.com\/blog\/category\/user-experience\/\" title=\"User Experience\">User Experience<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">»<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\tUX Improvements For Keyboard Accessibility\n\t\t<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/www.taterboy.com\/blog"},{"label":"User Experience","link":"https:\/\/www.taterboy.com\/blog\/category\/user-experience\/"},{"label":"UX Improvements For Keyboard Accessibility","link":"https:\/\/www.taterboy.com\/blog\/2019\/07\/ux-improvements-for-keyboard-accessibility\/"}],"jetpack_publicize_connections":[],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/p8wzr5-hGD","jetpack_featured_media_url":"https:\/\/i0.wp.com\/www.taterboy.com\/blog\/wp-content\/uploads\/2019\/07\/logo-red-7.png?fit=60%2C80&ssl=1","_links":{"self":[{"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/posts\/67991","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/users\/4"}],"replies":[{"embeddable":true,"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/comments?post=67991"}],"version-history":[{"count":0,"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/posts\/67991\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/media\/67992"}],"wp:attachment":[{"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/media?parent=67991"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/categories?post=67991"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.taterboy.com\/blog\/wp-json\/wp\/v2\/tags?post=67991"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}