we're live! what's up everybody it's another episodeof wpbacon. and we are here it's about, noon herewhere we are in austin. and kind of a rainy day out there. how is everybody doing? how is everyone doing today? >> great. >> i agree. brianna's almost done.
>> 7 p.m. where she's at. >> yeah evening. >> [inaudible]>> just had dinner. >> that's the first international wpbacon. that's->> no, we had. no, we had the guys from humanmade on. >> oh, yeah, that's true. so not. i'm a liar now.
>> [laugh] not the first the firstinternational woman on. >> there you go. >> oh well, putting on okay,. >> there you go you're the first atsomething. >> [foreign]. >> i don't know what you said i hope itwasn't bad. [laugh]. >> my very bad dutch says it was okay. >> all right, then.
>> evening, something something. >> yes. >> that works >> good evening everyone and nice to haveyou over here sitting >> [unknown] >> well i'll let ozzie go ahead andintroduce our guests. we're talking about wordpressaccessibility today if you are not already aware so that's what we're gonna jump in to in asecond but ozzie go ahead.
>> right on. all right, so we have three guests ontoday. uh,we have morton, he's a designer,developer. he's authored quite a few lynda learningcourses about wordpress including one of howaccessibility can improve your seo. we also have joseph. he's a member of the wordpressaccessibility team. he has previously led accessible ux teams,creating accessible web environments at pasadena city college and then atcalifornia state university northridge.
and we have rhyon, she's a wordpressprogrammer. she's in the netherlands. she builds accessible, wordpress websites. she uses genesis frame work and she's also a member of the wordpress,accessibility team. those are our guess. wonderful. >> awesome. >> i did a good job.
yeah, no that was awesome dude. >> that was a good intro. >> thanks. >> very, very nicely executed ozzie. >> that's how we roll. >> that's why we pay you the big bucksaround here. >> that's right, that's right. >> all right so, we wanna jump in, and,and understand a little bit more about accessibility and i think i'm not alone in
this, but i don't know that much aboutaccessibility. i know kind of like just the bare minimum,really not anywhere near what i'm sure i should and i think that's probably alsotrue for a lot of people out there. so one of the reasons why we wanted tohave this show is to try and get a little bit more information out to the generalwordpress groups and hopefully get a little bit more of a dialogue goingabout accessibility. and you get a little more implementationin some wordpress themes and plugins and stufflike that so,
i think we'd like to start off with just a general what is accessibility and whydoes it matter. >> so, i think joe should take the lead onthis. >> yeah, we'll start with somebody andthen you guys can all get a chance to talk. we're equal opportunity. >> [laugh]. at, at its very basis, it means making allof our information and all of our data, ourgraphs, our
pictures, available to people with allsorts of abilities. and that includes people withdisabilities, and the the main object of the accessibility teamswork with wordpress is, we're working on core issueson trunk. and we we have been generating tickets andfollowing up on them. we're we're not we're not done withaccessibility, but we're further along in the last two or three years, we'vewe've made some great headway. there are wonderful people working in thewordpress environment. i really find the community very receptiveto instituting
accessible routines for instance, one ofthe the prime accessibility routines, which you need topay attention to in your work. is just put your mouse away for an hoursome people say a day, but i don't wannatorture you. >> put your mouse away for an hour, and just use your keyboard to navigate theweb. and you will quickly find that, the tabkey and the up and down arrow keys don't get youeverywhere. and you can't really tell where you're atsometimes, because the focus is not there.
the visible focus. so some of the things that designers havehave really taken to our taking out the underlines for links, itclouds, it, it, you know, it clutters up the environment andtaking out the focus. for keyboard focus. taking out the visual focus. because again, it makes, it mars theirdesign but that's inamicle to the needs of people who just use thekeyboard to navigate. and so that's just one example of wherewe're focusing on core issues.
we did, we did a a keyboard navigation,pass at the beginning of this year. and our, our issue was that it took usabout two months to do that. now that in the terms of, in terms of wordpress development, that'slike two years. so so we've engaged the the services ofthe w3c most recently. and they will be doing an atag, atag andwtag pass at all of the admin screens in a fewweeks. and they will do it with about 15volunteers. so that will help, help get us back insync
with developers and we have been we'vebeen doing outreach. and really the, the work is being done byby coders who are again, really receptive to to the, the accessibilityroutines that we're introducing. and the whole team is just workingwonderfully together. >> well that all sounds like good. [laugh]>> definitely good stuff there. >> so i guess, if you, when you talk aboutaccessibility you have to. the the the key to the whole issue is that not everyone accesses the web in the sameway, right?
well we, when designers and developersuse, build web applications they generally design and develop them forwhatever way they use the web. so, if you're used to working on a desktop computer you're designing it for adesktop computer. if you're used to working on a phone,you're designing it for a phone. and this is why mobile first design took so long to take hold because people weredesigning the sites for the large screen that they had on their desktop and then scaling itdown.
and then realize that the majority ofusers use mobile phones and then sometimes also access websites ontheir, on their desktops. and accessibility is kind of the same thatwhen you're developing you are probably a well-sightedperson with good dexterity. so you generally have the ability to seeeverything that's on the screen. you are able to use your mouse properly,and you don't really consider, large targets for your links or high contrast orkeyboard navigation, all these things. that just means you're fortunate enough tonot have to consider those things. it doesn't mean that you should ignorethem completely, and.
the entire web community. this is not a wordpress thing. this is web developer, and designercommunity. thing have all but ignored accessibilitysince the get go. because it was considered an extra featurethat was not necessary. and to put it into a perspective it hasnothing to do with the web. in several north american communities,including vancouver in canada. a law was passed last year that said you could no longer put door knobs on yourdoors.
you know, the balls that you turn? >> oh really? >> yeah. and you can no, no longer put the oneswhere you have like a handle and then a thumb thing, to push down the pushdown the lever to open the door. >> mm-hm. >> you have to have a proper door handlethat you twist, you know, and you can put your shoulder on, and your, oryour elbow on, or something like that. and when those, whether those laws cameinto effect, everyone
went ballistic and was like oh my godrandie stayed. [laugh] and this is you know, over reachof government and everything. and it's really funny to listen to thatconversation. cuz your like you're really not investedin a stupid doorknob. and, and you're, you're not willing toconsider all the people who don't have the ability to graba doorknob. right? so, you, you're basically, because youdon't want someone else to tell you what to
do, you're willing to put handles on doorsthat people can't use to open doors. that's, that's kinda, so accessibility isin the real world too. and it's usually considered in the realworld. when you go in to a hospital they usuallyhave those big bars on the door and you can just walk into thedoor and then it opens. that's accessibility. you find that in most public spaces. and the web should be the same way. you shouldn't-.
>> yep. >> be forced to access the content on the web in the way that the designer developerdoes. just because the designer or developer didn't bother considering otheralternatives. >> and mostly designers and developersdon't know. >> and they are high-end users, they can see properly, can use the technologyproperly. they know everything about what a websiteis about.
maybe the client does the same, but theusers of the website are much broader. there are users not so good. not so good, with the mouse not so good,technology don't see actually what's going on in thepage immediately. so they have problems with accessing thewebsite. that's not only for blind people that'sfor people that who don't understand things quickly or peoplewho can't use the mouse. maybe someone broke his arm, and he can'tuse a mouse, so it's everyone we know aroundus.
also people who get older don't seecontrast that well, have to stare, have to enlarge the screen, and then allthe layouts get messed up. so it's all kind of different people, andyou will become one of these people. when you get older. [laugh] [crosstalk]. >> it's our future. >> well, i mean. >> this is your future. prepare for it.
>> i, i can kinda, i can relate to some ofthis even though i don't have much. experiencing the accessibility realmbecause you know, we do a lot of seo related stuff, and also trying to help people increase conversions and thingslike that. we pay attention to a lot of the samethings. >> we try to break down any kind ofbarriers that are in the way of actually getting people to do what youneed to do while your on the website. and that is a very common issue that wesee across the board. and a lot of it has to do with people
not taking into consideration that youknow, hey this button probably shouldn't be hidden you know whati mean so i i can, i can relate to it in that sense. so it's not so good that there's likecommon ground for people that maybe haven'tstepped into accessibility yet. >> show to your mom doesn't make sense. >> that's actually one of my favoritetests to do for people when we're trying to figureout how to, increase conversions, how to makesure that,
the website will actually do what it'sintended to do. is to use a test group of people that are not web savvy, they're not people that aregoing to. immediately, intrinsically understand whata website is or what any of this other stuff that people thinkmatters. like [laugh] to, to use them as a testgroup. and that's always been one of my favoritethings to do. i would literally give it to like, groups of my my parents' friends and stuff likethat.
have them tested. >> and always, we always got really,really good feedback from that because, it's like[laugh]. it, it, it's, it's a whole different thingthan what people who work on the web wouldexpect. >> yeah. [crosstalk]. >> i'm still trying to get, i'm stilltrying to get my mom to send me a text message.
>> slow down. slow down. >> [crosstalk] [laugh]. >> you know you, you if you want toexperience accessibility. you can do what jill said. which is you know, throw away your mouseor turn it off. and then try to navigate the web using thekeyboard. it's actually once you do it, if you landon the right places, you realize that there's a lot of stuff you do with
your mouse that's easier to do with yourkeyboard. okay, you also realize there's a lot ofthings on the web that are spectacularly hard to accesswith a, with a keyboard. but if you really want a trueaccessibility experience go and get the chrome vox extension for yourchrome browser. it's a, it's a text to speech extensionthat allows the chrome browser to read back thewebsite to you. >> and then see or hear what a websitesounds like to a non-sighted user, and also get to experience the website the waygoogle experiences your website.
because accessibility actually has to dowith seo too. you're basically marking up a website forsomeone who can't see your content but can only read what is, whatyou put in there. so all your alt tags that everyone ignoreskick in for google, and for any non sighteduser. uh,- [crosstalk] all your area tags that. >> no, [unknown] because it's blind anddeaf. >> so, so-. >> all your area tags, all your extrastuff.
>> kicks in for all the people who can seeit. and when you listen back, like if you playback your website as as text-to-speech, speechbrowser, you will be astonished. at the lack of information you'reproviding. and it's really, it's really jarring thefirst time you do it and then you go, oh my god, i need to rethink the wholeprocess of building these things. that was kind of where i started.q. >> i'm a little, i'm a little scared now. >> [laugh]
>> but that's not a bad thing though ithink, >> you know, we talked about. you know, this is something that you haveto do because there are all these people thatare being excluded. i think that instead of that, we shouldthink of it the other way around. that the, the whole point of the web is tobe able to distribute a, distribute content in the best way possible soeverybody can access it in the way they want. that means if you're out jogging youshould be able to just touch
your phone and then get the phone to readthe website back to you. or if you're in your car. i mean apple and google are now trying tobeat each other on who gets the first car that'scompletely integrated with a computer. imagine if you were in a car and you were like oh, i want to read this latestarticle on some website and you can just get the carto read it back to you as if it was theradio. you can't do that right because the webisn't accessible.
and google and apple are reluctant tobuild this stuff in. because they simply don't want people tohave that awful experience cuz they'll, the peoplethat use it. >> will blame google or apple for theexperience. >> instead of the developers. >> and they don't like to get blamed foranything. >> so are there any websites out there right now that are gettingaccessibility right? like for the most part?
and what can we learn from them? no website of the bbc. >> the bbc. >> bbc.co.uk. sorry. >> they have a large, they do a lot of work to make all the website, the websitecompletely accessible. yeah. >> now, the uk government in general isreally good.
the, the gov.uk website won the you know,best design award last year and it kinda looks verysimplistic but it's intentionally done so and it's, if you goto that website and you just hit your tab buttonyou immediately see. everything's really highlighted,everything is structured in a very rational way, it's easy to understand the content andeasy to get to. most. most western governments actually requireaccessibility as a standard for any
kind of governmental website, which makessense if you think about it. and now there are also pushes to, thereare several governments that are now mandating accessibility as astandard for any website. so in norway for example, as of, i thinkit's june the first. any new website built that is not a personal website, so if you have abusiness. or if you have any kind of informationalservice that goes beyond just this is pictures ofmy cat. then you have to be accessible.
and that's kinda where wordpress is gonnaget in serious trouble. because>> yes. >> presently the->> mm. >> number of themes in the wordpress themedirectory that have the accessibility tag is it's0.5% of the- >> oh, wow. >> wow. >> and >> [crosstalk] it's even worse than ithought.
>> well, in, in the netherlands, if imight say, in the netherlands drupal is winning because drupal is far ahead ofwordpress what about accessibility. take a lot of effort the drupal communityto make sites accessible. and that's done solely and also for thedutch government. so wordpress is losing it from drupal while building sites for the dutchgovernment. them>> and that's about tim i think >> we like bag on drupal, but i guess wecan't, we can't do that today. >> yeah, they, they they've realized they
had the conversation we're having now,several years. [crosstalk] and they realize this is notsomething that can be, you know, ignored. >> ignored, or, it's like, oh, don't worryabout it. [crosstalk] more and more people, or moreand more governments say okay we need accessible websites for forour own than they. in the netherlands they chose drupal. >> [crosstalk] so you said june first,>> yeah. >> so what does that mean for. i understand like new websites.
but will that encompass like a wordpresscore update? >> uh- >> [crosstalk] next thing when we go to4-0. >> it's, it's front-end so. >> okay. >> [crosstalk] yeah. >> that's where the real that's where thereal catch is. because->> right. >> the wordpress accessibility team isdoing
an amazing job at making wordpress itselfaccessible. i mean you yourself aren't a part of it. but you're, getting so you're gettinginvolved. >> it's gonna be accessbility team. >> [laugh]>> yeah i, i want to i just think. >> we're pushing, we're pushing you aroundright now. >> [laugh] [crosstalk]. >> i'm the guy that causes problems so[crosstalk]. but, they're doing a great job of makingthemselves more successful.
but with wordpress, so that would beplugins and themes. are only as accessible as the plugin andtheme developers want them to be. and as i said, the majority of the almostone hundred percent of the wordpress themes that are distributed in the directory are notaccessible. and i think in the wordpress homedirectory. i think the percentage is something likefive, or eight, or something. >> it's just a little better? >> yeah, but it's still five or eightpercent.
>> yeah! [laugh] >> and this is coming from so let's sayyou're in norway. and you decide that you're going to builda new website for your business, as of junefirst. you build a website, and you go oh, ifound this awesome genesis theme, or. something else, and you put it up. you will get a fine. >> ooh.
>> from the government. >> look out developers. >> now genesis has some majoraccessibility issues. and i agree. >> i've heard something about that. i know gary's been kind of vocal about thefact that genesis isn't doing enough. >> no. i made a program to fix the problems. so it's in the repository.
>> thank you. for the genesis framework. >> what is it called? >> genesis accessible, it's called. >> we're gonna have to add a lot of linksto this one when we're done. but morton. >> but, but, it's not only the frameworkof not only the theme. also the content needs to be accessible. >> it's not just you drop a theme and you
drop a website there, and oops it'saccessible and you're ready. you also have to have accessible contentand that's also an issue. you have to train the content managers. >> i'm working on some curriculum forwordpress.org. for the codex. i i first introduced the curriculum to nobility's accessu, in austin two weeksago. and i need to improve it a little bitbefore it's ready to be published, but it's for making accessible content forwordpress.
because indeed the issue is not only theback end, and not only the theme, but the way that peopleupload content. so if they're uploading content and theyhave a video that has no closed captions, that'snot accessible. if they upload pictures and they don'thave false descriptions, alternate text descriptions, then that's not accessible,and you should use headings and lists. instead of space, space, space, tab, tab,and it looks centered to me. [laugh]>> it looks so much nicer. >> yeah, so much nicer to move thingsaround with the keyboard.
you use a list. an unordered list. that tells something to at, assistivetechnology. that tells the assistive technology isthere, oh, there's a list here. you wanna read it? and so instead of just making bullets anditems in a, in a pseudo list, you should use. actual lists, code markup. so, this is an issue that we've addressedwith the theme tag accessibility ready.
so, it's an optional process right now. someday it may be more than optional, idon't know. but, right now it's an optional process. and you can submit a theme to thewordpress theme directory. and it asks for the accessibility readytag. and a group of us in the accessibility team then vets that themefor accessibility. and if it passes and it's real reallysimple. i mean if you look in your codex.
>> under accessibility, it's a reallysimple set of parameters that we're, we'retalking about. the theme gets the accessibility ready tag. the more themes have taken time. okay. >> it's all there. >> it's just a matter of, i didn't like,i, we were talking pre-show, like, i'mcompletely ignorant when it comes to it.
and it's just, i mean it's just educatingpeople and getting the word out there, hey, this is somethingyou need to do. i mean, i would, i would kind of put it inthe same vein as, like, when people firststarted doing, like, responsive themes. or, like you were saying, like mobilefirst. >> mobile first approach. you know, it wasn't until like, well, morepeople are access, are accessing it on their phones, like, that'ssomething we need to do. we should have been at this point laterjust from earlier,
just from the amount of people that areusing the web. you know, not, like, you're saying theyhave the certain either disabilities, or maybe they don't like using their mouse orwhatever but it's kinda that same thing. it's just educating people and getting itout there. but there is stuff out there, i, you know,in the codex. >> we have a couple questions coming in,in the chat. i know alison is asking if anybody knowswhat the consequences are for not complying with some of these new laws, andalso, like, how would they even know? is that something where somebody wouldhave to file a complaint?
does anybody know anything about this or? >> it, it, it depends on where you are. so, there, there are different laws indifferent places. in, both in canada and to a large extentin the united states and many european countriesthere are laws on the books that say any website that is eithera governmental website or something that provides a service forgovernment have to be accessible. and basically what that means is if you'rea vendor to government and your website is not accessible, you're likelyto
lose your contract unless you upgrade yourwebsite. so there are very real ramifications forit. usually there's a process, so you get told and then you have to do something aboutit. the norwegian project which is ratherextreme. but it looks extreme. i think it's the correct approach. it's [laugh]. i think what's going to happen is if youare an
accessible user and you can't do what youwant to do. and you can't find information you wouldjust flag it and then a government agency would go to the owner and say thatyour website is not accessible. you have x, some sort of reasonable time period to do something [crosstalk][laugh]. and they've also, it's not crazy. so what they've done there, is they said,any new website that goes live after junefirst is requirement. and then if you already have an existing
website, then the next version has to beaccessible. and all website must be accessible by theend of, look, by the middle of 2021, or somethinglike that. and, i mean, if you're, if you have a website today, and you haven't updated itin 2021. >> you have bigger problems. [laugh]>> that's true. so >> so you mentioned you mentioned beforeas
part of accessibility and how google readsit. like, how google reads it right? so that inherently affects your seo. >> so that was a question, like, what'sthe connection? does it go the other way? does seo like, can it go the other way aswell? it's what joe said. that mainly has to do with your markup. rian when you publish content on the web,you-
>> uh-huh. >> have to follow web standards. that require your headings have to behierarchical. so you use heading one, heading two,heading three all the way to down heading six. you mark up your lists as lists, yourimages need alt tags. your links need title tags. your>> no, no. >> no?
>> [laugh]>> well they don't need them. they should have them if they're notdescriptive. you don't think that says click here then you need to provide some sort of extrainformation >> oh yeah. please everybody [crosstalk] no more clickhere links ever. please. >> and you [crosstalk] you need to. wherever two or more accessibility expertsare gathered, you will get opinions.
>> [laugh] we need standards, joe. we're not the type of people who needdiffering opinions. >> well hey. >> you tell us what you want, and we'll godo it. >> you get a group of seo people together, and you're lucky if somebodydoesn't punch someone. >> oh, dear. >> [crosstalk] well here's an seo issueand it intersects with screen reader use. click here, or read more.
the standard in wordpress for the jump isread more or more on this story or somethinglike that. and so if you actually repeat the name of the article that you're following afterthat read more link. that will increase [cough] the number oftimes that your link [cough] is being. >> clicked on. >> is being put out there. and it'll also give information to peoplewho are blind and who can't,
they, if you're using a screen reader,you're able to separate out lists, links, graphics, [cough], andso, if you have a series of links that say read more, read more,read more, read more. which would you choose? >> so so if you make the link descriptive,that's adding to your seo. >> i think that's also bad for seo if yourlinks are bad. >> yeah, you're much, you're much betteroff to have descriptive links. having links that are actually semantic towhat the content is about. it's definitely a much better situation interms of seo.
so that is 100% correct. >> and you can do this with aria tags too. so if you really wanted to save read morein the visual browser. you can still add the extra informationeither in your title tag or your old tag our your ariatag. so that the screen readers will get thewhole. text out, so that you are providing thebetter experience for everyone. >> oh, here's a good question. how is how are some of the like really bigsites like, you know, facebook
and some other social sites and the, the,you know, the sites on the web. how are they doing in terms ofaccessibility? are they lagging behind or are they are,are they conforming? >> facebook has a team of accessibilityexperts working on it directly in house. twitter has a team of accessibilityexperts working on it in house. linkedin has an accessibility team. you know, see where i'm going with this? >> all of the, all of the big companies have realized that they need to make aneffort.
that they're going to be excluded frommarkets. and that there are approximately onebillion people with disabilities including all sorts of abilities,paraplegic, cognitive issues. i'm working on the w3c cognitive. and learning disabilities accessibilitytask force. not enough work has been done about cognitive issues, and we're working onthat. you're gonna see more about cognitiveissues in the next year or two, three years.
cognitive is gonna come us as one of the it is one of the major areas ofdisability. there is vision, hearing, mobility, andcognitive issues. those are the four main areas ofdisability. and so, all of these companies haverecognized, yahoo has accessibility experts, paypal has agreat accessibility team. wonderful accessibility team. and so there's, they've blended it in withusability and user experience, ux. so what i say is i do accessible ux andthat translates that for people doing
ux, oh, he's doing ux, okay, what's this accessible part, i'll, i'll find out moreabout that. so all of these big internet giants nowhave accessibility teams working on them to make them moreaccessible. >> to basically get online or you're gonnaget left behind. >> and that is, that's also interestingbecause especially given that there is such a large discrepancy inwordpress right now. if you're looking for something to kind ofset your products apart, if you're gettinginto theme space, you're
trying to make a little bit more of a name for yourself, there's obviously a marketthat's not being served. >> so that's, there's an opening for you to get in and differentiate yourself abit. so i mean, there's, there's also a, a lotof people won't get on board with something until,until they're seeing dollar signs. so, [laugh]. >> [inaudible} dollar signs here. and i mean, if you, if you look at theaccessibility
tag guidelines for the wordpressrepository, those are quite easy to follow. like you have to, you have to, there's nota lot of work involved. and and getting your theme approved as an accessible, accessibility ready themeis not hard. it just requires, actually if you startwith underscores as your baseline, underscores now after a few things werechanged in the, last couple of weeks, pretty much meets that tag already,so you just have to make sure that you continue the flow asyou're adding more content in.
yeah, 'cuz a lot of people are concernedthat adding accessibility into your theme or your site, will make it reallyheavy and clunky and difficult. the only main thing that's missing in,theme, like, in underscores and some of the other, framework is, the,drop down menus. and if you want to get a properlyaccessible drop down menu you can go to a11yproject.com/patterns andthey have a fully accessible drop down menus you can just grab and dump intoyour theme and then you get the current standard forfully keyboard accessible drop downs. so it, it doesn't require much it justrequires that you know about it.
and that you are conscious in yourdevelopment process and build it in at the start of yourproject. not as an extra feature on top, but as acore, as a core baseline. so i, i tend to tell people thataccessibility is as important if not more important thanresponsive web design. and just like with responsive web design,the first time you do it you have to completely rethink howyou're doing everything. but then it becomes part of your process. and if you make your accessibility abaseline requirement
for everything you do, then it won't costmore, it won't take more time, and it won't be something that you have to go sell to yourclient. it's just part of your service. you know. you don't have the conversation with yourclients, should this be accessible? it is accessible. because at the web-standard way of doingit. so you mentioned the, the chrome the voxthing.
like to install it on your chrome browser. are there any other good tools? like to test accessibility? >> [crosstalk] yeah those are, i'm sorry. >> go ahead. >> malcolm, no, go ahead. >> [laugh]>> i like this game. no, you go ahead. >> this is, this is a game we play on justabout every episode.
>> go on, go on. >> i need like a wand. >> okay, here's a chrome extension that'sa check for colorblind i find it veryuseful. it's called, i want to see like the colourblind. you can install it. and then you can check your website forall different kind of colorblind views. if still the text is still readable, ifsomeone can make out what's the text, what's the background, if if the contrastis
all right for different kind of colorblindpeople. i think that's very useful. [crosstalk] [inaudible] with your own sitewith everyone, one's else site. for example if you have a calendar and yousay for all the green spaces are free. someone who's color, color blind comesimagine what's what's green spot so you can check with tool if if it's stillstands out and don't use the green color. use another way to identify if a spot isfree. well that's one that's, check for colorblindness. >> joseph, did you have anything?
>> yeah if you just get your phone out anduse on ios, voice over. and on android, talkback. get your phone out and just [cough] gothrough a, a favorite page of yours and have the the voice overread it to you. [cough] probably the apps that are madeare not all uniformly accessible. in fact most of them are not accessible. and you're liable to hear things like,button. button. >> [laugh] menu item one.
menu item two. >> so again. again, which one would you choose to getyour major league baseball? well actually major league baseball is,has gone out of there way to make things voice-overaccessible. but,>> really. i love major league baseball. >> yeah so their app is is pretty good. there are apps that are available that,that do take accessibility into account.
and then there are many more who, whodon't. so but just read, just get your phone out. read through a site using voice over ortalk back. and you'll begin to see some of theissues. you know, check out your own site, seewhat's, what's up, and maybe you'll, maybe you'll make somechanges based on that. >> lea verou she's a javascript developershe released a tool a couple of weeks ago. see if i can share my screen here. that's called contrast ratio.
and basically the tool allows you to putin any background color and text color andthen it'll tell you what the contrast ratio is, and youwant to have a high contrast ratio because it'seasier to read. so, for instance, if i go, you can seethis, right? >> screens if i set three three three it'sa very poor contrast. so then you see the number is one pointfive. so this is failing wcag 2.0. and then you can kind of just muck aroundwith your
colors and figure out whether or not yourcolor combinations work. so that you can, you know, actually testyour stuff. the same goes for color blindness. there are multiple different types ofcolor blindness that you should consider. it's not just red-green. you also have some other combinations. so there's, there are a lot of thesethings that are worth looking into. like i said before, the>> [cough] >> the the very oddly named accessibilityproject has
like, a11y, cause there's 11 charactersbetween a and y. so if you go to a11yproject.com, you'llfind a bunch of links. and their patterns page gives you thecurrent, you know, recommended accessibility patterns for a bunch ofdifferent things, that you can use. and they have practical coding samples foreverything. >> awesome. >> and the other thing is the, like i said, the guidelines for the accessibilityin wordpress are excellent. and they're very easy to follow.
images, media, headings, link texts,keyboard navigation contrasts, gif links and forms and such. >> so we actually had a question come inon the on the q and a. and somebody is calling you out, morten. >> robert. >> oh. >> [crosstalk] you see the question? so if you have a caption, right, for aphoto, and then you put the alt tag, like basically the caption is a description,right, of the, of the picture.
so, then you put that same in, that sametext on the alt tag, it's going to be aduplicate, right? >> duplicate, yeah. >> so, why would you do that? >> well you wouldn't. you have to follow the alt tag decisiontree. >> oh, okay. >> so the alt tag is like kind of a, one of those things that joe wastalking about.
the hotly contested areas. so they very rudimentary standards thatcome from w3c is that, if you have an image that has some descriptive content,and the alt tag should describe the image. if the image has text, then the alt tagshould match the text. if the image is a link pointing somewherethe alt text should describe where the link ispointing. if the image has no purpose, so it's justan image that's there to fill space, then the alttag should be empty. and if you have other text on the pagethat duplicates what the
alt tag would say, and that text isrelated to the alt tag. let's say you have a figure with a fakecaption in it, then you don't need the alt tag because thefake caption is taking over. but then you have to make sure that your markup clearly assigns the fake caption tothe image. so you have to put the fake caption inside the figure tack, so that they are directlyrelated. that is totally what it says on the page,robert. >> [laugh]>> he, he is a good friend of mine.
he lives like, not too far away. and tries to, yeah, whatever. >> oh, that's good. >> i, i will specify better on my websitejust for robert, later on. >> keep you on, keep you on your toes. >> i guess we should probably take a breakreal quick, and mention our sponsor, which iswp site care. if you're not already familiar with wpsite care, they are a wordpress support andmaintenance company.
you can go there and get all kinds ofthings taken care for your website. if you need updates, you need any kind ofon-going support, they're great. you can get them to be on contract withyou and they will keep up with all of your updates, they'll manage any kind of issuesyou that you run into, diagnose problems. they're awesome. so if you need any help with work websitedefinitely hit them up. and if you use the coupon code wikibaconwhen you purchase a plan, you will get your firstmonth free. so, that's cool.
let's see we have, we have quite a fewmore questions that we have planned. i actually wanted to talk about somethingquickly that really doesn't have much to do with wordpress oraccessibility necessarily. it's just something neat that we cameacross right earlier yesterday or earlier last night,or sometime recently. and there's actually a project going onover on indiegogo for solar roadways. >> which is like a really neat idea. and if you go towww.indiegogo.com/projects/solar-roadways,
you'll see it. and they've already raised like a millionand a half for it. and they're, they obviously could use asmuch as they could get. but the project itself is like really acool idea. they basically want to replace all pavedsurfaces with these cool little hexagonal tiles that are made of mostly recycledglass, and they all have leds in them. and there's like a little computer chipprocessor in them. and, it sounds like it could be a prettyexpensive project, but- >> also really cool.
[laugh] so um,->> [unknown] >> have you guys seen this? >> melts the snow when it's freezing? >> yeah, yeah it it melts the snow andstuff too. it's, it's really, really cool. >> it's i think a couple of years ago iwas reading about someone that said all theroof space in the world is being wasted on, because, youknow, we have all these black or white roofs on top of everybuilding everywhere.
and it's just dumb space that doesnothing. >> and there's been pushes to put, justmandate that you put a solar panel on top of everybuilding. and i think roads are another thing. my concern with it is, what's the tractionlike on a solar panel? >> [laugh] yeah. >> it's like glass sheets. i would say, i wouldn't want to drive on a glass sheet just, you know, from a safeperspective.
[crosstalk] so it's like a minor problem. >> it does seem like it could beproblematic [laugh] i guess they. >> they have like wheels with suction cupson them or something, i'm not sure. >> the surface of the tiles has like thesestrange like bump things that they've, i don't knowexactly what they've done. and i also don't know how well that would work under like icy conditions andwhat not. but i don't know, like the video that theyput up for it is really neat. it's getting a lot of attention and i meanit's certainly something to consider.
they said that. in theory, if all of the roads in the united states were replaced with thesethings, which, yeah right. but, [laugh] if, if it were in theory tohappen, it would generate three times more powerthan we currently need. >> like all by itself. >> you know -. >> so. >> like, i, i get that, but we'd still bepaying for electricity.
>> well, yeah. >> that's not the question though. the question is, is your electricitycoming from burning coal and gas, or is it coming from thesun? >> yeah, if it was just coming from thesun and was being generated by the roads,that'd be awesome. >> is our energy destroying the planet ornot? >> let's get that in, let's get that outhere. did you guys hear about this?
like, somebody, like somebody in thecalifornia, legislature wants to pass out a law where we'd have to pay two cents a milefor every mile we drive. >> that sounds reasonable. >> are you out of your mind? >> no, i'm from europe. i'm from europe where that alreadyhappens. >> oh my god. >> because when you drive your car, you'rebasically wearing down the road pattern.
>> i pay registration. >> and spreading dirt and crap into theair and [crosstalk]. >> i pay a ridiculous, i pay a ridiculousamount of registration. i pay a gas tax. >> [laugh] uh-huh. >> already. >> you should come to, you should come toeurope. you, i think you should come to europe. >> [crosstalk].
>> that doesn't sound like fun at all. that doesn't sound, like, at all fun. i'll walk. [crosstalk] you are spoiled. >> yeah we've, it's, it's america overhere guys. america. >> you know it's america over here, where everyone has six cars and driving is aright. >> i want my roads to be acceptable and idon't
want to pay them two cents a, two cents amile. >> well you, i think the reasoning behind that is driving does something to theenvironment, right? and there's, there are otherconsiderations that go way beyond your personal financialstate. you know, in, in holland there's, there'sbeen very aggressive moves to get people to not drive their cars becauseit's a small country. like, like congestion and everything. and they've done a fantastic job.
if you go to denmark, you're more likelyto be run over by a bike than a car incopenhagen. you know, in, in norway families have onecar, because it's so heavily taxed, to have a car, because it'sa big burden on society. on the other end of that in norway, andmost european countries, these stripes that are on the street have glassin them so that they shine during the night, so you canactually see where the road splits in two so you don't end up on the wrongside of the road. so, they solved the, disability problem onthe road in the 70's.
i don't know why it is they don't havethat here, but they don't. >> you know, we can't get anything right. like -. >> our system of, you gotta understand the, the system of measurement we stilluse. okay so [laugh]. >> [crosstalk] we have, we have trouble. >> one thing at a time. yeah, we have trouble with change.
we have -. >> i measure my height in, in, liters. >> we're really good at making, like,really shitty, horrible food, though. so that's good, right? >> it tastes good. >> alright, well, after totally derailingthe show. >> [inaudible] >> or accessibility, [cough] we'll getback on track here for just for a little bit.
so, we, we, now we know a little bit more about what accessibility is, why itmatters, all that stuff. that's great. and i hope that a lot of people havelearned a lot. i want to talk a little bit more about,like, how it fits in with wordpress, and how peoplethat are out there building themes and building plug-ins andstuff, how they can try and work some of this stuff into theirworkflows a little bit better. so we had already kinda talked about what
the role of the accessibility team is atwordpress.org. but are there areas where, like, wordpresssteam developers and stuff can start making somequick changes? like, things that if, if people were gonna have to implement some stuff now, without,you know, totally reworking their entire way thatthey work, what would you guys suggest that theystart with? >> keyboard accessibility. just try that if, everyone try outthemselves, try if
your own theme is actually accessible, allis accessible with keyboard. that's, that's, the, 90% of allaccessibility problems are solved if just the keyboard. everything is accessible with thekeyboard. period. >> is everybody in agreeance to this? >> that's a very good place to start. >> and like, and like i said, if you'rebuilding a theme, you should, you should be startingwith some sort of baseline.
and the baseline that i recommend isunderscores. and, underscores has this type of stuffbuilt in. if you look at the baseline code forunderscores, in the very top you'll see that under the,they have a skip, a skip link at the very top of the page, that god moved a couple of weeksago. so the first keyboard-accessible item onthe page is a skip the content link. so you bypass menu and whatever else youhave at the top, and jump straight to the contentright away.
they also have a keyboard-accessible menu. well, ish. you still have to add some javascript tomake it fully, all the dropdowns, but at least they've done agood job of starting it. and, and if you combine that with the, thepatterns that are provided by the alley, all, i don't evenknow how to say it. >> i say, i say allie. or ally, or -. >> allie, the ali project, then you're,you'll actually get
a keyboard-accessible menu too, and thatwill kind of bring you into the realm where people can accessyour website using, using either a keyboard or their phone, and talkto their phone. which is, smashing magazine had an article last week about how accessibility has ahuge impact on how people use their phones,because people talk to their phones all the time. and, the making your menus accessible likethat makes that happen so if you look at this, you'll see you cantab through the menu.
>> uh-oh, we got code up on the screenladies and gentleman. >> if you look at the bottom you'll seethat i can actually tab through the menu. >> that's cool. >> so if i go down, it actually tabsthrough the entire menu. >> this is definitely something thatdevelopers should be able to get behind, because most developers i know really like to usethem some keyboard shortcuts, so -. >> and if you, if you look at my site, it's running a theme that i built, to, tobe published.
it's, it's currently sitting in theendless what is called the, you know, the purgatory of theweb, of the wordpress, theme directory, where it'sbeen approved, but someone has to click the button to make itlive. and so, if you see here, it starts with a skepticon template, then it goes througheverything, and then you get to the menu, and you skip through,and it's clear that you are where you'resupposed to be. and if there was a drop-down here, youwould see a drop-down come in too.
so there's, you know, it's just notchallenging to incorporate. you just have to do it when you start the project instead of after you've doneeverything else. because when you do it after you've doneeverything else, it'll be super frustrating, because you have tokeep changing all your markup. >> hm. >> so it has to do with the approach,where you start. >> [crosstalk] so, and, it also that, thatalso adds a, another question. is it, is it primarily theme developersthat need
to be concerned about this or plugindevelopers as well? >> plugin developers too. >> [cough]. >> but they can add functionality to thefront end of -. >> the website so that needs to beaccessible -. >> [cough]>> too. >> so pretty much everybody that has anykind of code that's interacting with the front end of the website needs tobe concerned about this. yeah?
yes. >> and it should be one of your primary concerns because more and more countriesare legislating it. and at that point, you'll lose your clientbase. i just imagine shipping a product and thenthe client getting a letter saying your siteis not accessible. or, if you build this website for, let'ssay, a political organization, or a charity, orsomething like that. >> uh-oh.
>> and then the government goes to thatcharity and says we're going to pull your funding unlessyou make your site accessible. you as the developer have now done adisservice to your client. you've made a problem for them that theydidn't know existed. cuz it's your job as developer to be awareof these things and make sure that they are done so that your client, cuz your client shouldn't even have toconsider this. it should just be there. and it's not their job to know.
it's your job to know. and like i said, this is not a wordpress thing, this is a web developer thing ingeneral. >> no it's a very different [crosstalk]. >> community. but we as wordpress have an enormousresponsibility, because we, like wordpress runs, what, 22% of theweb? and what wordpress does, others follow. >> right.
>> when wordpress started doing html5 therest of the web was like, holy crap, we need to dothis too. when wordpress started doing, responsivedesign, everyone followed along. we we start doing accessibility, the restof the web will follow. but it also means if we keep lagging onthis, the rest of the web will lag on it aswell. cuz we are the ones that teach how, peoplehow to build websites. so if somebody wants to get involved withthe accessibility team at wordpress, how would they do that and what skills areyou guys looking for?
[cough]. >> well we're looking for a variety ofskills, including technical writers to, help us, revise the codex andthe, the web, the, the blog that we have atmake wordpress accessible. the the code team needs to be beefed up. we're, we make tickets now and some of thetickets haven't been addressed. each of us has a day job, and each of ushas, you know, many, many more things to do, it seems every month and, we needmore people to volunteer. the, the, outreach team, has been going
around to, from word camp to word camp,talking about accessibility, raising consciousness,raising awareness. we've all done a great job doing that. speaking at different events. i have a meetup in los angeles, and i'mpart of the local wordpress meetup scene. and i'm working with a developer on aplugin for wordpress, i have a project calledcities. it's accessiblejoe.com/cities,accessiblejoe.com/cities. and, i'm trying to get people to, add somethemes to the theme directory.
and you'll be working with a localdeveloper in los angeles here to develop an accessible slide show pluginfor wordpress. so you'll be able to do your slide showwithin wordpress. it'll already be posted online. and it'll be html and it'll be accessible. so accessible input, accessible output. so that's, an important project to know. and, so we, we just need people to, attendthe weekly meeting. if you can't do that you can keep in touchwith us by email.
there are a number of different, areas that we need to address, includingdocumentation. and we'd love to have any and allvolunteers. in fact, those of you who are not on the accessibility team are nowofficially deputized. [laugh] members, even if you just talk[crosstalk] even if you just talk about this with your friends, and developers that you know, youknow, go to a meetup, go to a word camp. and talk to people about accessibility,and,
you'll be evangelists before you know it. >> [laugh]>> there we go. >> and broke. >> [laugh]>> should have left that part out. well let's just pretend we didn't hearthat. >> we'll edit that one out. >> do, are we gonna, does that mean we're gonna start making our videosclosed-captioned? rob?
>> well actually, technically, i think,youtube does it automatically but it's not really allthat fantastic. >> you should, you should watch an oldpodcast with the auto caption. >> it's pretty insane like, i've lookedthrough it and i'm like, that's not even close. >> but you can edit it yourself. you can actually like write out all of it. i can tell you, from, my brother has a severe hearing problem and, i work forlynda.com, right?
so we have, tutorial videos, and lastyear, lynda made a change so that when you watch the videos on lynda.com there is acaptioning for everything that happens but it's aseparate document. and you see it highlighting through thedocument as the video goes so that, you know, each sentence that's beingspoken, you can see it highlighted. and that took my courses from beinguseless for my brother to being something you canactually follow because he was able to, go into the
video and click where, like, on a specificsentence. and the video cues up to wherever thatsentence is, and then you can just watch it fromthere. and he was able to follow the conversation rather than seeing it, cuz it's all screencaps. you don't even see a person talking. and, you know? and again, that's the kind of things thathave, ramifications wide, well outside of just making it accessible to peoplethat have some sort of, nonstandard issue.
when you index your content in written format, google can now access thatcontent. that means if someone searches for a sentence that was spoken during yourpodcast -. >> search result pops up. you now have indexable content. so there's, there's more to it than just,you know, making your stuff accessible to people that, areoutside of the defined norm. it also has to do with how the web worksin general.
the web is hypertext. it's not video and it's not images, it'sall hypertext. so if you provide text content then theweb is able to index it. >> you guys have my attention because i,[laugh], i do not give google anywhere near as muchcredit as some people do. [laugh] they, they are, they're smart, butthey're not quite as smart as you might think. so, anything you can do to, kinda helpthem along, it's gonna be good for you. [laugh] so, i'm definitely going to belooking
into this more myself for, my ownnefarious purposes. [laugh] but, yeah. i'm, i'm definitely interested. so, i will, i, i'm deputized. i will talk to people whenever i get thechance. i hope that. this episode has been, more educationalthan some of our other ones have been and also, you know, entertaininglike we like to do. we're getting close to the end here.
is there anything that we didn't speakabout that you guys think is important that we didn'ttouch on? >> well, again i want to thank the teamof, of people working, on wordpress core. helen is now heading up the effort. and she's doing an admirable job. she's really, she really needs to know that, the accessibility team is there forher. all of the developers have asked us, inthe last couple of months, for help. and it's really, it's really, a wonderfulthing to see that people are taking this,
very seriously and are willing to hold upproduction if something's not accessible. and that's a, that's a real mark of theunderstanding, and the, the love that they really havefor everyone. because, we've democratized publishingwith wordpress. matt, really, led the way with this, yearsago. i started using wordpress in 2005 foreducation sites and all the education sites i was doing had tobe accessible. and the question was, well, aren't thereany accessible themes? no, there are no accessible themes.
we had to build our own. so team developers need to get on board. plugins, plugins are not regulated in anyway right now. there are some min, minor checks, butplugins are not, there's no accessibility-ready,tags for plugins. so plugin developers need to get on board. everyone in the wordpress community reallyneeds to get on board and make this the, you know, drupal has, anaccessibility team in house. they really, they really do accessibilityvery well.
of course you can still add inaccessiblecontent. and that's why it's important for contentdevelopers, content providers, and content, editors, and, and writers to justpay attention to some basic routines. so, everyone working together will pullthis off, and we'll make wordpress more and moreaccessible all the time. >> i have, i have, i have issued achallenge to any and all wordpress developers, that, tomake accessibility a baseline standard. you shouldn't, like, honestly, you shouldnot ship a theme for distribution without making itaccessible.
and i am of the very strong opinion that,we should be moving very quickly towards making accessibility tag requirements forwordpress themes in the repository. both in, the directory, and also on wordpress.com, because we can'tcontinue shipping content that, from the platform that runs the web, that isn't accessible toeveryone. and that starts with, you know, the peoplelike us reading a couple of pages of documentation and then justbuilding it in as a baseline. and it's a challenge.
you just need to learn it. this is, this is the new responsive webdesign. you jump on it, you'll realize thatthere's so much value in it, and you'll realize that it makes you, itmakes you a better developer. it makes you a better content strategist,and it makes you more valuable to the people you sellyour services to. so there's money in it. there's, pride in it. there's, you know, better content in it.
there's no good reason to not do it exceptyou have to learn it. >> yeah, and if you do it now do you getto, like, be all smug and be, like, an earlyadopter, you know. >> early adopter. >> no, when everybody is all oh, we gottado accessibility, i can be like, i've been doing that foryears, man. you're lame. >> it feels like what, 2005. early adopters started in 1999, [laugh]
>> well the technology become matureenough that we should be building it in, right? you can say that you're not an earlyadopter. you're one of those smart people whowaited until it wasn't so hard anymore. >> joseph, joseph is the og ofaccessibility. >> oh dear. >> [laugh]>> watch out. >> alright guys. >> i'm from la.
>> [laugh]>> right. >> nice. >> thank you guys. that was awesome. yeah, thanks, thanks a lot for coming on. this has been a very eye-opening show. i hope a lot of people got something outof it. and, we are gonna do our best to get allthese links collected up, added to the show notes afterwards, and we will try
to organize everything in a veryaccessible manner. so, where can everybody find you guys, on the web to come say hi if they wannatalk to you? >> twitter. >> the hashtag for, the wordpressaccessibility team is #wpaccessibility. you can start there. #wpaccessibility. and i am @accessiblejoe. >> cuz he's very accessible.
he's a og. >> what about you, morton? >> i am morton. like m-o-r-1-0, mor ten, cuz that's myname. you can find me on twitter at @mor10, andyou can find my website at mor10.com. >> or you can go in to lynda and watchsome of my courses. i am working on some pretty extensive wordpress accessibility stuff there, toonow, so. go, go on twitter and listen to me rantabout stuff all the time.
[laugh]>> there you go. that's always fun. and then rian? >> i'm on twitter. rian rietveld. that's difficult. [laugh]>> we'll tweet it out. we'll take that approach.
>> i want to add that rian is a mainstayof the accessibility team. she's always there, working away in thebackground unsung, unsung hero. they're all unsung hero. >> [laugh] thank you. >> with the accessibility thing. but she's doing great work. >> well, i'll, i'll tell my son thatlonesome hero, okay? >> [laugh]>> she's doing great work. she's really a, a mainstay, and i, my, my
thanks go out to all of the accessibilityteam members. and, especially rian for, for contributingso much over so many years to making wordpressaccessible. >> no, thank you. >> thank you all. we, we definitely. i, i hope that you guys start to get morerecognition, as time goes on. cuz it sounds like this has been a lot ofwork. >> the team, the team has, they deserveall the breaks they can get.
i'm a super late comer, so. >> i shouldn't even be here. it, it should all be them. like this is what's his name, joe dalsonisn't here. but he's the guy that does it all day. approval of all the accessibility tags. >> he actually, when i, when i posted onmy site that i thought that it should be mandatory, he was like, you are aware thati'm the only person, that i am the bottleneckhere, right?
>> if everyone did it, it was just be one person sitting there, tabbing througheverything to make sure it works. >> but that, you know, that's not a reasonto not do it, that just means more of us need to getinvolved, so. >> have to get involved with that myself. >> alright, guys. well, we're, we're about, out of timehere. before we go i want to say a congratulations to our friend jessepeterson.
i, it sounds like he's going to beadopting a child, which he's been waiting for forquite some time. so jess if you're watching,congratulations man. and, but that's, that's it for the show. we will catch you next week. we're gonna be talking about, wordpresstheme stuff next week. i know for a fact that we'll have drew strojny from the theme foundry is going tobe on, and i think we will also have a few other
people from some of the other large themeshops on. so check us out next week. if you haven't subscribed to the youtubechannel, you can subscribe from the site. there's a button on there to go do that. catch us on itunes. this will be up on itunes as soon aspossible. but thanks everybody, we'll catch you nextweek. >> bye guys. >> peace.
>> bye bye. >> bye.