687: Ben Frain on Responsive Design  ## Metadata - Author: [[ShopTalk]] - Full Title: 687: Ben Frain on Responsive Design - Category: #podcasts - URL: https://share.snipd.com/episode/bae0f1c7-dd75-4eba-abe7-ea0e46383593 ## Document Notes ## Highlights - **Book Structure Focuses On Foundation Then Futures** - Ben structures the book to teach core responsive basics first, then dip-in chapters and forward-looking sections. - He treats responsive as foundational but focuses later editions on what’s changing and worth attention. Transcript: Ben Frain Honest. I think the biggest part is just once you get a title that does okay and you do it in future editions, a lot more straightforward to just do another edition because people know pretty much What they're going to get so the book has certainly changed over the editions in that the responsive web design bit you kind of done and dusted in the first two or three chapters and the Rest then is more sort of dealing with well what's the bigger picture here like you know how do you actually do meaningful stuff with html CSS and what's the stuff coming down the line That's actually going to make a difference to how you get stuff on the page or build stuff going forward? So the pattern it's sort of taken the last two editions is it's kind of like foundational stuff to begin with and then there's these chapters which you don't have to read through chronologically. You can just dip and out of and then the last section two or three sections is like what's coming down the line like what's worth paying attention to you know from my point of view um because So that's nice stuff still aren't we um i can tell i ([Time 0:03:16](https://share.snipd.com/snip/7c8bba99-622f-452f-a754-bb28804cfa06)) - **AI Shines For Prescriptive Tasks** - AI tools excel at prescriptive, deterministic tasks like array manipulation and regexes. - They struggle with nuanced creative decisions or less-documented patterns where human judgment matters. Transcript: Chris Coyier It because i'm just like you know what i don't mind it being there they're probably right to make you do that but it does have this smell of like dude i absolutely guarantee he was asked Ben Frain The same thing of like because we we've been around for a while where yeah i'm not really on the hype train with the ai stuff i use it as a tool but for me it's more just about having it's almost Like having another developer with me that i can chuck stuff to and then i still have to validate it and go all right what did you actually do here is this worthwhile or not or are you using Chris Coyier It more than that probably more than you are it sounds like but maybe not much more. Um, and I don't know, this is like a great conversation because I don't think there's enough writing and talking about this. I mean, there's, there's more, but I think people are a little self-conscious about it. Cause you're like, I don't want to write it because what if I'm a dummy and I'm totally using it like last month's, you know, dummies, are you, you know, like, like a little bit like of self-deprecation, Like, I don't know, all I do is like type in the little sidebar thingy, and it like helps me a little bit. Or like, all I do is autocomplete. ([Time 0:04:30](https://share.snipd.com/snip/d5353c50-ca8b-4673-8d46-08c7877c57f5)) - **Use AI As A Second Pair Of Hands** - Treat AI as a helpful collaborator but always validate its output and retain creative control. - Use AI for tasks you struggle with, not to outsource work you enjoy doing yourself. Transcript: Chris Coyier It because i'm just like you know what i don't mind it being there they're probably right to make you do that but it does have this smell of like dude i absolutely guarantee he was asked Ben Frain The same thing of like because we we've been around for a while where yeah i'm not really on the hype train with the ai stuff i use it as a tool but for me it's more just about having it's almost Like having another developer with me that i can chuck stuff to and then i still have to validate it and go all right what did you actually do here is this worthwhile or not or are you using Chris Coyier It more than that probably more than you are it sounds like but maybe not much more. Um, and I don't know, this is like a great conversation because I don't think there's enough writing and talking about this. I mean, there's, there's more, but I think people are a little self-conscious about it. Cause you're like, I don't want to write it because what if I'm a dummy and I'm totally using it like last month's, you know, dummies, are you, you know, like, like a little bit like of self-deprecation, Like, I don't know, all I do is like type in the little sidebar thingy, and it like helps me a little bit. Or like, all I do is autocomplete. Is that okay? Or are you like behind the time? I didn't like the fact that I was kind of like this stuff I like writing. Ben Frain I don't want to outsource that. ([Time 0:04:30](https://share.snipd.com/snip/11ca55cb-70d1-42c1-bcdb-66070704de69)) - **New CSS Features Are Tooling-Driven** - Some new CSS features (picture, container queries) haven't become daily tools for everyone. - Usage often depends on tooling (e.g., WordPress auto-handles picture) rather than manual authoring. Transcript: Ben Frain And then I end up just disliking them. Like I'll give you my example. So for me, things I hardly ever use are picture element and container queries. For me, just hardly ever use them. Chris Coyier So the first one is like not particularly spicy, I think. But you don't. I'll say I use a picture element every day in my life. You know why? Because WordPress just does it. Ben Frain Yeah, that's what I was going to say. That's different than you reaching for it, though, and going, oh, I'll use it. Chris Coyier It is. And it's almost like looking back i think like that should have been the message more is that like this was never really intended to hand write like it's good to know what it's doing under The hood but it's so programmable or whatever programmatic or something a lot of yeah just don't even deal with it that why, you know, the evolution of it that made it a little bit more Automatic. I'll tell you one of my favorite innovations of that syntax was the sizes equals auto. Sizes was the very hardest thing to learn about it. Sizes was whack. Ben Frain Another thing where you had to put like 75W or whatever. Chris Coyier Yeah, you're writing media queries in there that are attached to the current you're putting crap in your html that's only relevant to the current design of your site as soon as you change That design it's all wrong that sucks but a lot of images maybe most question mark question mark are are like lazy loaded and so you don't need a sizes attribute if that image is if it's Like okay for the page to be already laid out yeah that's great so thanks anyway container query is a little spicy bud i gotta say you know not that i use it every single day but like if you're In design system land or something where every single component you make is like digested in an unknown environment you better as hell be writing some container queries. Ben Frain I have opinions there as well, but we'd probably best not write them. Dave Rupert I'll defend picture. ([Time 0:12:19](https://share.snipd.com/snip/7f128909-80fc-4309-9065-158b53db9739)) - **Handle Image Variants For Dark Mode** - Use dark-mode-aware image strategies like picture with prefers-color-scheme or adjust images via CSS variables. - Plan image assets for theme toggles rather than assuming system preference covers all users. Transcript: Ben Frain There as well, but we'd probably best not write them. Dave Rupert I'll defend picture. I use picture for dark mode. So I don't flashbang people with a video or a big white image or whatever. Chris Coyier But explain a little more. Is the loading image white? Dave Rupert Well, let's say you say picture and then you say source at media prefers color scheme dark or whatever. And you can, and that's because that's what I have set up on the site. If there was like, if I was doing like a data theme kind of thing, I would need to do something different, but I'm just doing prefers color scheme. Uh, then, but you could even maybe now use like a style query or something like that. I don't know, but, um, I'd be curious about that. Like, you know, set some variable like color mode, but, um, but then I linked to the dark mode image and then I just load the, the, Oh, you have literally different images. Yeah. Or SPGs. You know how like you, you, I don't do it all the time cause it's like effort, but, uh, you know, like, I don't know, you do a chart and the, the lines are black or something on the chart and Then you go into dark mode and the lines aren't, aren't there anymore. You know, like, so you would want to like invert the image or you know that sounds hard yeah i just tell the designer at that point you can have one color ([Time 0:14:08](https://share.snipd.com/snip/15cf09e8-4c6b-4b99-bcd0-c481318587dc)) - **Scoping Solutions Trade Complexity For Specific Gains** - Layering and scoping proposals solve specific problems but often add complexity and limited ROI. - Many developers prefer simpler approaches like class mangling or web components for scoping. Transcript: Dave Rupert Like them i do wish it was layers were stronger than generic you know i think that that's a hard one for me to be like yeah you liked it the other way yeah because usually when you're rapping Ben Frain Something it's more important isn't it yeah yeah it's kind of like a weird mind flip of like hang on a minute the stuff outside of that is the boss i don't know it's weird that's the only Dave Rupert Piece i'm still like golly did we make the right call you know like but we could still have it you know it could still be like whatever layers whatever layers win you know layers calling Layers win or whatever but i don't know but uh i that's the only part like i i'm but i do like them i i you know if you can like bundle group your your logic and your component logic and your Chris Coyier Utilities together it's great i think what would have saved you there is that you can't layer from the link tag right and if you could then then you you kind of can solve this because your Previously unlayered styles just become layered upon how you call the file i think that's still on the table we just i don't know maybe people are less excited to working on it because Dave Rupert Ben's like throwing cold water over it all the time you know it's my fault no i you know i i also too not to like i author mostly in components right so like in shadow dom specifically so it's Like scoping isn't my problem like yes i don't use something like that uh we use fast element which is the microsoft version of lit yeah so and yeah that's the other thing i looked at sort Ben Frain Of at scope and you know there's a bit in the book about that and i went oh there is and i was like going i don't even this is another example of i'm not sure the the juice is worth the squeeze Chris Coyier Um you know it seems like a lot of effort i had to go speak at css day and make a case for scope and i was like all right y'all this is going to be rough but i think i you know like i was i i mean you've Ben Frain Obviously done more in it then. How do you feel about it now? Like, do you, would you just use a different selector or? Chris Coyier No, it's just a, it's a slight net gain on the language of CSS. Like, I don't hate that it exists. I just don't, I don't care that much. And I never did. There's a lot like that though, isn't there? Ben Frain They do very specific things and it's good that they exist. ([Time 0:23:37](https://share.snipd.com/snip/bd354276-efdb-497e-a3c4-568e91d1055e)) - **Use At-Scope For Local Component Styles** - Try at-scope in inline style tags to localize styles to a DOM subtree without naming classes. - Measure performance and caching trade-offs before adopting per-component injected styles widely. Transcript: Chris Coyier Is a good trick that I find that many people don't know about at scope is that if you put a style tag like angle brackets style, like you could put and you can put these anywhere in the DOM. A lot of people put them in the head because that's, you know, that's like the classic place or whatever, but it doesn't actually matter where you put it. That then if you write at scope inside of that style block, the implied scope, you just start writing some styles then, is like the parent of that element. So if you had just a random div on the page and you put a style element in it, you can just write at scope and just start styling and it'll style just that div and nothing above it. Which is pretty weird to think about. You're like, I didn't have to write a selector to do the styling I'm about to do. I just didn't have to write one. I didn't have to name anything. I didn't do anything. And I then can reach down into the children as well. So within that at scope block, I can start nesting selectors that will only apply to that like dom child situation i think it's cool and in my talk i even like tried to measure performance On it and stuff because i'm like what if we did that like dave is saying like what if we did never mangled selectors we only just injected little style blocks on every component on a page Which is you feel like something like internally tingly bad about that. Like, why would I put little tiny pieces of CSS all the hell over a page? That sounds like, I don't know why, but it just sounds like something we don't do. But I can guess at the why. The why is that, I don't know, it slows down rendering or something. It doesn't make use of cache very well. I like I'm not very good at talking about things like that. I don't know, especially without any data, whether that it really is impactful or not. So I tried to do some rudimentary testing and everything I tested on was like it didn't slow down the page at all. It was fine. But I'm like, I also was testing on my, you know, Mac studio or whatever. ([Time 0:27:20](https://share.snipd.com/snip/d1a8edd3-12bf-4aa5-ac82-93cb90c0ee39)) - **Color APIs Sacrifice Perceptual Nuance For Simplicity** - New color functions evolved but not all choices matched perceptual needs; contrast-color returned to basic black/white. - The initial richer algorithm was replaced for practicality, though perception issues remain. Transcript: Ben Frain Ones, though. The last really disappointing thing I think that I've seen in this sort of iteration is the color contrast function. Oh, yeah, how it just does black or white. I can never remember which way around it was. It was color contrast, and there's now contrast color all the other way around. Chris Coyier They just randomly switched it. Ben Frain But the new one basically does nothing. It just gives you black or white back, doesn't it? Dave Rupert It does. Chris Coyier The original had like uh you could say like choose between this list right choose the best one i want this triple a or i want it double a or 4.1 ratio but it seemed better but it i think that The back it was in the backstory of it like that got too weird and complicated it was the algorithm wasn't it it basically got to a point where it was giving you back something that it thought Ben Frain Was better mathematically but perceptually. Chris Coyier Well, now you're going to be really disappointing because the algorithm is still the bad one. But I think the idea was it's a net gain on the web if we ship something. And the thing that they shipped is like iteratable towards the better version. So like take your gift you know we gave you something yeah i won't be using that anytime soon hey ([Time 0:32:04](https://share.snipd.com/snip/99e953e5-4127-4668-abc4-4cf499199fcc)) - **Start With Viewport And Image Basics** - Include the viewport meta tag and control image sizing to make a page fundamentally mobile-friendly. - Add a small media query to tweak large-screen layouts after those basics. Transcript: Chris Coyier And it just it looks how you think it's gonna look. It's black and white and has really long line length. And it probably doesn't help that the image is blowing it out a little bit or whatever. And then you do the like, look, I'm gonna add one line. It's the meta tag, which I think is a nice intro is I don't think people even know anymore. Like that's just on websites now. Yeah, I think you're right. The viewport tag. But you're like, look at what happens. This one tag is responsible for like half of the quality of this page on thing. And then you're like, wait, you need one more, which is to make the images not blow everything out. So between those two things, you got a pretty mobile friendly page at all. And then it goes right after that. And it says, Well, okay, well, you know, still, though, on a really big screen, that image is like maybe getting a little too big still. So we're gonna just sprinkle in the tiniest little bit of RWD salt, which is a break point, which in my primitive brand, I still think of responsive web designs as basically media queries. Well, I think Ethan himself kind of fought against that conceptually a little bit. Like it's more than that. You know, it's like these three ingredients. Yeah. Yeah. But anyway, I'm like, it's media queries. So then your media query, just like, I don't know, it rips the image into a 50% or something, like a very large thing. And you're like, look, look, now there's a little bit of difference between how this web page lays out on a really narrow screen, probably a phone, and a bigger screen, probably a desktop Monitor. And that's what responsive web design is, which just seeds the mind to think like, OK, this is like a way of thinking. I need to think about how this is going to be done and the numbers involved with what's happening. And that's what it still is. ([Time 0:36:04](https://share.snipd.com/snip/d3c2170d-a8b5-4767-b7a2-b400a3071f2c)) - **Use References For CSS’s Growing Surface Area** - You cannot hold the entirety of modern CSS in your head; use references for deeper features. - Ben uses the book as a lookup to understand capabilities rather than memorizing everything. Transcript: Ben Frain Don't think we can understate as well just the genius of Ethan when he boiled that down into the sort of, you know, because these were disparate things that he pulled together. And sometimes people try and do that thing and it just falls apart, whereas that really did become greater than the sum of its parts. You know, when you you got like the fluid grid the you know the images and then the media queries and it oh those were the three things he said fluid grids media queries and what's the other Chris Coyier One media handling essentially images wasn't it something to do with like fluid yeah yeah um cool well i guess you did reflect all three of them in the beginning of that thing so anyway That's that know, that's like sets up the mindset that you need for this. And then it goes from there. Ben Frain Yeah, I mean, I guess that's the thing. It's like that in a nutshell is very little work, isn't it? To make something fundamentally fine. And then, you know, the rest of it is like it's taken it from like the example that Dave said, where it's like it's, you know, a noddy's version to something that's actually looks good, You know, with all the modern stuff we can do. Dave Rupert Yeah. Like, well, I guess, what do you feel like is the challenge for responsive design or people like, do people not get it? Is there kind of like a new young class that doesn't understand what's going on or. Ben Frain I mean, I almost think for the next generation, it's probably going to be like we started at the top where you've got people who are just asking a machine to spit it out some code, which They're taking and then probably don't understand fundamentally what that thing is doing. You know, like Chris just said about the meta tag, there'll be an awful lot of people that they just put that in, but they don't actually know what it's doing yeah and at some point you know You hit up against the problem don't you and you need a bit of actual human intelligence to figure it out um so i kind of feel like for me i mean i use the book probably as much as anyone because I dip in and out of it because you can't hold all this stuff in your head it's just too big now. You know, the amount of syntax and capabilities. So I use it as much just to sort of go up. It's more about understanding what's possible. ([Time 0:38:05](https://share.snipd.com/snip/0137e0b5-b40d-45ac-a671-cb3b6135e5c6)) - **AI Depends On Fresh Public Content** - AI models are fed by existing public content, so if blogging and fresh documentation decline, AI will have less new material. - That may slow AI progress or make it recycle older patterns. Transcript: Ben Frain So if we go back to food there's less food being put down fresh food so the AI has got all this sort of accumulated knowledge, hasn't it? But if there's less people, like if instead of going to Stack Overflow and typing questions and answers, if that sort of stuff isn't happening anymore, where's it getting its future Food from? Because all it's got is the past. Because at the minute, all they're really doing is mining the past, aren't they? ([Time 0:45:19](https://share.snipd.com/snip/d0ded6d9-0a10-4bc5-bfc7-452289afc2fa)) - **Consider Paying Content Creators For Training Data** - Consider models for compensating creators whose content trains AI, such as micropayments or web monetization. - Ben and hosts suggest that scraped content should return some value to original authors. Transcript: Dave Rupert That'd be awesome. Ben Frain You wouldn't be here now. You'd be on your island somewhere, Dave. Yeah, I know. Dave Rupert I'd be, yeah, my yacht, my space yacht. I'd just be cruising the galaxy. Chris Coyier My favorite is when like the company benefits from like, it's the Reddit CEO that's getting the money from Reddit being scraped. Like they book a deal, right? And then who gets paid from that deal? It's not the authors of the content on Reddit. Like, I don't know the details of it, but I feel like there's a WordPress one too. And it's like, WordPress brokers a deal. You can scrape all our sites now. Who gets that money? Ben Frain That's what you signed up to with your free account. Chris Coyier Yeah, sure. And I get there's a lot of nuance to that. It just feels weird. It's like if I threw the world's biggest stink about CodePen getting scraped because I wasn't making the money. I didn't make all the crap on CodePen. ([Time 0:46:56](https://share.snipd.com/snip/2cad0209-d81b-4338-aea0-391715565799)) - **Favor Scroll-Driven Animations For Quick Visual Impact** - Use scroll-driven animations for visually impressive effects with minimal JavaScript by leveraging CSS. - Prefer features that give big impact for little effort when you want fast results. Transcript: Ben Frain It's so hard. Yeah. Well, I think it sort of, it almost lulls you into a full sense of security because it seems so accessible to begin with. And then as soon as you want to do something a little bit left of the middle, it gets very complicated very quickly. Chris Coyier I had a rough week on them because I was just like, I just want to do this thing where every link you click, the entire page, this is not a good general plan. I just, this is what was in my mind. Instead of like fading out and fading in, that's like the default that you get, right? I'm sure you get into it in the book. But instead of that, I want to use the basic hooks that we have, which are those pseudo elements, you know, like old and new or whatever they are, and slide the entire page to the left and Slide the new page in from the right. So the entire website becomes like a slider, you know, and this is possible to do. Unfortunately, there's a demo. Sorry, Bramus, I think it's yours if you're listening to this, but it uses like an unbelievable amount of JavaScript to do it. But with view transitions, it's like newfangled JavaScript. But the idea is there's more than you want to think about with all this because there's the back button, for example. And if you do the back button, you want it to like almost like slide the other direction or something because that makes visual sense you can do all this stuff can't you but it's just it's Like layers and layers of stuff that you kind of go oh but here's what got me and this is just unique to me and i and i hate that this exists i should probably file the bug properly but they Don't work or they work wrongly in an iframe and code pen is a freaking iframe and i was like why is this api so inscrutable why is it doing a weird double animation it was like freaking me Out and then i was just just on a whim one day i opened it in the like non-iframe view and it worked just how i wanted it to and i was like you haven't just refreshed the browser then chrome Dave Rupert Update fixed it there's a there's a view transition and shadow dom like thing too and it's i think it's the same constraint like and it just it's like dude really come on huh it's good because Ben Frain I think we're on a path where we can do those sort of things like you can in ios where you sort of morph from one thing to another. Like, I'm glad we're starting to get these things. I just feel like it's a bit too hard at the minute to get the results you want. If it's not straightforward. ([Time 0:48:32](https://share.snipd.com/snip/740b5c08-63a5-4d8d-8589-0adcffb430f5)) - **Test View Transitions For Edge Cases Early** - Expect view transitions to simplify some interactions, but be ready for complexity when you need bespoke behaviors. - Test edge cases like back-button behavior and iframe or Shadow DOM constraints early. Transcript: Chris Coyier Because I was just like, I just want to do this thing where every link you click, the entire page, this is not a good general plan. I just, this is what was in my mind. Instead of like fading out and fading in, that's like the default that you get, right? I'm sure you get into it in the book. But instead of that, I want to use the basic hooks that we have, which are those pseudo elements, you know, like old and new or whatever they are, and slide the entire page to the left and Slide the new page in from the right. So the entire website becomes like a slider, you know, and this is possible to do. Unfortunately, there's a demo. Sorry, Bramus, I think it's yours if you're listening to this, but it uses like an unbelievable amount of JavaScript to do it. But with view transitions, it's like newfangled JavaScript. But the idea is there's more than you want to think about with all this because there's the back button, for example. And if you do the back button, you want it to like almost like slide the other direction or something because that makes visual sense you can do all this stuff can't you but it's just it's Like layers and layers of stuff that you kind of go oh but here's what got me and this is just unique to me and i and i hate that this exists i should probably file the bug properly but they Don't work or they work wrongly in an iframe and code pen is a freaking iframe and i was like why is this api so inscrutable why is it doing a weird double animation it was like freaking me Out and then i was just just on a whim one day i opened it in the like non-iframe view and it worked just how i wanted it to and i was like you haven't just refreshed the browser then chrome Dave Rupert Update fixed it there's a there's a view transition and shadow dom like thing too and it's i think it's the same constraint like and it just it's like dude really come on huh it's ([Time 0:48:50](https://share.snipd.com/snip/3c7f4d0e-03f4-42f4-9e66-9ef055ae182b)) - **View Transitions Behave Differently In Iframes** - Chris saw view transitions fail inside CodePen iframe and work fine outside the iframe. - That mismatch led to confusing double animations and console noise across embedded pens. Transcript: Chris Coyier Just while I'm complaining about iframes, I need to put this out there in case somebody from Google is listening, because this is very annoying to me. There is iframes have like a permissions model. If you didn't know that, what you're allowed to do in the iframe is dictated by, or it can be dictated by, a whole freaking soup of attributes on the iframe. And there's allow attributes. And then there's also sandbox attributes that kind of work the reverse way or allows like, I'm going to not allow anything. And then the allow makes it happen. Whereas sandbox is like, it just disallows everything. And then, or whatever, they're like the reverse of each other. I, I screwed up mouth blogging that, but, um, and there's just new ones all the time. So if you don't have it, there's no, there's no like way to know that until somebody complains to you. So my only model at CSS tricks for, or sorry, geez, at CodePen for knowing if we are missing one of these attributes is just like, wait for a support email. Somebody would be like, why doesn't this work? Which I don't like, but all of a sudden in the latest update of Chrome, or maybe the last two updates or something, it throw in the, you know, you open the developer console and there's Red errors on every code pen embed on the internet. And there's about 40 of them. So it gives you the worst console noise ever that are complaining about these attributes being on the iframe. And you're like, they're your attributes. You told me to put these on here. That's funny. I don't know. So I need to figure out what the problem is. ([Time 0:50:54](https://share.snipd.com/snip/e849fab6-6a96-4f9f-bd08-1cf68b9221ce)) - **Less Blogging Creates Knowledge Gaps** - Blogging and detailed problem posts are declining, which reduces public debugging knowledge and AI training material. - Fewer write-ups mean more obscure edge cases go undocumented and harder to discover. Transcript: Dave Rupert I'm going to post about it and solve it for everyone. Like, you know, I think we've probably all hit that weird thing with anchor positioning where you're like, blah, you know? Or even minor differences between Chrome and Safari's implementation. But I know Safari's like things getting better, but it's like, blah, you know? And so it would behoove all of us to like post this stuff so that we can like just kind of, you know, and my solution for like whatever anchor names in Shadow DOM might trigger a thought for You to solve your problem or whatever. Like it's just, yeah, unfortunately it is this like, you know, it's good and it is getting better. There's these like you if you're not just doing the popover example you just start hitting these like weird corners real hard so yeah and i think like you say they're the things that used Ben Frain To be figured out by people doing it and then documenting it and it feels like i don't know if it's true but there is less and less people doing that so they might be solving it but it doesn't Get written up anywhere because it's not in stack overflow or it's not on somebody's blog post and so poor old ai is gonna have no information to pull from pretty soon are you seeing that Like a it does it feels a little sad to me but maybe true there's just less writing i don't know if it's difficult because i don't know if i'm just not getting enough more people to follow. But like my sort of RSS list is kind of like feels like it's diminishing as more and more people just stop doing it. Chris Coyier Yeah, maybe we just there. Maybe there are. We just are. ([Time 0:55:18](https://share.snipd.com/snip/cd2ad4d7-af03-44c7-b6f6-01e86f401a89)) - **Keyboard Channel Grows From Personal Obsession** - Ben runs a popular YouTube channel about mechanical keyboards and ergonomic typing. - He admits collecting keyboards is addictive despite muscle-memory costs. Transcript: Dave Rupert I'm jealous, honestly, people like send you cool keyboards but it's like uh you just you have a great show i just want to say like it's cool it's unique it's you know if your hands hurt while Ben Frain You type you should check out uh ben's uh youtube huh it's funny that that's the problem really is because it it's i keep saying to myself i'm not doing any more i don't want another keyboard Because you've got all that muscle memory to learn and all the new stuff to do. And then somebody will say, oh, we've got this new keyboard and it does this, that, and the other. Do you want us to send you one? And you do a review and I'm like, oh, I'm going then. Dave Rupert Yeah. Ben Frain Okay. Dave Rupert Yeah. Yeah. No, that's a cool channel. I'm jealous that you got in there. And that's a cool way to. I don't know. Chris Coyier I hate to be weird. I just didn't even know that you did this, and it's very popular. Wow. Ben Frain You're definitely the keyboard guy. You learn something every day. The weird ones, I think. The weirder split ones is definitely kind of my niche. ([Time 1:03:41](https://share.snipd.com/snip/88e70a36-4285-4563-9235-a9b3f837e4f8))