How good is web3 really? And is there money to be made without destroying the environment? Is HTML good enough for the future? And what are we excited about in new stuff for CSS?
Time Jump Links
- 00:48 Keeping up with the Web3 crowd
- 14:12 Sponsor: Notion
- 15:25 Why would you keep doing it the old way?
- 20:53 Playing it like the stock market
- 24:06 HTML is still ok
- 30:29 Tailwind Tokens
- 38:33 Sponsor: MarkUp
- 39:18 With the sheer amount of new and cool stuff coming to CSS specifically, what are you most excited about?
MANTRA: Just Build Websites!
Dave Rupert: Hey there, Shop-o-maniacs. You're listening to another episode of the ShopTalk Show, a podcast all about front-end Web design and development. This is episode 490. Holy crap! I'm Dave Rupert and with me is Chris Coyier. Hey, Chris.
Chris Coyier: Heck yeah, it is. Yeah. Coming up on that half a thousand, which is pretty cool.
Dave: 490 of these, that is a lot. I thought it'd be funny if I started the episode like I didn't know how to do the intro.
Dave: That would be kind of funny.
Chris: Well, I get that feeling once in a while. I'm like, who is possibly joining us at episode 490? Does it feel like the hot new thing? Partially, I'm thinking about this because I always do (once in a while), and also because of just thinking more and more about Web3 kind of stuff and reading more about it.
Dave: Okay. Okay.
Chris: And trying to bone up and not sound ignorant, but also deal with my feelings of, like, "Eh, why does this exist?" kind of thing.
Chris: But being well aware that that doesn't come from a place of deep education about it. It comes from a place of, like, "What the heck?" or of hearing bad stories, of hearing, like, "One Ethereum transaction is enough energy to power a household for a week."
Chris: I'm like, "Oh, my God!" Then going to the gym and having my gym guy be like, "Man, I feel so behind on technology. I feel like I should have some crypto investment. And maybe we should start taking crypto for payments for our gym members. Why not? Maybe that'd be the future. Maybe people would like to pay that way. Maybe I'll get crypto that way, and it will make us more money in the long run, and I won't feel so behind on technology."
Trying to square those two things. Okay, so one fellow pays you in crypto for your gym membership, and that transaction costed as much electricity as powering a home for a week? How do you feel good about that? That's wild. People feeling behind and then, while they're catching up, they're making choices that aren't particularly informed by environmental impact because they just don't know or don't care.
Dave: Yeah. I don't know. I put a lot of time and emotional energy into this, like in the last month, just reevaluating because I've been following some tokens or coins or whatever since, like, the beginning of the year, like March or something. You know?
Dave: I was just like, "Should I do this?" They've literally all doubled in value. [Laughter] I'm like, "Man, I could have doubled my money. Dang." You know?
Chris: Oh, so you followed out of interest but not even with a nominal investment?
Dave: Yeah, not even with a money investment because I still have hang-ups about buying virtual currency. I know it's a little more tangible than virtual nowadays, but that game just seems so weird.
Chris: It does. It does.
Dave: Like, "Yeah, man. I bought 90 V bucks," you know? [Laughter] Roblox V bucks, you know?
Dave: And I'm going to spend them on JPEGs.
Chris: I also go to Vegas and spend money on crap and don't feel bad about it, so what if you spent the same amount of money on crypto? Does it feel the same that you could then play the game? The problem is, the second you buy it, you've participated in that environmental system that's a little sketchy.
Chris: Not all coins are the same, right? They're different. I think some of them have very little environmental impact.
Dave: And you say the environment is bad, and then people -- it's bad for the environment, and then immediately you hear, "Yeah, well, oil is bad." You know? It's like, "Yeah. Yeah. No, they're all--" It's bad. I agree. I'm trying to reduce all of that, too. Or I'm putting LED bulbs in my damn house because I want to use a lot less electricity.
Chris: That's a different level, though. We're talking about powering a home for a week. That's whack-a-doo, man.
Dave: Yeah, well--
Chris: That's a lot!
Dave: Then immediately, somebody is like, "Oh, but Ethereum2 fixes it." And it's like, "Yeah, yeah--"
Chris: I know, but it's not fixed.
Dave: But you're incurring the carbon cost now. What are you doing about it? You know?
Dave: You doubled your money, but you quintupled your carbon footprint.
Chris: That's what's so hard to think about, right? You have to square all this stuff, and that's the tip of the iceberg because there are ten more things to think about, like: Do you trust it? Who is at the top of this thing? Are you actually decentralizing, or is it actually centralizing? And who is getting rich off of these fees?
Chris: All that stuff, right? I do participate, I'll say, at what I'd burn in Vegas kind of level. But part of it is because of that Coil thing we got involved with.
Chris: In that when I wired up Coil and put it on stuff, which is still on my site, it trickles in bucks into a virtual wallet because it's literally the only choice that they offer.
Chris: All right, so I hooked up this app called Uphold - or whatever. It's not my favorite little wallet thing, but it's fine.
Chris: Money trickles into that, and then rather than immediately extract it into my business bank accounts, I just let it be there.
Chris: Then I was like, "Maybe I'll just turn some of it into Bitcoin. Maybe I'll turn some of it into stupid dog coin or whatever it is. Maybe I'll turn some of it in Ethereum, and I've been doing that and then just watching it.
And you're right. It is. It grows, especially over the long-term, it really does go up. [Laughter]
Chris: My thinking is, if it went to zero, I'd like, "Welp, that was a sucky trip to Vegas. Big deal."
Chris: That seems so silly because all I do is sit there and look at it, which makes it, like, "Is that money, really?" I don't -- if somebody -- even if somebody was like, "Hey, this breakfast burrito place takes Bitcoin," would I buy it in Bitcoin? I'd be like, "No, because that's my looking at money." [Laughter]
Dave: Well, and yeah. Oh, man. That was a good $6,000 burrito I had that one time. You know? It's so volatile.
I'm looking. I think - what - we got paid in XRP, right? I had--
Chris: What's that one?
Dave: That's the one that Coil used a long time ago, right?
Dave: Originally, and I guess it's--
Chris: Yeah, and you wired it up to use that, and I didn't.
Dave: I did.
Dave: And I had like 200 XRP, which is worth $200 now. It was only worth like $40 back in the day. But I lost it in the migration to Uphold when I changed from XRP to Uphold.
Dave: It just disappeared, Chris, 200 XRP just disappeared, and so my "learning curve" is kind of a bummer.
Dave: It's like I've already been bitten by this. I've already failed on the--
Dave: [Laughter] --using--
Chris: That's terribly nerve-wracking because at one point I was like, "Well, Uphold doesn't have a lot of the stuff that I wanted to mess with."
Chris: And I was like, "I'll just use Coinbase. I don't know the implications of it. I don't know if they're slimeballs or cool people or what," but it does seem like the big player. It seems like the one that most people use.
Dave: Coinbase, yeah.
Chris: So, I get a Coinbase account, right? I move most of my stuff into it because that's what I'm also scared of. You hear these stories. "I used to have a Bitcoin sitting around at a computer somewhere." I'm like, "What?!"
Chris: I don't want a Bitcoin sitting around on a computer. I want it to be in a cloud thing where I cannot lose it.
Chris: Anyway, I put all my stuff in Coinbase, and there's a nerve-wracking moment. Uphold doesn't make it -- I would argue they don't make it particularly palatable to be like, "There's no 'send to Coinbase' button." Not that there should be because everything is done by these QR codes with wallet addresses and stuff, but there are big warnings.
If you send one to the other, you've got to get the wallet address right and all that stuff. But the warning is, if you've somehow sent it to the wrong wallet or even the wrong type of wallet, so if you send some Eth to your Bitcoin wallet, guess what happens. It's just gone. It just disappears. That's maybe what happened to you - or something. You have to make sure you send your Eth to your Eth - or whatever crap.
Dave: Oh, wow.
Chris: Otherwise, it literally -- it doesn't say, "Oh, that's not going to work." It says nothing.
Dave: [Laughter] Dude!
Chris: That's whack!
Dave: It's a solid no for me.
Dave: It really is maybe like a UX thing. I don't know. Yeah.
Chris: I admit, I think it's a little fun to watch my Vegas bucks go up in money, though. But then, of course, I'm riddled with guilt over the whole thing.
And this is not Web3. We're just talking about crypto coins. We haven't even talked about what is the website look like on the blockchain.
Dave: Yeah. That's a major underpinning of the Web3 is Web plus payment. But the one part about Web3 I am maybe excited about is decentralized authentication. I sign in with my hash OX58312345. You know?
Dave: And this website is like, "Oh, hello, OX58312345. You've proven that you're that person. You can access this website."
Chris: Like OAuth, but better?
Dave: It's like Gmail, log in with Gmail, but it's based on whatever ... blockchain....
Chris: There's no company behind it? It's an open--?
Dave: Yeah. I mean it's distributed.
Dave: Or it belongs to whatever popular blockchain I'm registered on, I guess.
Chris: That seems hot. Then I was out to dinner last night with this new food truck in town. It was very fun.
Chris: We were sitting outside by the fire. The guy used to be a real estate attorney kind of guy. He's like, "I don't know anything about all this stuff," but when I read a little bit about blockchain and contracts seemed interesting usage to me, like the title of your house or whatever could be on the blockchain. And that's cool because it's not, like, who cares about speed and stuff? This is like a rare transaction. Then it maintains that history of title ownership, and it's not like -- you don't have to go down to city hall and ask Dora, you know, to see if she can go down the hallway and make photocopies of your old title (kind of thing) because technology has maintained this title ownership.
But not just titles, but other documents of that type, which are public record anyway. I was like, dang, that does seem kind of good. It seems like it could be an improvement.
Dave: I could get behind any kind of ledger-based activity. But at that, do you really want whatever monkey, avatar.eth, the website, to be where you issue your home loan and your house title?
Dave: Not at all.
Dave: I'm going to say no. I'm not going to give some - whatever - crypto punk my [explicit] house title.
Dave: Sorry. You have to bleep that.
Chris: Yeah, it seems a little weird. It also gets weird that they're kind of immutable, right? Isn't that kind of part of the--? That's what an NFT is, right? It's nonfungible. You can't--
Dave: Nonfungible, immutable, infinitely copyable.
Chris: But titles are kind of mutable, right? You can change the ownership of it. But what if your title -- what if you changed the plotlines on your house? That title still references old plotlines. It kind of needs to be fungible a little bit.
Dave: It kind of does because I've had that situation. I built my shed. That's an edition, right? I got an easement back on my house from the city. A power line cut across my house, and I was like, "Don't do that." I paid money to get that taken off.
Dave: Immutability sounds super cool, but it's also maybe not. You tweeted out an article by Robin Sloan.
Chris: That was just this morning. Yeah.
Dave: Mr. Penumbra's 24-Hour Bookstore, which is a good book.
Chris: Maker of olive oil. Did you know that? Weird guy.
Dave: What's that? Oh, yeah.
Chris: Makes olive oil (recreationally) and mails it out to you as a subscription service (with his partner).
Dave: I'll do that.
Chris: Pretty weird.
Dave: Um, okay. I'll take Robin Sloan oil.
Chris: Fat goal. Check it out.
Dave: But one thing he was kind of saying in his article, he just was like, as cool as immutability is, I kind of want mutability. I kind of want stuff to disappear, like not be kept in record forever. I empathize with that. The right to forget, forgettable Web. Anyway--
Chris: Yeah. It's like - I don't know - you upload some photo to some cloud service and you don't have access to the account anymore, and now this photo is just a permanent part of the world and you have no control over it. Cool.
Dave: Yeah. [Laughter] If somebody bought that picture of me butt naked in some dumpster that one time we took that fun photo, and now somebody owns it forever--
Chris: Yeah. Are there stories about that? Like NFT revenge porn?
Dave: I don't know. Possibly.
Chris: I'm sure it's a thing.
Dave: Somebody made the point on Twitter. They were like, if porn hasn't even hopped on this, and if porn and furries aren't doing this, it's not good for artists. [Laughter] That's what somebody said. I was like, interesting twist. But yeah, I don't know. There's so much to think about, right? There's so much.
[Banjo music starts]
Chris: This episode is brought to you in part by Notion. That's notion.so. Learn more and get started there for free.
You know with hybrid work becoming the norm, the strongest teams have two things in common: speed and alignment - absolutely. Both come from having, you know, are really emphasized and made better by having one hub where everyone can share work and the processes and manage products and collaborate with clarity.
I'll tell you that from experience. My teams use Notion as that hub. It's all kinds of stuff from meeting notes to planning future projects to Kanbanning our existing projects and who is on what and what's going on and what's everybody working on. Our week notes are in there for individuals that are like, "What are you working on? What am I working on? What are my blockers?" all that stuff.
We use it for work in a big way. Even here on ShopTalk Show, we're using it to plan our shows. We're using their API for incoming questions and assigning questions to different shows and all that.
It's just amazing what Notion can do. It really is an all-in-one hub for work productivity. I love it. Check out more.
You can check it out on your own and invite as many people as you want to. It's a very team-based tool. That's the best thing. Take the first step to an organized, happy team today again at notion.so.
[Banjo music stops]
Chris: Right, so here's the part of what was interesting, and this is in the Robin Sloan article, as well as what I've been thinking about is that it does seem new and cool and interesting and, like, "Relax, bro. Why don't you just experiment with this stuff? Nobody is forcing you to do anything. We're just at the 'have a play and see what's cool about this issue,' in that why worry about that? Nobody is jamming it down your throat. Just relax." You know?
Chris: And I kind of get that, except for that is not the whole story. I heard a story. This is an acquaintance of an acquaintance kind of thing, so grain of salt, but it was like a relative newcomer was working on websites, and they were attracted to and guided to Web3 work, like, "This is actually how you build websites. This is where the Web is going, so why would you, as a newcomer, learn the old stuff?"
Dave: Do it the old way.
Chris: Might as well learn the new stuff.
Chris: Right? And they were saying, "Ah, man. I'd love to keep doing website stuff, but I'm going broke deploying my website," because in Web3 you pay gas or whatever to do a transaction to deploy your website because your website is on the blockchain. That's the point, right?
Chris: That's how it decentralizes - yadda-yadda. I heard some other stories from people being like, "Oh, it turns out it was actually pretty fast, like the performance was pretty good. I measured it." That was cool.
Chris: People are playing around but, yes, we lost this newcomer because they spent all of their limited funds changing their website on.... They literally didn't know any better. They literally thought that you have to pay to update your website.
I was like, okay, we lost one. That sucks.
Dave: Mm-hmm. Mm-hmm.
Chris: You could guide them the right way. It's not like they're gone forever, or whatever. But what crock!
Dave: Wow. Yeah.
Chris: That offends me that somebody was guided in that way, but I also don't blame anybody that's attracted to it because it's the new shiny. You're being told that. You're reading Hacker Noon, or whatever, and they're being like, "Web3 is the coolest."
Dave: Oh, and VC is chucking money at it.
Dave: But that gets back to my whole deal is, who is getting rich here? You know?
Chris: Yeah. Who?
Dave: Who has the money and thus who has the power? Due to the anonymous nature of it, you don't know. Am I just making cybercriminals rich? Probably.
Chris: No, but I am also way ignorant about this. Okay. You pay a gas fee. Literally, where does the money go?
Dave: As I understand it, that goes to the miners, like the mining company.
Dave: Because they have, I guess -- I don't know. They make up the [laughter] delta between--
Chris: So, if you've spent money, if you bought all the GPUs, thus letting gamers not have them or whatever, and you've been dutifully mining crypto for years - or whatever - that's a long-term investment. At least with Ethereum--
Chris: --because not only do you get the Ethereum right off the bat, but you continue to earn off the transactions forever.
Dave: Yeah, as I understand. Again, I'm not the dude.
Chris: Yeah. Well--
Dave: But I think you cut the miners because they have to process your transaction, just like a credit card processor has to process your transaction, which--
Chris: Oh, and it's not one deal. It's not like work they used to do. It's work they're doing right now.
Dave: Right. Right. Right. So, they have to stop--
Chris: Yeah, okay.
Dave: --blockchaining in order to--
Chris: Deal with your transaction.
Dave: --verify your transaction on the block or you're adding to the block.
Chris: Mm-hmm. It actually kind of makes sense.
Dave: That's how I understand it. But yeah, but is that fair? You don't know.
Dave: I mean there's a DAO, I guess, in place, a Developer Agreement Organization. Is that what that stands for? But there's a DAO in place. But, man, do you really know if it's fair? [Laughter] You know? It's just variable. It's coded in the system, I hear, but it's like what's fair? You know? How do you know it's fair? How do you--?
Chris: Certainly, the investment on it, [laughter] when you look at the names at the top of that, you know, you're going to find Andreessen Horowitz.
Dave: Yeah. Big names, big players. Venture capital loves markets, right? They love -- they want Airbnb because Airbnb is basically just like a new hotel market. Then people can pay whatever market prices. Libertarian capitalism prices are, if people want to pay this much for it, we'll sell them that much for it, you know, this house. So, they're looking for those Ubers. They're looking for these--
Chris: And this thing smells of a huge market?
Dave: I mean you're inventing money.
Chris: It is. It already is one.
Dave: You're inventing money, and then you're like, "Hey, do you want to buy this money that only goes up in value?" And people are like, "Yeah, I want to buy money that goes up in value." They're like, "Great because we made a bunch and we bought it at pennies, and now we'll sell it to you for thousands."
Dave: You know? It's kind of -- I mean it's sort of a slam-dunk. [Laughter]
Chris: It does. I wonder how much of VC funds is literally just the coin itself? Because if the point is -- [laughter] a great outcome for money is to double it, and that's what all of it has done, provably. You think a company is more risky than the coin is at this point.
Dave: Well, and the way you make money on the stock market is not buying the stock. It's the futures and stuff. You're betting on whether it'll go up and down in the next month, and all that.
Dave: Sort of day trading on it.
Chris: Do you play that game? Does that feel more okay to you?
Dave: I don't. I don't have the -- [laughter]
Dave: It's so cussy. I don't have the GD time to sit there and babysit numbers.
Chris: No, but you could be like, "I'm not on Tesla, so I'm going to put $1,000 into Tesla and just let it ride."
Dave: I could. I don't do single stocks.
Dave: But that's also out of my nature. I just don't.
Dave: I don't. You can win in doing that, but I don't think that's how you win. You know? I don't know.
Chris: No, I don't think so either.
Dave: You get lucky.
Chris: That does seem like a weird game. Yeah.
Dave: Yeah. I bought a bunch of Tower Record stocks, Chris. I'm going to be rich.
Dave: Tower only goes up.
Chris: That does seem a little silly.
Dave: You know?
Chris: Yeah. Pretty risky. Although, I have one. There's one I'm bullish on. Are you ready?
Dave: Is it Tesla? No. It's what?
Chris: No. Cloudflare.
Chris: I think Cloudflare is going to blow up, dude.
Dave: #InvestmentAdvice. Not investment advice.
Chris: Yeah. Don't listen to me, but it just feels low for a company that's already -- they're just so baby compared to the other cloud players, but everything across the board is better that they do. I'm just like, "God dang, you're going to 100x, for sure."
Dave: Well, there are so many. There was stuff I was just like, "I should invest in this," like when I switched to [laughter] PC. This was even before all the bitcoin skyrocketing.
I was like, "I should invest in Invidia because they make good GPUs."
Chris: Oh, yeah.
Dave: I should invest. I'd probably be a quitrillionaire right now, Chris. [Laughter] Because they just kind of only go up, you know. I think I even talked to a guy about it. They were like, "Well, I guess you could." I should have done it, but I don't trust my -- and I don't want to babysit. I don't want the guilt of picking the wrong thing. That's also my issue.
Chris: I get you. I get you.
Dave: Risk, low-risk over here, low-risk Rupert. But I don't know. I want people to feel good. If you've made money, awesome. I'm happy for you. Please reinvest some of that into fixing the environment. That would be awesome.
Then, two, can you please help spread it forward and make sure that it is distributed equitably? Like these gains, it doesn't just go to your Lamborghini. Maybe we do some cool stuff with it, but I don't know.
Dave: I don't know.
Chris: Yeah. If we happen to reach one person who is making choices about where they're headed and stuff, I guess one message I'd like to spread is, in addition to the great ones you just spread, these are smaller almost in scope, but it has to do with your life. The Web now, like shoptalkshow.com for example, not on the blockchain. It is still a new, exciting, huge, interesting market and career.
Chris: And that there's nothing old and stodgy about it, really. It is rife with some problems. [Laughter] At the biggest scale, there are websites that are hurting the world, too. But on the whole, the Web is still a pretty great thing, and that if you're a newcomer to this industry, like, hang out over here for a while.
Chris: Your skills aren't untransferable to building websites that then work on the blockchain too. If you want to play out this industry, you can learn all the stuff over here.
Dave: I think we talked about it in the last episode, but I get the growing sense HTML has some longevity. There's a chance we'll all be in Mark Zuckerberg's metaverse slinging bitcoins at each other just to get toilet paper delivered to our house.
Or [laughter] we take a different route, and we can really support each other. Maybe -- I feel like HTML has a future in that, like, we're going to share content. That's the core of who we are is sharing stories and telling stories. That's what YouTube is. That's what everything is.
Dave: Podcasts are. It's sharing stories, talking, human connection, connection. I think that won't go away, and HTML is pretty good technology for that.
Chris: Yeah. Heck, yeah. That makes me think of that nothing ever changes. That we build new products that do interesting things, but the core needs of them are the same as they ever were.
Chris: I want to tell a story. I want to talk to my friends. I need to know where the nearest bakery is.
Chris: I need to make sure that my partner knows that we're out of milk.
Chris: Make sure not to forget next Friday that I have a doctor's appointment. Those needs, they don't change that much.
Chris: Like over decades of time.
Dave: Well, yeah. Everyone is going to start buying these monkey avatars and then somebody is going to say, "I need a place to show off my monkey avatar." And you're like, "I know how to do that."
Chris: Sure. I mean that's always a question, though. Does this new thing solve some need that you can point to and express really clearly? Sometimes, it does. That's why this stuff is so complicated. Sometimes, it is digital artists are as every bit valid as other kind of artists. Yet, there's no market for their work. This thing called NFT comes along, and all of a sudden digital artists are getting paid good money to do great work. How do you possibly fault that? Well, you can't. It's great. It's awesome.
Dave: Oh, well, well--
Chris: Well, I mean we just got done talking about a million nuances of all this, but at least you can point to something that makes sense.
Dave: No, it is. It's going into somebody's wallet. There's money going into somebody's wallet.
I have heard there's this golden brick scheme where I make an NFT, and I'm like, "Hey! Hey, I'm going to sell this. Can you buy it for $5,000, and I'll pay you back - or whatever - 5ETH-ish."
Chris: I heard it.
Dave: "I'll pay you 5.1 ETH back. Sound good?" Then you do that 100 times, and then, all of a sudden, somebody is like--
Chris: Well, then you grift the last person and be like, "Look at this verifiably hot market that these NFTs are in. You'd be stupid not to buy this last one for $5,000," but truly they had no value because you were the buyer every time.
I am curious about that, though. Doesn't it look like you bought it back, or are transactions not--? You don't know who the money went to.
Chris: They're on the chain, but you don't know who.
Dave: Yeah. Yeah.
Chris: That's anon--
Dave: I mean you can maybe do some detective work, but it's like somebody cashes out to bucks, real bucks with another wallet, and buys into regular.
Dave: So, it's just this, like--
Chris: You absolutely cannot differentiate an actually hot trading market from a totally scammed hot market.
Dave: It seems like a problem.
Dave: I don't know. It seems ripe for whatever - fertile ground.
Chris: It seems so early. Why are people trading these things at all? I thought it was mostly you buy one. Then you own it. Then maybe someday somebody else will want it and you trade it. But it seems like early days for that. But is that wrong? Are these hotly traded already, like, I really want your monkey with the cigarette in its mouth and I'm willing to pay you double what you paid for it? That seems wild.
Dave: I think some people have done that, but you know. But to what extent? That's sort of like fishing. "I got a big one!"
Chris: Yeah. Yeah. What doesn't bug me about is that nobody -- that is truly a game. It's Pokemon cards for adults. You can play that game if you want. That's even more Vegas-y that anything else except the stupid transaction fees.
Dave: Yeah. Yeah.
Chris: Everything is fine about it except that.
Dave: Well, and then all my skepticism comes out on that because it's like, "Oh, we're disrupting banking."
"Oh, yeah, cool. How are you doing it?"
"Well, every transaction costs like $180." [Laughter]
It's like, "Oh, uh--"
Dave: Amazing, dude.
Dave: You really disrupted it.
Chris: Yeah. That's when we're specifically talking about Eth, right? That's smart contracts and that's the whole deal that you program it into the transaction itself what it's owed.
Yeah, people were really yelling about this Web design thing the other day. Some guy was like, "Listen. I'm going to make Tailwind tokens. You buy from me a unique set, a unique configuration of Tailwind thus that you own it now. You plug it into your website. You use Tailwind like you use Tailwind, and your website is going to look unique because I've given you this one-off set of tokens."
Now, one, it's not really unique. If anybody wants to copy your tokens, they can just do that just like you can fricken' screenshot a JPEG, so it's not actually unique, but I don't think they care. That's not really the point. The point is, support this artist by owning this set of tokens.
It's an interesting-ish idea kind of thing. But the pushback being what is happening here. Then they don't disclose it, but somebody buys one right away and sees, oh, they take 10% if you ever sell the NFT again.
Clearly, what they're thinking of isn't -- they're thinking of their long-term. It feels like a long-term grift. Like if this thing were to succeed, I almost don't care about round one. I care about them being traded around in the future and being able to carve off the top.
Chris: The fact that you can tell that that's what they're thinking makes it feel like [barfing].
Dave: Yeah. You're not just reselling a license. You're selling -- you're taking 10% off the resale value, which I sort of understand for art. You get a royalty. Like, whatever, I bought Taylor Swift's song. Now she gets 10% of the sale because she's Tailor Swift.
Chris: But that's a one-off, not a forever. Not that then if somebody sells it -- if I sell my lawnmower that STIHL gets another 10%.
Dave: It's her IP, so it sort of makes sense to me.
Dave: But I can reason about it, but I was not super-stoked on this Tailwind project, but just like you get a Tailwind config. [Laughter] I paid how many ETH for that? But I do think there's something interesting about how you could support open-source through (or even just do licenses through) this.
I hate the fake scarcity of it, but I think about Flickity or something like that, David DeSandro, which I think he said he had to pause on some of this work right now. Just too much going on. But if he could have a license issued and there's a credit and you have a license and then you take it from project to project or whatever. You can be like, "This is me. This is my license." That's kind of cool.
Or if you commit to a project like Vue.js, maybe you earn stock or points to Vue.js or something like that. I don't. Like you could be a part of the DAO there - or whatever.
Dave: There are some interesting implications. I don't think they've manifest, and I wouldn't even want to pilot a program, but there are some interesting ideas. Vue.js is not on the blockchain, by the way, but I just was using that as an example.
Chris: God. David would probably make a killing because he does all these interesting portraits and these little one-off logos and stuff. They seem pretty ripe for the NFT thing. Sometimes when you see a friend that would be good at it, you're like, "You should get it on this, bro." [Laughter] Even though all of the crap I just said bad.
Dave: Yeah. Well, you know, I don't know. I'm probably in the hater camp. I'm not there yet, but I am starting to see some potential applications. But I have no skin in the game.
Chris: Yeah. It seems like the healthy place to be at the moment. Well, enough of me extolling my own ignorance about this because it seems like I talk about it more than I know about it, which is a little scary of a place to be. I don't want to be that tech pundit. I'd rather talk from a place of deep education.
Dave: I think these conversations are probably more valuable than the ones on Twitter because Twitter is just nonsense and misinformation. You're like, "It's bad for the environment. Here's a number of kilowatt-hours." And somebody is like, "Oh, no. I read a blog post that it's not that."
You're like, "Cool. What's the blog? Is it on media? What's the blog post?" You know? [Laughter] It is actually peer-reviewed? Because I'm looking at a New York Times article, and they have not redacted a single thing yet.
Just the information sources are so -- I don't know. It's kind of -- I think it's all connected to the problem of disinformation, in general, in society where you could just Google whatever you want to believe and you'll get an article telling you that bitcoin is great for the environment.
Chris: Well, that's why I quoted. How many times did I quote in this article about the house, that a single transaction is as much power as it takes to power the average household - or whatever. I said that a bunch of times. I cannot quote a source.
Chris: When I learned that, it fell into a niche in my brain that said, "Oh, my god. That's so bad. I'm going to frame a bunch of other things I know about crypto and NFTs and all that world with that nugget of knowledge in there," let alone I don't even know who commissioned the study or anything. So, I'm really guilty. That's what I mean here. I don't know. I don't know.
It seemed like a lot of people are saying it, so it felt right to me, but I cannot--
Dave: Yeah. Well, but then, for me, I get more -- when somebody is like, "Oh, it's not significant." But it's like China shut it down because it was using too much power. [Laughter] It's basically offsetting all of our renewable energy.
You don't have to tell me. You can't gaslight me, like 500 GPUs running in somebody's basement is going to have a carbon cost. [Laughter] These things get hot. They're warm. It's so much electricity, 500 watts of electricity pumping through these things. You can't gaslight me and be like, "It's not significant," when the whole machine is built on -- the whole empire is built on burning electricity.
For me, if I had anything to say, it's like, "I am waiting for--" I think we are in such a climate crisis, we need better solutions. This was a 2010 solution. This is not a 2020 solution. We are plummeting off this cliff.
Dave: I think it's the wrong solution. I think it's the anti-need that we actually need. We need something revolutionary, not this, not just use electricity to make money. That's no better than use oil to make money.
Chris: Well, that China point is a good one, isn't it? It's literally the biggest country by population on the planet says no.
Dave: They have no problems burning energy, Chris. But then they were like, "We've got to shut this down." [Laughter]
Chris: Yeah. I wonder if it's the anonymous thing more than the electricity, but who knows?
Dave: I think so. That's true.
Chris: It's not like China is going to tell us.
Dave: Yeah, China is not telling us.
Chris: Let's take a break.
[Banjo music starts]
Chris: This episode of ShopTalk Show is brought to you in part by MarkUp. The link is in the show notes, of course.
MarkUp is the leading visual commenting platform for live websites, images, and PDFs. Whether you're designing a product from ideation or putting finishing touches on the build, MarkUp is the perfect tool to keep your team together. Invite as many collaborators as you'd like. They can join as a full member or as a guest to view, create, and resolve comments. Go from design to build to publish without losing your mind in the process.
MarkUp will save you time. You'll save the day. If you're in the business of getting feedback on design of any kind, you owe it to yourself to check out MarkUp. It is a really slick tool. Super well-done for that. Thanks for the support, MarkUp.
[Banjo music stops]
Chris: Let's do a question from Rich Walker who comes up who is excited about the future here, so maybe a nice breath of fresh air here. He writes in, "I'm really looking forward to getting into CSS container queries and eventually using them on production sites, as they have the potential to change and refresh my approach to building modules."
Boy, I totally agree, Rich. Doesn't that sound good? I would say, let's not forget about container queries. I think I titled a blog post that and then, shortly after that, they kind of "came out," right? Remember?
Dave: Mm-hmm. Mm-hmm. Mm-hmm.
Chris: Everybody was excited about it because I think there's a version of Chrome. You turn a flag on and, wow, container queries are there. They're not -- as far as I know, A) that's so cool. Yay. Many claps. But the spec ain't done. It doesn't feel particularly close to it dropping in stable Chrome, to me. But I don't know.
Then even if it drops in stable Chrome, it doesn't really mean that much because, these days, for something that important, you really need both Firefox and Safari, too. Then once it's in all three, then we're talking production. That could happen quickly or it could never happen or it could take three years from now. It's going to be one of those things.
I'd say let's not forget about them again. Just because we got satisfied with them for a minute, I think, because we were like, "Wow! It's moving," I think we should all do what we can to make sure it stays moving.
Chris: By, for example, writing into podcasts and having those podcasts talk about it.
Chris: Hey, browser vendors. Keep working on container queries. Thank you. That would be great.
Everybody that has done so much work on them so far, you're amazing heroes.
Chris: Don't give up until they are out in production. That would be sweet.
Okay, but Rich keeps saying, you know, "With the sheer amount of other cool new stuff coming to CSS, what are you most excited about?" Long-time listener from the U.K. High-five, Rich.
What are you most excited about, Dave? It could be container queries, but anything else happening in CSS.
Dave: I think container queries is exciting. I don't know the latest and greatest, but the @scope is kind of my bread and butter for component systems. I'm excited about that. Then I'm excited about some of these color functions stuff because, again, that factors into design systems.
Dave: I'm very like one-trick pony here. [Laughter] If it benefits design systems, I'm very interested. You know?
Dave: Jen Simmons put out the other day a lot of people voted for typography in some survey, but letting trim and gap or, sorry, cap units, which is like -- I don't know if you've seen the project Capsize. It's basically you cut off the top and the bottom white space on your font, like the below the cap height and above the cap-height. You basically slice that off, and then you can perfectly set text, so you don't have this rando white space.
Dave: It's so necessary. [Laughter] I'm crying inside. It's so necessary for design systems because you have a title and a button, and then the button has a little extra padding on the top for some reason, so then you set the padding-top 0.8572 REM for no reason. Anyway, I'm super stoked on -- I had for features, container queries, color functions, and stuff like that.
Dave: I think programmatic color systems, the color contrast stuff.
Chris: Good answer! Good answer! Yeah.
Dave: Then what was the other? Scope and letting trim would be righteous. Yeah.
Dave: How about you?
Chris: Those are really good ones. Well, your font one made me think about -- or the letting trim one made me think about those font descriptors that allow you to (in the @fontface block) like font size adjust.
Chris: What's cool about that is that you can set those on a font, like a fallback font, for example, such that when the -- you're adjusting Helvetica or something or Arial to match the metrics of your custom font more closely. So, if you're going to go with a FOUT approach, which is good for performance because then the text is always visible. There's no delay for showing text ever, which means you've kind of got to buy into FOUT, which is not my favorite, but whatever.
Chris: When the swap happens, it's pretty-- But it's cool to be able to do that right in CSS. I really think that's where that technology belongs.
Chris: That's a cool thing. It's not at the scope of @scope or container queries, but it's pretty big.
I'd mention container units as well, which is almost just as exciting to me as container queries. If they shipped first, I'd be like, "Cool. Fine. Thanks." [Laughter]
Chris: But I think unique container queries first because container queries, you have to set a container for a container unit to mean something. But it could always just mean whatever the parent element is or whatever my parent is. Maybe it could manifest like that. These are units that are called QI and QU and stuff. I think that's where the spec is now on them.
Dave: Quintainer inline and Quintainer unit.
Chris: [Laughter] Yeah. Oh, look. They're already different. I'm already wrong.
Dave: Oh, really?
Chris: They're CQI, CQB, container query width. Yeah, that's better, I think.
Dave: Okay. Okay.
Chris: The point of them is you'd get responsive typography way better. And it's not their only use but imagine those being able to set type based on the parent size of the thing is what we've been trying to do forever.
Dave: Mm-hmm. Mm-hmm.
Chris: I think those are pretty hot. Then there are so many, like nesting. I can't wait because it's going to make me reach for Sass way less and be less salty about it because that probably is my number one thing that I'm willing to do the work to get Sass just for the nesting. And if I didn't have to do that, that's cool.
Nesting plays out in everything else, like @scope is a lot more useful if we have nesting, too.
Chris: The new media query syntax stuff is more useful if we can nest within there also, and all that stuff.
Chris: @layer is more interesting with nesting. I think nesting unlocks a lot of making CSS feel better when we get all these features.
Chris: So, let's do nesting first and then make sure it works with all the rest of them as they go.
Dave: Yeah. There's just going to be a lot of CSS-Tricks in the future. It should be really cool.
Dave: Good time to have a CSS plug. [Laughter]
Scroll timeline is kind of an interesting one, too.
Chris: Oh, my gosh. Incredible.
Chris: It's a great-looking API, when you look at the scroll-linked animations stuff and scroll timeline.
Chris: Very nice. Very nice. There's a great article from Bramus Van Damme on CSS-Tricks about not only scroll timeline, but how it can map to the Web animations API, too, which I feel like I just don't (for some reason) reach for as much as I should. But it's a really nice, really nice API for animations.
Chris: That's what you should use, probably, until that moment where you need GSAP or whatever. But it can kind of take you pretty far without it. It's a pretty nice-looking API, and they communicate with each other really amazingly well.
Chris: To the point where the demos that use them both, you're like, "What?!" [Laughter] That's wonderful.
Chris: Wonderfully easy to express with no library at all. Just native Web technology.
Dave: Just some JSON and some--
Chris: For example, you're scrolling down the page, and then you hit a section where you scroll horizontally instead. Then it reaches the end of that. Then you keep scrolling downward. People could say, "Don't do that. Don't mess with my scrolling." I get it. Right?
But there's this weird genre of websites basically called awards websites that their whole game is make it this amazing, one-page experience that will blow your mind. They're not going anywhere. They've been here since I've been a Web designer. There's always going to be them. Sometimes, cool ideas come out of that type of work.
Chris: The fact that you can make a multidirectional scrolling app where all you're doing is flicking your mouse up and down and it's doing scrolling in different directions as you go, that's amazing that the Web platform can do that.
Dave: Yeah. I think that's kind of cool, and it'll be -- it's going to go overboard. Then people are going to dial it back and say it's wrong.
Chris: Oh, yeah.
Dave: Then people are going to find out kind of some cool stuff you can do.
Chris: That's a classic argument, but you could say that about color.
Chris: Oh, my god. You can set the background color? People are going to abuse that.
Dave: Oh, they will.
Chris: Yes, they do.
Dave: They will.
Dave: There's going to be -- it's going to be wild because Lab LCH stuff -- I was talking about color, but those new color profiles are coming online. You may see websites you've never seen before because they have a color pink that you could never render before. It's not going to be muddy colors everywhere.
You don't really think about it until you see it IRL. You're like, "Wow! There is a diff." You pull up these little color demos in Safari on your brand new super Mac. It's kind of a wow moment. You're just like, "I would not have expected a big difference, but these new colors are kind of seriously different. Even just the gradients, how they go from color A to color B is so different.
Chris: I know exactly what you mean.
Dave: There's going to probably be a whole A Book Apart book written by Dave Rupert on the gradients to choose as you're going -- if you're going from pink to blue, you want to use this color profile. You know? Then we're going to have the color functions, like color adjust or color -- like get RGB from this color.
We'll have native color transpilation. Is that the right word? You basically convert a color from LCH to LIB - or whatever. It could be.
Chris: Yeah. Yeah. We looked in there, that alpha video we did on YouTube -- follow us there if you'd like -- that the color functions are going to basically accept other colors, too.
Chris: It's going to feel a lot more natural to be mixing and matching and stuff and being a little less worried about which format the color is. You can always say, "Lab from RGB."
Chris: Convert it on the fly and allow you to use what that color format does best. Very clever.
Dave: It's going to be cool. I think, too, the twist, though, is it's going to be a weird couple of years. I think you've said that this year on the videos or something where not everything is supported in everything. And so, we're just going to be -- it's going to be a little rogue for a bit, so good luck out there.
Chris: But doesn't it seem like it's going to be?
Chris: Right at this exact moment, there's not that much that I sit around thinking about what hasn't made it to what yet.
Chris: It's not none, but it's not that hot right now. I'm not staring at Can I Use every day.
Chris: I think we're coming into an era where we will be more so. /p>
Dave: Yeah. I think this is good.
Chris: It's the time for container queries yet? Can I use this weird color thing? Where can I use the nesting and stuff? Browsers are choosing very different--
Dave: Priorities, right?
Chris: --pieces of this to work on at the moment.
Dave: Yeah. Yeah, it's like they're coming at it from different angles, too. They'll all end up in the same place, but it seems like Safari has to do the color thing if they want to do the other thing. Then Chrome has to work on the layout engine to get the colors to work. [Laughter] It's all -- it's really interesting how it's all coming from different angles, so we'll see. Hopefully, stuff gets prioritized.
I talked to some browser people just the other day. They have some interesting ideas afoot.
Dave: Kind of cool.
Chris: Yes, and there's always the surprise factor, too. It's not like we know the exact list, so we're going to get something from the list. It's like you never know. You follow the vendor blog and what they tell you is coming. You're like, "What?!" [Laughter]
Dave: Yeah, yeah, yeah.
Chris: Okay. Sounds good.
Dave: Yeah, there was -- I still remember when Safari was like, "Scroll snap points." It was like, "What?!" That's an IE-only feature. [Laughter] It was an Edge feature, or something, then they were like, "Scroll snap points." It was just out of left field, but I guess Apple needed it in their marketing websites or something. I don't know. It came out, so--
Chris: Yeah. Yeah. Even as authors, our desires change. Container queries has never faltered, I'd say.
Chris: Everybody always wants those, and that'll never change. But for example, I think we talked about (last week), a website like vscode.dev drops, and you're like, "Holy crap. That's amazing." Right? Oh, but it's only useful if your browser has file system API thingy - whatever.
Chris: If the browser doesn't have that, then you can't use this, right? That's annoying because you're like, "Well, Safari doesn't," and Safari is the one that runs on iPads, so that sucks.
I don't know the answer to that because iPads don't really have a normal file system, so I don't know how that would express itself as an API anyway.
Dave: I have one right here. Let me check. I'll check. I'll check. Go ahead. I don't know.
Chris: Yeah. Go ahead. What does it say? Does it just say, "This whole website doesn't work," or whatever?
Chris: But you could see if this thing got really popular that that would just change everything. The priority at a browser vendor might be like, "Well, this is hot right now, so we're going to make that API work so that this website works because that's what everybody wants."
Dave: I opened it up, and it does load. It's running. But it only--
Chris: What does it say when you hit, "Open Folder"?
Dave: It does not give me that option. It only gives me-- Oh, wait. Let me see. "Local file system access is unsupported," so it can only open remote stuff.
Chris: Oh, well, which is kind of cool anyway.
Dave: Yeah, I mean I don't actually want--
Chris: Okay, so it works. It just doesn't do the thing.
Dave: Yeah. I don't actually want to get--
Chris: You're not going to authorize that?
Dave: --it on my 80 megabyte Java project on my iPad, actually, so anyway. [Laughter] I actually don't want that. But yeah, I mean cool. We're headed into some cool territory.
Chris: Yeah. Yeah. I think we should probably just leave it at that, Dave.
Dave: Yeah. Thank you, dear listener, for downloading this in your podcatcher of choice. Be sure to star, heart, favorite it up. That's how people find out about the show. Follow us on Twitter, @ShopTalkShow, for 16 tweets a month.
And, hmm, if you want to join us in the D-d-d-d-discord, head over to patreon.com/shoptalkshow. Whoof that was hard. [Laughter]
Then we also do YouTube over on the real CSS-Tricks YouTube channel. Chris, do you got anything else you'd like to say?
Chris: [Grumbling] ShopTalkShow.com.