We tried to make a Shopify theme fully accessible.
In today's episode:
KeySmart
Turbo Changelog
The Ship of Theseus
CORSA Performance
AccessiBe
Away
Kurt Elster: So, good sir, how’s that garage door opener that we installed over the weekend?
Paul Reda: It’s quiet. Almost-
Kurt Elster: Excellent.
Paul Reda: Almost too quiet.
Kurt Elster: I didn’t get to hear the old one. What was wrong with the old one?
Paul Reda: The old one was like… It was just like a machine gun. It was clearly like a weird old chain device and it was like FDDFDDFDDFDDFDD… just going.
Kurt Elster: And it was like startlingly loud.
Paul Reda: It was startlingly loud, whereas this one is startlingly quiet, like you hit the button, and there’s a split second where you’re like, “Is it going?” And then it makes enough noise that you realize it’s going. Because it also eases into the pull up.
Kurt Elster: Yes. It’s a belt drive DC motor. Very exciting stuff.
Paul Reda: Oh yeah.
Kurt Elster: It’s very quiet.
Paul Reda: It’s thrilling.
Kurt Elster: Compared to those chain drive AC motors. No, I don’t think so. None of that for us. No loud garage door openers. I look like a cave man? Ridiculous. All right. Did I mention getting a rabbit? I got a rabbit.
Paul Reda: Oh, you got a rabbit? I’ve never heard about this rabbit. Had no idea. I’ve never seen an Instagram video of it or you directly texting me videos of it. I had no clue.
Kurt Elster: Right. Yes. No, this is all new information for you. My wife’s lifelong dream was adopt a bunny, so when she said, “Can I think about getting a bunny?” I was like, “All right, adopt a bunny.” She didn’t know what to do. She’s like, “Is this a trick? What’s the problem here?” So, I was like, “All right, just get a book, be a bunny expert, and if a month, if you still want to adopt a bunny, go for it. I will support you. As long as I don’t have to do anything.”
I’m just a passive participant in the bunny adoption scenario. But I wanted to be a good bunny parent, so I read up a little bit, and lo and behold, the bunny has… I am the chosen one. I am king bunny. Those memes about the dads who didn’t want pets, and then they’re in love with this cat. That’s basically me and this rabbit now.
Paul Reda: Yeah, and that might be happening with us, because my wife wants a dog really bad, like she’s a heavy, heavy dog person, and I really don’t care. And before, we were fine, because the apartment didn’t allow dogs, but now it’s like, “Oh, you have a house. We can get a dog now.” And she’s been ready for this dog, and I’ve been like, “Can we hold off on it until our house has stuff and we feel lived in and comfortable in it?” Because you’ve been there. The entire first floor has no furniture in it. It’s just a giant, empty space.
Kurt Elster: You know, I wouldn’t feel too guilty about that with A, the pandemic, and B, I did the same thing in my house.
Paul Reda: Oh, no. I’m not-
Kurt Elster: We moved from like 1,400 square feet to 4,000, I’m not spending money on furniture for all that extra square footage. You just gotta space out what you got.
Paul Reda: Well, and I’m not even feeling bad about it, and yes, its’ impossible. There’s things that we bought before we moved a month ago that we still haven’t gotten yet.
Kurt Elster: Oh, geez.
Paul Reda: Everything is at least three weeks out.
Kurt Elster: Yeah, it’s funny that supply chain issues have not stopped. It’s just an ongoing concern. It’s like, “Oh, you’re gonna order something. Am I getting it tomorrow or a month from now?”
Paul Reda: Yeah. Every piece I’ve ordered is at least two to three weeks.
Kurt Elster: Well, and that’s also an area where because people were spending so much more time in their homes, there’s a lot of home upgrades happening. Like even I notice it just in walking around our neighborhood. There’s just so many clear construction projects, and renos, and remodeling, and maintenance, deferred maintenance and repair that’s finally happening.
Paul Reda: Yeah, but so, we got other projects we want to do, and I’m kind of like, “Can we just have the house feel like it’s done and have a party, and then we can get a dog?” And there were a lot of things that were like her job, of like she was supposed to handle, and they weren’t getting done, and I was sort of like, “Hey, you know what? Whatever. We all got our own stuff to worry about.” She literally every weekend goes to work in the ICU, in the middle of the pandemic.
Kurt Elster: Hey, thank her for her service.
Paul Reda: Yeah. No, I do. I thank her for her service every night.
Kurt Elster: Yes.
Paul Reda: And suddenly last night, when I was like, “Yeah, I don’t want to get the dog until the house is done.” Weirdly lo and behold, lot of movement this morning on the contractors and other people she was tasked with hiring. Funny how that worked out. That was a block to the dog.
Kurt Elster: You need the carrot and the stick. And the dog was both carrot and stick, because you’re like, “No dog.” Also, you get dog if these things get done.
Paul Reda: Yeah.
Kurt Elster: Yeah. That’s some important management lessons right there.
Paul Reda: Yeah. You know, that’s how you want to treat your spouse, is you want to just manage them. That’s healthy.
Kurt Elster: Yes. Yeah, much like I manage my children. The have quarterly reviews. They’ve got KPIs that we follow. None of that is true. So, what was funny about the rabbit, though, the… Years ago, like multiple years ago, we did some theme customizations on a site called, a Shopify store, called Small Pet Select, and their big thing was like they sold the best Timothy Hay for your small animal, be it rabbit, a guinea pig. Apparently, if you’re like a rabbit, hay is extremely exciting. This rabbit goes bonkers when we bring out some hay.
And when you think about how does your customer hear about you and why is my conversion rate only like 1%, well, because it’s people like me who go, “Oh, that’s interesting. That’s cool.” And then literally years later, when my wife’s adopting this rabbit, I go, “Hey, check out this site that we worked on that is known for having phenomenal Timothy Hay.” Order from here, and now I have a gigantic, unreasonably large quantity of Timothy Hay from a Shopify store in my garage.
Paul Reda: I went to high school with a guy named Timothy Hay.
Kurt Elster: Really?
Paul Reda: No.
Kurt Elster: Oh, I was like, “Is this a bit?” Did he really… I’d like to know more about Mr. Hay.
Paul Reda: No, I didn’t.
Kurt Elster: I don’t know why it’s called Timothy Hay. I don’t know. I specified the kind of hay. I don’t know the difference between hay. I guess there’s different hay.
Paul Reda: We’re city boys.
Kurt Elster: Yeah, as city boys, like a hay bale is a thing you buy as Halloween décor.
Paul Reda: Well, and you feed it to a horse.
Kurt Elster: Okay, true. Or your small pet. All right, so apparently we’re recording a podcast about eCommerce here. Today, on The Unofficial Shopify Podcast, we’re gonna cover four things. What’s new in Shopify themes. Okay, so really we’re gonna talk about Turbo specifically, but it applies to all themes. What we’re working on, a few neat things. The broken promises of accessibility. Ooh, man. Oh, you’re gonna get a Paul rant on this one. And then finally, a teardown of Away Travel. Mr. Reda, did I get that right? did I miss anything?
Paul Reda: Well, you’re the one that writes the show notes, so I would hope you have it right.
Kurt Elster: Just play along. Oh my God. Like, “No, no. That’s what we went over in the morning meeting and nailed it.”
Paul Reda: Yeah. I believe you-
Kurt Elster: I just sent it to you in Slack, it was like, “This good?”
Paul Reda: Yeah. You sent me a text file that I have opened. I mean, I assume you’re reading it, too.
Kurt Elster: Yes. Well, I have mine printed. I’m very fancy. Okay, so our recent work, had we mentioned that that KeySmart site went live in the past?
Paul Reda: I don’t know. Was it live two weeks ago when we last recorded?
Kurt Elster: I have completely lost track of time, like I can no longer sequence events. It’s horrible. So, if we’ve talked about KeySmart before, I’m sorry. But that site’s awesome. Really cool. GetKeySmart.com. It’s a severely customized version of Turbo, like Turbo’s the base. I would in no way at this point call it Turbo, because it’s really we use Turbo as a framework, and then it’s all custom page templates.
Paul Reda: Yeah. If there’s blame, put the blame on us, not on Turbo.
Kurt Elster: Yes. Yeah, leave out Out of the Sandbox out of this. Those poor, poor devils. No, I think of all the sites we’ve worked on, the custom themes we’ve worked on, this one has more custom templates, like product templates, page templates, than literally any other theme, right?
Paul Reda: Yeah. We made a huge error in doing this before Sections Anywhere launched, because they want a custom template for every single product on their store, and so I had to do that, and it’s a nightmare to keep up. And if we had Sections Anywhere, it could have just all been one thing.
Kurt Elster: And so, this gets into the very real problem of why Sections Everywhere is being rolled out, and why it’s such a big deal. It’s gonna be a heavy lift for every theme developer, for merchants who have to upgrade themes, but I think it’s absolutely gonna be worth it. So, like the current scenario is you’ve got your standard product template, and then let’s say you’ve got a fancy product template. Out of the Sandbox and their themes has product.details, in which you can add a bunch of section blocks into, like at the end of the theme description. So, you could do really fancy article pages. I’m working on one right now where I’m literally taking someone’s blog articles and piecing highlights into a bestselling product.
The problem, if you’re doing this for one product, or you have like one… You can apply this template to multiple products, you’re good. The moment you have to have separate detail templates for separate products, you have to duplicate the template, right? And then that means if there’s a new section added, okay, I have to add that to every single template. The whole thing becomes unwieldy the more variations on this template you make.
The idea behind Sections Everywhere is all this stuff becomes universal and works in a much saner fashion. So, I’ve got like sections that would work on my homepage, sections that are added by apps dynamically, sections for product pages. There’s just like one… The way I understand it is I get like a universal bucket of sections and I’m no longer dealing with the multiple templates thing, where currently your sections and your content are tied to the page template file itself. In this new version, it’s gonna be tied to the URL. So, I could be like, “All right, I want page.details on these 10 products.” And the content on each of those templates is unique per each product.
Paul Reda: Yes.
Kurt Elster: Essentially, it turns the whole thing into like a drag and drop WYSIWYG editor. Okay, we won’t go that far, but it’s getting there.
Paul Reda: Optimally, yeah. It’s closer to that than the current situation.
Kurt Elster: And I have yet to actually play with this thing or see it in the wild, so I’m speculating. But this is the way I understand it. This is my dream, anyway.
Paul Reda: Yeah, I hope so. I hope that’s how it works.
Kurt Elster: I hope it works that way.
Paul Reda: I hope it appears.
Kurt Elster: Yes. Well, I’ve heard… The scuttlebutt is like it’s actively being worked on and that it is coming. It is not vaporware. Let’s see. Ooh, and another, I wrote down all the stuff we worked on, but rather than go at it forever, just want to cover a couple others. I worked on this site, and if you’re not into guns, I’m sorry. I don’t actually own a gun, but we worked on the site Flashbang Holsters. It is a women-owned business and they make gun holsters for concealed carry specifically for women, and their big seller is a bra holster. And so, they had… It was a great product, great market, sold well, but the site, the theme itself was not doing them any favors, and because this is a new product for most people, there’s a ton of questions around it. Especially around like sizing and fit. So, we went through and I answered, I built a whole FAQ section for them and really fancied up the template, and I’m thrilled. The conversion rate on that after seven days, and that’s not a great sample size. It’s a short window. But it’s up 20%, so I love those scenarios where everything about the Shopify business is successful, but really just the presentation of the theme is holding them back. And so, being able to go in and set up a really polished, pretty theme setup, and then see a week later your average order value and your conversion rate, and add to cart rate, and see all those KPIs go up. It’s just really satisfying.
Paul Reda: Yeah. That’s our sweet spot, is you have your entire business figured out and can execute it. It’s just that your website needs improvement.
Kurt Elster: Yeah. Needs some-
Paul Reda: Then we can just like help you print money if that’s the situation.
Kurt Elster: Yeah. Because that’s like, that is our core competency, I think. Those are the projects that have the highest impact and move the fastest. So, Shopify themes have been seeing some updates lately.
Paul Reda: Have they?
Kurt Elster: Yes.
Paul Reda: Well, yes. Yeah, it’s been terrible for us, because once again, we did a bunch of work, starting on new theme developments in January and February, and then Shopify dropped AR and video support for everyone into your product areas, and then Turbo updated itself to Turbo 6.0, which includes all that, support for all that stuff. See, the thing is, though, we had already started all of our projects, and we were like 30 to 70% done on all of them, and then the people were like, “Oh, can I get video now?” And we were like, “Oh no, we started you on the old version, so we would have to start literally all over again.”
Because all these projects are intense, screwing with the base Turbo theme, like you’re never updating this ever again, because we screwed with it too hard.
Kurt Elster: Yeah, it’s no longer.. It’s like only 20% Turbo by the end.
Paul Reda: Yeah.
Kurt Elster: It’s like when you see a really custom car and they’re like, “It’s a Ford Focus.” Not anymore, it’s not.
Paul Reda: Who’s ship was it? I’m trying to remember. There’s a philosophy question of… It’s an ancient Greek name and it’s his ship, and then as the ship breaks, he replaces all the boards on the ship, so when he’s done, over the course of his travels, after he’s replaced every board, is it still the same ship? And if the answer is no, when did it stop?
Kurt Elster: Oh, I don’t know.
Paul Reda: Yeah. Think about that.
Kurt Elster: Yeah, we’re dealing with that with these custom themes now.
Paul Reda: Think about that!
Kurt Elster: Well, actually that brings up an interesting question. So, there’s other changes they added, but the one we’re seeing the most requests for is this native video support. So, first describe to me this Shopify product media types, this native video support.
Paul Reda: Oh, and so the thing is is that Shopify boned us, in that our-
Kurt Elster: Technical term.
Paul Reda: Technical term. In that our clients didn’t know about this, but then Shopify put a message in all the product pages that was like, “Oh, hey. You could drop videos in here now, but the videos won’t work unless your theme supports it and updates it, supports it.” And so, all of our clients were like, “Oh, does our theme support these videos?” And we gotta be like, “No. You should have waited-“
Kurt Elster: No, we have to add it.
Paul Reda: You should have waited two months, then it would have.
Kurt Elster: Well, so if your theme doesn’t support it, you got three options. One, do nothing. That’s always a choice. Number two, run the theme updater if your theme supports it, and pray it works. Or three, back port the support for it into the theme, which is what you ended up doing on several themes. You are now-
Paul Reda: Or get a new theme.
Kurt Elster: Or yeah, upgrade, or just… Only if you were thinking about upgrading themes, I think these are some great reasons to do so. So, what does adding that support look like?
Paul Reda: So, previously products would just have images attached to them. It was product images. And now it’s not product images anymore, it’s product media. And then under product media, it can be like video, it can be… I think it’s called, I think AR is what it is. I don’t remember what the-
Kurt Elster: You could do 3D, or you can do augmented reality.
Paul Reda: Yeah.
Kurt Elster: Both of those require you put in a 3D model.
Paul Reda: Product media. Shopify Help Center. I’m just gonna look it up. Yeah, so now there’s videos, 3D models, and images is what they’re called, and so then you call them and it’s like... Well, okay. It iterates through all the product media and then it has to… You have to set up rules where it’s like, “Okay, if the product media is a video, do this. If the product media is an image, do this.” But I mean this is probably the most complex part that I deal with on a regular basis, is because if you think about product media, it is a… It affects a bunch of stuff, like you have it’s a whole slideshow, so it’s like, “Well, you gotta make sure all the AR and the video shows up correctly in the slideshow.” There’s all the variants connected to it, so it’s like, “Oh. Well, when it selects, when people are selecting the variant, like the color, you’re gonna want it to switch to that color and do all this other stuff.”
So, there’s a lot of moving parts involving the product media, and now they’ve added this whole new type and you gotta just rewrite the whole friggin’ thing. And then there’s all the video rules, where it’s like, “Okay. Well, is the video gonna auto play? Is it not gonna auto play? How does this work?” I haven’t touched any 3D model stuff yet. I don’t even know how to do that.
Kurt Elster: I’ve seen it on a few stores. Brent Doud’s Tosso, he set up a demo where it’s literally like if you Google Tosso 3D collection, I think he has a collection literally for just demonstrating this effect, and it’s really cool, and it works natively on iOS devices, so it’s not like they have to download some extra app or anything. It just works in Safari. It’s very cool. The tough part is who the heck knows where the heck to get a 3D model made? From the people I’ve talked to who’ve done it, it’s not expensive, but you still gotta source it and do it.
Paul Reda: I assume it’s a thing where it’s like there’s guys that can do it, and it’s fine, and then there’s guys that can do it and it’s awesome. And you have to-
Kurt Elster: Probably.
Paul Reda: You gotta shop around for the people that truly know what they’re doing.
Kurt Elster: It was cheaper than I thought it would be, though. And I think it also depends on what your source material is and how complex it is. Obviously, like a teapot is a lot different than a stroller to model. But yeah, they’ve got… If you upgrade the theme to support product media types, you get video, augmented reality, and 3D, where you just drag and drop it and it works. The other native support that these themes are adding now is Shopify’s native currency selector, so person can pick their theme on the front end, and all the prices show correctly, and then in checkout, if you’re using Shopify Payments, it processes everything in their native currency. You don’t have any control over it, it does all the conversions automatically. In Shopify Plus, I think they’ve got rounding rules, where you can make it round, so instead of being like 74 cents, it always rounds it to 99. I think that’s nice.
And also, Shopify’s native multilanguage capabilities have rolled out, as well. So, I think those three are good reasons, if you’re looking for an excuse to change themes or update your theme.
Paul Reda: Yeah, and for the video, it supports your own HTML5 video. If you have, you can just drag and drop in there, or there’s one that’s add video from URL, which currently only supports YouTube. But you could put a YouTube link in there and it pulls it.
Kurt Elster: Oh, that’s cool.
Paul Reda: Yeah.
Kurt Elster: I like that. And then specific to Turbo is they had that thing where you could show the second product image on hover on desktop in the collection grid, which I really liked. That also supports video now, so if you’ve got like you do your first image as your default image, and then your second image, you do video, and then if they hover over it, the video auto plays as in the thumbnail. So, that one you can actually see in action on CORSA Performance, where they do… Many of them have a video clip so you can hear the muffler when you hover over it. It plays it right in the collection. I thought it was really cool.
Paul Reda: Oh, it’s got sound?
Kurt Elster: Yeah.
Paul Reda: I was thinking of it as like an animated GIF replacement.
Kurt Elster: Maybe it doesn’t have sound.
Paul Reda: I don’t think it-
Kurt Elster: Don’t quote me on that. I don’t know. Just go play with it. I don’t know what I’m talking about half the time. It’s just not that old. I don’t know what I’m doing.
Paul Reda: Don’t I know it?
Kurt Elster: I want to hear about accessibility.
Paul Reda: I’ve been dealing with some stuff. So, where to begin?
Kurt Elster: All right. Well, let’s start with number one, over the last several years we have seen merchants getting hit with accessibility lawsuits. How does that work?
Paul Reda: All right, so in I believe 1990 or 1991, Congress passed a law called the Americans With Disabilities Act, and it guaranteed… Well, it required of businesses to provide accessibility to people with disabilities, like if you are in a wheelchair, there need to be ramps so you can get in. And if you’re blind, there needs to be a way for blind people to navigate your location, your place of public accommodation. And it’s a big law, it’s a important law, because disabled people are citizens too and deserve full access to our country, and everyone will be disabled one day. As you grow old, you will lose certain abilities.
So, the problem was this, and you have to be a certain size. I mean, some mom and pop shop in a small town isn’t gonna have to tear down their entire building because it’s not accessible. The problem was this law was written in 1990, so it doesn’t talk about websites at all, but it talked about stores, and so now the question is, “Well, does the American Disabilities Act apply to websites?” And if a blind, a person with site issues, or mobility issues can navigate your website, or if they can’t navigate your website, are you breaking the law?
And so, there’s like within the five years or so, there’s been a lot of… I would call them shady lawyers in that there’s just lawyers that are just sending demand letters to small businesses being like, “We went on your website, your website is not ADA compliant. You need to send us money as a settlement agreement. Otherwise, we are taking this to court and you’re gonna have to fight is in court.” And this whole thing. And they have these straw plaintiffs, which are just like they found a random person who has sight issues, and then using that person. That person’s working with them, and then they just sue like 50 companies at one time, and they’re just sending out demand letters and looking to get cash payouts. Like this isn’t-
Kurt Elster: This feels-
Paul Reda: It’s not about changing the websites and making things better for other people, it’s about just getting quick hits of cash.
Kurt Elster: Yeah. It feels like patent trolls.
Paul Reda: Yeah. And the thing is is that it’s up in the air, because the government has not stepped in with any sort of standards. The internet standards people kind of have a standard, but they’re working on it and it’s not consistent, and the internet consortium standards don’t have the force of law, so if you get sued and you go to a judge who’s like some 65-year-old federal judge who doesn’t use email, there’s a good chance of that, then it becomes like, “Okay. Well, how am I gonna convince this judge about what a website means?”
I mean, everything writing the laws these days is like in their frickin’ 70s. So, it’s just this horrible gray area that a lot of vultures have swooped into and are just feasting on people.
Kurt Elster: And so, you’ve got this scenario where you do your best to build a website, but because the standards are kind of lax-
Paul Reda: The standards-
Kurt Elster: You were-
Paul Reda: The standards, the legal standards are just a complete Wild West show. I mean, I was complaining because we were trying to do this for one of our clients that was getting sued, was that it’s just like, “Oh yeah. Well, guess what? You have a website, so one day a velociraptor’s going to show up at your door and tear your arm off, but it might not.” Oh, God. Well, how do I stop the velociraptor? Oh, no one knows. There’s nothing that we can guarantee will stop it. I mean, you can do this stuff that might make it not come get you, but it might come get you, but also there’s only like a 1% chance it comes and gets you. But if it does come and get you, it’s gonna rip your arm off. Like, “Okay. Well, what do I do?”
Kurt Elster: Yes. Yeah, and that’s the problem, is it really is unclear what your level of responsibility is, and I think it comes down to is the website accessible. We understand that, but then what is the definition of that? And so, there’s a series of guidelines and standards that you’re supposed to implement on a site, but it turns out they’re a little squishy, and a little strange to implement. What was your experience there?
Paul Reda: Let me just wheel this back for a second.
Kurt Elster: Okay.
Paul Reda: So, in the court part of it, there have been federal court rulings. In some places, the judges have been like if it’s just a website, it doesn’t count. You can’t sue them. Get out of here. And then in other places, most specifically in a ruling against Domino’s, there was a ruling against Domino’s in federal court a couple months ago-
Kurt Elster: The pizza people?
Paul Reda: The pizza people. Because whatever, it was determined that the Domino’s website was not accessible to order a pizza. The judge was like, “Well, the law clearly applies to you because you have a bunch of stores, and since you have stores that fall under the ADA, that means your website must also fall under the ADA.” And so, it was like okay, well, that’s some guidance, but what if you don’t have a physical location? And it’s like, “Well, I don’t know. We’re back in the Wild West again. Who knows?”
So, it’s really bad, and this was also happening with a lot of hotels a couple years ago.
Kurt Elster: Right. I think that’s where… Isn’t that where it started?
Paul Reda: I think it started with hotels a couple years ago, and then like all hotels banded together and just formed… They were like, formed a collective defense agreement or whatever and were like, “We’re gonna fight all of these lawsuits. If you want to take us to court, fine. We have a ton of money that we are now throwing against our giant lawyers to fight all these in court.” And so, then it became no longer easy money, and now these guys moved on to small eCommerce places.
Kurt Elster: All right. How do I test for it and then how do I fix it?
Paul Reda: I don’t know. You’re the one that knows that.
Kurt Elster: Okay. Well, so ultimately-
Paul Reda: I just do the things I’m told.
Kurt Elster: There’s a series of guidelines called WCAG 2.1. That seems to be our safe harbor. If you can meet those guidelines, then your website should be accessible. And that’s all technical. In addition to that, you need to have an accessibility statement on the site where you explain like yes, this is important, and we take it seriously. Here are the accommodations we’re gonna make for you. And if we have still failed you, here’s how to get ahold of us so we can take care of it for you. I also like to go a step further and just put it in the footer and say, “Hey, if you are having any diff…” That way it’s on every single page on the site. “Hey, if you’re having any difficulty accessing the site because of an issue related to the Americans With Disabilities Act, please, here’s how to get ahold of us. We will take care of it for you.”
And hopefully then you can get details on what the issue is, you can directly use customer service to assist the customer, and then go back and fix the issue on the site. All right, so how do you figure out if you are in line with those WCAG 2.1 standards? There’s a ton of accessibility testing tools out there, and I think they’re all garbage. The one that… Yes. The one that didn’t suck was accessiBe’s audit tool, and it’s extremely detailed, it was extremely helpful, and it’s the one that you followed in implementing their best practices on the site.
The problem is even trying to implement everything that they tell you, you still can’t quite get to WCAG 2.1 because of technical limitations with apps, with Shopify. At least as by the way this testing tool has defined and tested for it. So, once we got that far, where it’s like, “Okay, we’re like 80% of the way there. We feel good. We have made clear effort to fix this, to make this easier for someone using a screen reader, a blind reader.” And then the final step was there are accessibility enablers. They’re apps, scripts, widgets that add a bunch of tools to the site that let people more easily navigate the site and also kind of like customize and modify the site so they can read it more easily. Like for example, if you have dyslexia, some fonts are harder to read than others, so there’s a font called… I think it’s called Open Dyslexia, and that… It’s an open source font for dyslexics, and an accessibility toolbar could switch the whole site to that font, make it easier to read.
Paul Reda: I think that font was debunked.
Kurt Elster: Oh, really?
Paul Reda: Yeah.
Kurt Elster: Oh no! Oh… All right, don’t listen to me. I picked a bad example there. But yeah, I think a lot of… I think the most important part is to go, “Yes, we’re taking this seriously, and yes, we’re trying, and here’s… If we have failed you in any way, here’s what you can do about it and how we can help you.” I think showing that is really the most important part here.
Paul Reda: Open Dyslexia’s benefit has been questioned in scientific studies. So, maybe semi bunk. And you know, to go back what you were talking about, a lot of the stuff in the ADA involves good faith efforts, so if outside your store, you are putting in a ramp to allow for wheelchair access, but the ramp doesn’t conform to the actual standard of what a ramp has to be like, they’re not gonna come down on you as hard, because it’s like you tried to build the ramp, you didn’t build the ramp perfectly, but we’re not gonna give you a frickin’ $50,000 fine for not having the ramp right. Just build the right ramp.
Kurt Elster: Yeah. I think taking it, showing that yes, hey, we were actively taking this seriously goes a long way.
Paul Reda: Yeah.
Kurt Elster: At the same time, it is important to note neither of us are lawyers.
Paul Reda: We’re not lawyers. 100%. We are definitely not lawyers. Don’t listen to us. Hit the button.
Kurt Elster: I do, however, have access to the Law & Order theme.
Paul Reda: Oh my God. I’m reading this from ADA.gov right now. God damn it! Well-
Kurt Elster: That was an accident.
Paul Reda: Will good faith efforts be considered in determining the amount of civil penalty? Yes. In considering what amount of civil penalty, if any, is appropriate, the court is required to give consideration to any good faith effort or attempt by the covered entity to comply with its obligations under the act. So, give some good faith effort. Show that you’re trying. And if you show that you’re trying, you won’t get hit so hard, we think.
Kurt Elster: The velociraptor will not take the whole arm.
Paul Reda: Yeah, it might just kind of like grab your hand.
Kurt Elster: Take out some fingers.
Paul Reda: And whip its head back and forth.
Kurt Elster: Like they do?
Paul Reda: Yeah.
Kurt Elster: Oh, I’d love to go to Universal Studios and see the raptors. They got dudes in raptor costumes. It looks really cool. That’s quite the segue.
Paul Reda: But yeah, it’s terrible. And it’s very hard on Shopify, because you know, it’s a content management system, so you have all these blocks. So, I struggled with this when I was trying to implement it this week, was okay, well, images are supposed to have alt text. That’s part of the image standard is there’s an alt in the image and that’s the title of the image, or describes what’s in the image, or something like that. If you think of all the blocks on your homepage where you’re putting in images in there, there’s no place to put the alt text. And in the Shopify files section, there’s no place to give the alt text to an image. So, it’s just like the entire homepage is just… and you can’t go into the code and type in the alt text, because that little snippet is applying to… I mean, this is especially bad in the current version of Turbo. All the images in Turbo are in a single snippet called Image Element that they then apply a lot of their stuff to, where the image will all be properly sized, and it’ll be using the proper file format, and the image is never bigger than the box it’s supposed to be in to save on load times.
But what this means is every image is one snippet, so I can’t put alt text in there, because that would be the alt text for literally every single image on the site.
Kurt Elster: What’s funny is this is in Canada; they are much clearer. They say websites have to be accessible. Period. Done. I believe that’s the federal law, but again, I don’t know what the standards and enforcement are for that, and so, and you ran into issues just looking up the guidelines and enforcement. Like you sent me a screenshot of one that was like, “This page is a placeholder. Don’t look at it.” What?
Paul Reda: Yeah. I mean, we got… accessiBe dinged us for something and I was like, “Okay. Well, I have no idea what that is. Gotta Google around to learn how to do that correctly.” And the number one hit on the Google search was W3.org, the main standards group for the internet.
Kurt Elster: That’s the standards body for web browsers.
Paul Reda: And I clicked on the number one Google hit for this thing and they were just like, “Yeah, we’re still working on this, so this is here, but it’s a work in progress and doesn’t count, so don’t read this.” And it’s like-
Kurt Elster: Oh, geez.
Paul Reda: Could I get in trouble for this, though? What am I supposed to do?
Kurt Elster: Yes. So, you’re trying to do your best. You’re trying to make it work. And you’re trying to make it happen, but then you find all right, unless literally everybody, from regulatory committees, standards bodies, third-party vendors, everybody gets on board and goes, “Okay, here’s the guideline. Here’s the standards and we’re gonna adhere to this. And then also we’re gonna have actual, real-life people with a variety of disabilities test these things.” Well then, how are we ever gonna… Unless we commit and do that, how are we ever gonna get through this problem? And it must be maddening to use a computer if you’re blind and using a screen reader.
Paul Reda: Oh, it must be terrible. We see the code that people write that we’re like, “Ew, this website is trash.” Like I can’t even imagine trying to go about your day to day trying to do things online.
Kurt Elster: Yeah, so 100%, I’m on board and it’s important. The problem is everybody else has gotta get on board, too.
Paul Reda: Yeah. No, accessibility. Great. Good. We want to do whatever we can to make that happen for our clients and for their customers, but there has been a complete regulatory vacuum of how to do this properly, and the vacuum is being filled by nuisance lawsuits.
Kurt Elster: Yes, so-
Paul Reda: So, you’re just like some random mom and pop, and it’s just like, “Well, you need to give me $20,000 or whatever right now, otherwise I’m gonna take you to federal court and you’re gonna have to pay an attorney $20,000, and then maybe you’re gonna get a judgment against you and have to pay more.”
Kurt Elster: Yeah, and it’s not a great look for eCommerce platforms to have their merchants getting sued left and right, so more incentive. Unfortunately, these nuisance lawsuits are what drove us to look into and take a serious look at like, “Okay, what is the situation here and how do we fix it?” And I think the same thing is gonna have to happen for a number of parties involved to make this work.
If you’re thinking to yourself like, “Well, that was one big client got hit with that.” In the last two years, I have lost count of the number of people who have said to me that they have been involved in one of these accessibility lawsuits. I know a double-digit number of merchants that this has happened to, and most just gave up and paid the money. And it was a non-trivial sum.
Paul Reda: Yeah, and it’s not like paying the lawsuit to that one person and that one attorney. “Okay, well, I got hit. I got the COVID, but at least I’m immune now.” You’re not immune now because you paid out-
Kurt Elster: Could happen again.
Paul Reda: You paid out one lawsuit. It could happen again. There’s no guidelines on the ground of what will make me safe from these lawsuits. No one can guarantee it. And that is a problem.
Kurt Elster: All right, so now if we have suitably frightened you, the answer is check out one of these accessibility enabler apps. I’ve tried several. I really liked accessiBe. It’ll let you audit the site. It’s got a very affordable tool to add an accessibility toolbar to the site. I believe it can generate the accessibility statement for you. But at the same time, your accessibility statement, you can write it yourself. You need to take it seriously. If you’re gonna put it out there, you gotta follow your own policy.
But it really just has to say like, “Yes, accessibility’s important to us. And if the website is in some way inaccessible, here’s every way possible to get ahold of us and we promise we’ll take care of it for you.” If you’re worried about it, if you want to take it seriously, that’s what you should do. And this is not limited by size. I mean, if you are running an online store, I think at this point, it’s now a requirement.
Paul Reda: 100%. It’s like there’s two good reasons to do it. One, it’s good to support people and give them-
Kurt Elster: It’s socially responsible.
Paul Reda: It’s socially responsible to give citizens access to your public accommodation, and two, you don’t want to get sued and lose a ton of money.
Kurt Elster: Yes. Now, let’s do a website teardown.
Paul Reda: Here’s the thing. We’re at 42 minutes.
Kurt Elster: Shit.
Paul Reda: These website teardowns generally are 40 minutes. Are we going to 80 minutes?
Kurt Elster: What if we do the teardown in 20 minutes?
Paul Reda: All right. Well, you better speed it up.
Kurt Elster: All right. I did not realize that our accessibility conversation would be so spirited.
Paul Reda: Well, I’ve been struggling with it for the last two days, as you’ve seen from my Slack chats.
Kurt Elster: But you did it.
Paul Reda: Well, here’s the other problem. I did do it. I typed in all the stuff that accessiBe told me to type in, and then when we reran the thing, it was like, “None of this stuff got done.” And I’m like, “It’s right there!” It’s there. I did it. So, I don’t know.
Kurt Elster: Okay. Let’s see. Let me record my screen.
Paul Reda: All right, so we’re doing Away, which is a travel company. They sell suitcases. But apparently, they’re a tech company. I don’t know why that makes them a tech company. They just sell suitcases online, as I-
Kurt Elster: It’s direct to consumer.
Paul Reda: I’m pretty sure Samsonite also sells suitcases direct to consumer. Is Samsonite a tech company?
Kurt Elster: No, they are not. If you want the background here, check out even just their… They have a Wikipedia article. They have been in the news quite frequently, mostly over a… They had a lot of PR moves, but then some atrocious company culture surfaced.
Paul Reda: Oh yeah, the CEO was like a monster, and she got kicked out.
Kurt Elster: Yeah. December 5th, 2019, a report from the Verge described a toxic workplace and, “Culture of intimidation and constant surveillance at Away.” And the CEO apologized, said she was appalled to read her own messages. They literally just had her Slack messages in this article. It was brutal. Anyway, all right, so if you want to look that up, feel free. But let’s look at… We’re not here to gossip. Let’s look at AwayTravel.com. I’ve got it open in front of me. Do you see it?
Paul Reda: Oh no. It’s a Shop dropdown.
Kurt Elster: No! Landing on this site, my initial impression is it is minimal to the point of being… It looks sparse.
Paul Reda: It’s bad. It’s like too minimal. I mean, and the shop dropdown only has five things in it. And what, just shop all. Just put the four things in the main navigation.
Kurt Elster: Agreed. Yeah, I think because you’ve got… Yeah, it could just literally be those four things in the main menu, and then they’ve got Explore. That can go in that right menu with like help, our stores, log in. Our stores. Oh my gosh, they got a lot of locations. Okay, so there’s no video on the homepage. There’s a little bit of CSS animation that’s nice. And we got some social proof. We got some press review quotes. Honestly, because Away was an early direct to consumer darling, DTC, I expected an experience, and I haven’t gotten past the homepage, and I don’t own one of these. I really expected an experience more like Allbirds, where it was like hyper polished.
Paul Reda: Yeah, this is pretty basic.
Kurt Elster: At the same time, maybe that minimalism drives conversions, or maybe no one is buying luggage at the moment, so they gave up. Who knows? On the homepage, they have the favorites, which I like. I wish that was the first thing. I think at this point, by the time I hit AwayTravel.com, I know what I’m going for. I’m going for bags.
All right, so I’m going for… I’m gonna go shop, suitcases. I want this original core product suitcase. Okay, so the homepage we’re a little disappointed on. I’m on /shop/suitcases. This collection grid and page I like.
Paul Reda: It’s good. It’s fine. I mean, it’s just another minimalist white space who gives a shit to me.
Kurt Elster: I’m also increasingly anti-design, where things get overdesigned and I start to lose interest, but I like a… A clean collection grid speaks to me, and here the products are all photographed in exactly the same way. This collection grid utilizes white space in a phenomenal fashion. I will say I like and enjoy this collection grid. It is not doing anything fancy. They just committed to doing a grid really, really well.
Paul Reda: All right. Well, they got these little things where you hover over it and it shows you the color swatches, and then if you click on the color swatches, it changes the photo to that color, which is cool from an implementation standpoint, but who is clicking on those tiny little swatches?
Kurt Elster: Yeah, I would not have thought to do it. But I’m sure… I’ve heat mapped this stuff enough to know that people probably would click on this. I just tried to set them all to the same color. Because what’s nice is it remembers. It’s not just on hover. If you click and then move away and do another one, they all stay. So, I set them all to like… I gave them all racing stripes.
Paul Reda: It’s just a radio button.
Kurt Elster: All right, I’m going with the carry-on. I perceive that the carry-on was like the original core product. I’m clicking that guy.
Paul Reda: So, what makes this good? Does it like-
Kurt Elster: Advertising, Paul.
Paul Reda: It holds your stuff.
Kurt Elster: I believe this was the first one that had a power pack built into it, so it had USB ports. You could charge your phone. And then the FAA said, “Well, actually you can’t use that.” You couldn’t use it as a checked bag I think was the issue. Like the battery has to always be with you in case it starts smoking.
Landing on this page, the product detail page, scroll down to the animated GIF background. This is what I’m here for. Look at that thing! It is an animated GIF or video of like a stop motion video of this bag packing itself, and so it’s eye catching, it’s cool, but it’s also a very clever way to illustrate exactly how much it holds, and then at the end, a bowling ball hits it, so we’re to believe the polycarb shell… And then it keeps going. There’s actually a lot of that. A lot of these animations.
Paul Reda: This animation is terrible quality.
Kurt Elster: It’s a chunky frame rate because it’s stop motion. I’m defending this.
Paul Reda: It’s that it’s an HTML5 video. No, it’s like it’s all pixelated. This is terrible.
Kurt Elster: You know, I recall this from some time ago. I think this has been the media they’ve used for a while. Because this feels very familiar to me. And then at the bottom we get our reviews widget. Looks good. Oh, so I can order it with or without the battery now. The Chalet Collection channels the spirit of retro slope style. What?
Paul Reda: Slope style, you know. Is that like skate or die?
Kurt Elster: No. I guess this is a ski accessory? For travelers who want to stay connected on the go. It comes with… You know, I have a $50 Samsonite that I really think is the same damn thing. As an upsell in the cart, I can add checked luggage to it.
Paul Reda: What is that?
Kurt Elster: Whoa!
Paul Reda: What does that mean?
Kurt Elster: Really doubles the price.
Paul Reda: Oh, you can add what, like the garment bag?
Kurt Elster: Mine, I’m looking at… Yeah, carry-on/peak, and if I go back…
Paul Reda: Anyway, I think these videos are trash. They’re pixelated and terrible, and I guess that’s fine that they’re stop motion, but at least take them at a higher resolution, so they don’t look like trash. And also, it looks really ugly how as you scroll up and down, the text on it reveals itself just like chunkily from behind like a shade. Just have it be there.
Kurt Elster: Yeah. I’m with you on the… The CSS animation, in addition to the video-
Paul Reda: The pixelated video.
Kurt Elster: Is going too far.
Paul Reda: I mean, how much better would these videos look if they weren’t stop motion?
Kurt Elster: How would you do that? I mean, it’s literally a stop motion video. That’s how they did it.
Paul Reda: I get it, but it’s like what if it’s just person actually doing the stuff? Like a pair of hands? It would look 10 times better.
Kurt Elster: I think you just don’t like stop motion.
Paul Reda: Well, I just think these videos look cheap.
Kurt Elster: How do you feel about The Nightmare Before Christmas?
Paul Reda: Okay. See, that’s stop motion, and also it was Ray Harryhausen’s birthday, so on TCM, the only channel I watch, they showed a bunch of Ray Harryhausen movies, who’s the king of stop motion. Or like the Empire Strikes Back. Everything on Hoth, stop motion. That was done at 24 frames a second. When I see stop motion that’s like five frames a second, I’m just like, “This is a shitty video.”
Kurt Elster: All right, I accept your view. Once I’ve added the item to cart, and so they tried to upsell me with a personalization, I could personalize it, so I can add a $10 upcharge to get a tag. The initial price they give you is without the battery, and then you add the battery in. That ups the cost. Ands then they’ll also offer you, “Well, hey, did you want to get the matching carry-on with it, too?” So, there’s a lot of efforts to really dramatically increase the average order value.
The other thing that’s interesting is in the cart, the discount code lives in the cart. It’s not in the checkout. But in the cart, again, there’s even more cross-sells, where it’s like, “Add one or two more things.” And it’s like packing cubes. Who doesn’t like packing cubes? I’m getting some packing cubes.
Paul Reda: What’s the mini? It tells you to add things, but you don’t know what they are. The mini is an extremely tiny suitcase.
Kurt Elster: You know what? In the footer of Away Travel, there’s a link with the other policy stuff that says accessibility. I’m gonna click it. We’re gonna go over that. And then we’re gonna wrap up. Accessibility.
Paul Reda: We made people listen to this.
Kurt Elster: I apologize. Away is committed to providing a website that’s accessible and navigable to all consumers, will actively work, et cetera, et cetera. They define the guidelines they use. We use the guidelines of the Web Accessibility Initiative as a model. Looks like that’s from W3. While we strive to adhere, we’re not always possible at all times, and then, so they give you like, “Hey, if you need help,” and then they give you their email address and their mailing address, in case you want to send them a letter about it.
Yeah. That’s what we’re looking for, is you go, “Look, we tried. Here’s specifically how we tried. And if we screwed it up, here’s how to get ahold of us.”
Paul Reda: But let’s give them credit. These upsells are really good.
Kurt Elster: Yes.
Paul Reda: They’re hitting you with upsells when you add to cart. They’re hitting you with upsells, cross-sells, when you’re in the cart. And I’m sure that’s a lot of money for them.
Kurt Elster: And I think what’s going on with that main menu, where it’s like Shop, then Bags, and it’s got an arrow, it’s trying to funnel me. It’s trying to get you to walk through this purchase process. Because if they could do that, like let’s get you to a collection page where we’re gonna show you and make it really easier for you to put together a set, and I think that’s also why I can pick my colors right there, and I’ve got a four-column grid. So, really it’s like, “Imagine this is your luggage.” Right? That’s what’s going on here.
And then, all right, once I start with one and add it to my cart, it’s trying to cross-sell me on, “Well, get the other one.” Like selling, because we’re dealing with a fairly expensive item here, the carry-on I added is almost $300, once I… If I would have added the accompanying bag, the checked bag with it as well, now I’m up to nearly $600. So, it really… It’s a dramatic revenue impact for them.
Paul Reda: I’m gonna disagree with your police work there, Lou. It would make sense if they were trying to funnel you if each of those collections were like a different experience when you click on every single link. Like this is the bag experience, this is the different way we sell you bags, than the-
Kurt Elster: This is our bags experience. It’s called bag.
Paul Reda: When we try to sell you interior organizers. All these links do is take you to a collection listing. There’s no difference in the presentation of what you’re getting depending on what you select. It’s just the products in the bucket. And on all those pages, on some of those pages, when you get to the bottom it says, “Make a set.” And you could click on and build… It has a product bundler where you could build your own set of things. So, if they cared about you making a set, they would just send you to the make a set page.
Kurt Elster: All right, you make a solid point. How do I get to the set? Where’s this make a set thing?
Paul Reda: You gotta go to-
Kurt Elster: Oh, make a set.
Paul Reda: Yeah.
Kurt Elster: Oh yeah. It’s just like an image in the corner.
Paul Reda: This make a set thing-
Kurt Elster: That should be in the main menu.
Paul Reda: That should be in the main menu!
Kurt Elster: That should be a button.
Paul Reda: Yeah, exactly.
Kurt Elster: Oh, this is really cool. It’s like a configurator.
Paul Reda: Yeah. That should be all… This is like all profit for them, because it would… It shoots your average order value through the roof, and it’s hidden on the interior of one collection page.
Kurt Elster: Oh yeah. I just did a set of three with a battery, and it’s $715.
Paul Reda: Yeah.
Kurt Elster: Yeah, that’s where the money’s at. And then when you scroll down, you get your beloved videos.
Paul Reda: Well, and they all fade in and out like halfway through the page, like the fading, where you are on the window scroll is way off. It’s like I don’t need to see things disappear.
Kurt Elster: Let me refresh and see if I can get this. Oh, weird. I refreshed and scrolled to the bottom and I just got the footer, and then I scrolled up down, and then it appeared.
Paul Reda: Yeah.
Kurt Elster: So, it lazy loads this thing. So, you don’t like that it’s got this kind of parallax scrolling thing going.
Paul Reda: I just don’t like the fade out. The fade in and out. It’s just like just let it be there, man. Stop trying to be so frigging fancy.
Kurt Elster: Yeah. Well, and then also doing that load in and out does occasionally create layout issues. In this case, in the reviews, the ask a question button, the layout broke and now it’s like it’s literally in the middle of a review.
Paul Reda: All right, so here’s another weird thing. You’re looking at sets. That makes sense. Go to one of the… Go to AwayTravel.com/uniform.
Kurt Elster: Okay. Travel uniform.
Paul Reda: This is another product bundler.
Kurt Elster: Oh, look at this.
Paul Reda: Which is it takes you step by step and you can build them each individually. Which to-
Kurt Elster: I like this.
Paul Reda: This feels like a way better way of doing it.
Kurt Elster: A carry-on with a pocket. Oh my gosh. Who doesn’t want the pocket? And the battery. And this thing… Okay, and yeah, you’re right, it’s like multiple product forms, and then you pick your two bags. And this, together, they’re $425. That’s a $45 savings. All right, this was our worst teardown ever. I’m calling it quits. I’m packing it in. I’m not traveling anywhere.
Paul Reda: Come on, Kurt. This is a $1.4 billion company. Doesn’t this look like a-
Kurt Elster: You’re kidding.
Paul Reda: No, that’s they’re valuation, is $1.4 billion.
Kurt Elster: Okay. Well, then I don’t feel bad about being hard on them. $1.4 billion?
Paul Reda: Yeah, for-
Kurt Elster: For selling a Samsonite knock off?
Paul Reda: Yeah. Yeah, they’re not gonna exist in two years.
Kurt Elster: Oh. Brutal. Set a reminder. Hey, Siri. Remind me in two years, is Away still around.
Siri: I’m on it. Okay, your reminder is sit for tomorrow at 2:00 PM.
Kurt Elster: Oh! It’s gonna ask-
Paul Reda: Siri! No!
Kurt Elster: They’re probably gonna be around then.
Paul Reda: Oh-
Kurt Elster: All right.
Paul Reda: By the way, the horrible CEO that resigned, she now says that it was not right for her to resign.
Kurt Elster: So, she changed her mind?
Paul Reda: I don’t know.
Kurt Elster: I read in that Wikipedia article, they said that they claimed it was bad reporting, but it was after they apologized. And it had screenshots from their Slack.
Paul Reda: Yeah. It was literally screenshots of all the horrible shit she said. She apologized and resigned, and then was like, “By the way, that was all lies.” Then why did you resign?
Kurt Elster: Oh, and I remember they had… The idea was they had open culture. And the way they achieved open culture was you weren’t allowed to use email or DMs. It was supposed to be everything just goes in a general Slack channel.
Paul Reda: Yeah, everything was public in Slack.
Kurt Elster: Yeah, so she would dress down people in the Slack, but it would be in front of the entire company could see it, and then that’s what the screenshots were of.
Paul Reda: Well, and it was all this weird stuff where it’s like, “Hey, I’m not being negative right now. I’m just trying to call you in, so we could all work together in getting this going.” And it’s like, “Yeah, no matter what language you couch it in, you’re telling someone they did a shitty job.”
Kurt Elster: In front of their peers.
Paul Reda: Yeah, it’s like, “I’m trying to have plausible deniability that I’m being real nice to you right now and not telling you you’re doing a shitty job.” But it might be better if you were just like, “Yeah, you suck.” Anyway-
Kurt Elster: That’s how oppressive devils talk.
Paul Reda: All DTC startups should be flushed down a toilet and that-
Kurt Elster: Oh my God!
Paul Reda: That is my quote for this episode.
Kurt Elster: Oh! Jesus! I don’t know why. All right. Well, this has turned into a train wreck. Let’s get out of here. Please, if that didn’t frighten you off, join our Facebook group, The Unofficial Shopify Podcast Insiders, and I promise we’ll do better next time.
Paul Reda: I only mean like the fancy ones, by the way, that are like venture backed and full of shit. Not everyone.
Kurt Elster: Okay, so just the… There’s a list of approved and disapproved DTC startups. Paul Reda’s the sole arbiter.
Paul Reda: Exactly.
Kurt Elster: Okay, so we’ll… All right, @paulreda on Twitter.
Paul Reda: No.
Kurt Elster: And let him know which you feel belongs in which column. And he’ll publish his findings at a later date. Very good. All right, Mr. Reda. We’ll leave it there. Thank you very much.
Paul Reda: Goodbye.