1 00:00:00,000 --> 00:00:03,000 [??] 2 00:00:03,000 --> 00:00:05,000 [treehouse friends] 3 00:00:05,000 --> 00:00:07,000 So, who are you and what do you do-- 4 00:00:07,000 --> 00:00:09,000 [interview with chris coyier] Chris, web designer. [chuckles] 5 00:00:09,000 --> 00:00:13,000 [Petitt] for people that have no familiarity with you at all, 6 00:00:13,000 --> 00:00:15,000 which is probably only just a few people. 7 00:00:15,000 --> 00:00:19,000 No, most people, I feel like. I hope. 8 00:00:19,000 --> 00:00:22,000 My name is Chris. Nice to meet you. 9 00:00:22,000 --> 00:00:26,000 Nice to meet you, Chris. >>Yeah. I work on the Internet. Yeah. 10 00:00:26,000 --> 00:00:31,000 I build websites and write about websites, and I like to teach web design and just everything. 11 00:00:31,000 --> 00:00:34,000 I'm just fascinated by the Internet, really. >>Cool. 12 00:00:34,000 --> 00:00:39,000 So you're a pretty popular figure in the web industry. >>Thanks. 13 00:00:39,000 --> 00:00:42,000 I'd say you're a thought leader. >>[whispers] Oh. 14 00:00:42,000 --> 00:00:47,000 You recently broke 40,000 followers on Twitter. >>Oh, my God. Did I? 15 00:00:47,000 --> 00:00:50,000 You did. >>Should I check? >>Yeah, you can check. 16 00:00:50,000 --> 00:00:53,000 You just broke it. >>I should have a party. 17 00:00:53,000 --> 00:00:57,000 Well, I mean, it is just a number but it's--you know. 18 00:00:57,000 --> 00:01:00,000 Yeah, it's pretty cool. It's tremendously useful actually, because I travel a little bit, right? 19 00:01:00,000 --> 00:01:04,000 And at that number you can be like, "What's a good restaurant?" at any time of the day 20 00:01:04,000 --> 00:01:07,000 and somebody is like, "I want to answer your question." 21 00:01:07,000 --> 00:01:11,000 I think that's my favorite part of it, really. >>Twitter is now your Google. 22 00:01:11,000 --> 00:01:13,000 Somebody the other day was like, "You should monetize that." 23 00:01:13,000 --> 00:01:17,000 Two people in the last week told me about how I should monetize my Twitter screen 24 00:01:17,000 --> 00:01:20,000 and I'm like, "I reject this comment, sir. I will never do that." 25 00:01:20,000 --> 00:01:24,000 By tweeting about Ferrari or something like that or doing sponsor tweets? >>Yeah. 26 00:01:24,000 --> 00:01:27,000 There's actually services--yeah, sponsor tweets that are like-- 27 00:01:27,000 --> 00:01:31,000 And I don't care if you do, but it's not right for me. It feels gross to me. 28 00:01:31,000 --> 00:01:33,000 Yeah, yeah. No, I agree. 29 00:01:33,000 --> 00:01:36,000 We're going to talk about how to raise your profile in the web industry 30 00:01:36,000 --> 00:01:40,000 or how you raised your profile in the web industry and how other people can do that. 31 00:01:40,000 --> 00:01:46,000 But before we get to that, I want to just kind of ask you some basic background questions. 32 00:01:46,000 --> 00:01:48,000 What is your background? 33 00:01:48,000 --> 00:01:52,000 Actually, first I want to ask you what did you want to be when you grew up, 34 00:01:52,000 --> 00:01:57,000 because not a lot of people-- >>Probably like a dinosaur captain. Is that a thing? 35 00:01:57,000 --> 00:02:03,000 [Pettit laughs] >>I don't know. I don't have a super "I want to be an astronaut" or anything. 36 00:02:03,000 --> 00:02:06,000 I don't know. What did you want to be when you grew up, Nick? 37 00:02:06,000 --> 00:02:09,000 I think astronaut was probably in there at some point or another. 38 00:02:09,000 --> 00:02:14,000 Yeah. >>But I don't think I was thinking, "I want to be a web designer when I grow up." 39 00:02:14,000 --> 00:02:16,000 No, certainly not. Well, that's because there wasn't a Web. 40 00:02:16,000 --> 00:02:18,000 So that would have been really weird if you wanted to be a web designer 41 00:02:18,000 --> 00:02:22,000 before there was an Internet. >>I would have been able to see into the future. Yeah. 42 00:02:22,000 --> 00:02:28,000 I liked art and stuff, like later, especially high school. 43 00:02:28,000 --> 00:02:31,000 I was into ceramics and stuff like that, but I was also a nerd. 44 00:02:31,000 --> 00:02:37,000 In high school there was a Turbo Pascal class that I thought was so rad. 45 00:02:37,000 --> 00:02:42,000 I really liked that language a lot, so I was like both throwing pots and writing Pascal. 46 00:02:42,000 --> 00:02:45,000 I couldn't even decide which 2 I liked more than that. 47 00:02:45,000 --> 00:02:48,000 Then I went to college and I was like, "I better do the Pascal thing, probably, 48 00:02:48,000 --> 00:02:52,000 "because that's where the--" That's certainly what the folks wanted me to do. 49 00:02:52,000 --> 00:02:55,000 I did it for a while and then I got to take 1 class in that 50 00:02:55,000 --> 00:03:00,000 and then it's like, "Now take assembly," or whatever and I'm like, "Oh, worst." 51 00:03:00,000 --> 00:03:02,000 You had to learn a bunch of-- I hated computer science. 52 00:03:02,000 --> 00:03:05,000 I did 4 years of computer science in college and then I was like, "I can't do it anymore." 53 00:03:05,000 --> 00:03:07,000 "I don't like these people." 54 00:03:07,000 --> 00:03:10,000 And then my roommate went for ceramics and he was just always-- 55 00:03:10,000 --> 00:03:13,000 The attitude in the art culture in college was so much better 56 00:03:13,000 --> 00:03:18,000 and the people he was hanging out with were funner and I was like, "I want to be that." 57 00:03:18,000 --> 00:03:22,000 "Sorry, parents. I'm going to switch at the end of my computer science degree to art." 58 00:03:22,000 --> 00:03:28,000 And then I ended up getting a degree, a Bachelor of Arts, in ceramics/graphic design. 59 00:03:28,000 --> 00:03:32,000 So right after that, what were some of the first jobs you worked, 60 00:03:32,000 --> 00:03:35,000 or were you just always freelancing? >>No. 61 00:03:35,000 --> 00:03:38,000 Immediately after college I took a job at kind of like a Best Buy kind of thing. 62 00:03:38,000 --> 00:03:41,000 It wasn't Best Buy. It was like a smaller, local chain of that. 63 00:03:41,000 --> 00:03:47,000 So every week in the paper was one of those gross, all color 64 00:03:47,000 --> 00:03:50,000 "Super Warehouse Sale!" 65 00:03:50,000 --> 00:03:53,000 and it was 12 pages of stuff on sale, and every week was a new thing. 66 00:03:53,000 --> 00:03:55,000 I worked on a design team. 67 00:03:55,000 --> 00:03:57,000 It was a whole bunch of designers because it's kind of fast-paced 68 00:03:57,000 --> 00:03:59,000 to put out a book every single week. 69 00:03:59,000 --> 00:04:01,000 So you're like, "Okay, this week you have page 7 and 5." 70 00:04:01,000 --> 00:04:04,000 You'd have to lay out the stuff and put big, stupid bursts 71 00:04:04,000 --> 00:04:07,000 about how on sale it was or whatever. 72 00:04:07,000 --> 00:04:09,000 It was print design right after college. 73 00:04:09,000 --> 00:04:11,000 I wanted to work in web. Web was cool. 74 00:04:11,000 --> 00:04:14,000 But it was one of those things where it's hard to convince somebody to hire you for a web job 75 00:04:14,000 --> 00:04:17,000 when you're so green. 76 00:04:17,000 --> 00:04:20,000 So how did you make that transition into web design? >>I just did it on the side. 77 00:04:20,000 --> 00:04:22,000 I was also playing in bands. 78 00:04:22,000 --> 00:04:25,000 I play the banjo, and I was playing in some bluegrass bands and stuff and I was like, 79 00:04:25,000 --> 00:04:30,000 "I'm going to make our website." I really wanted to because I had some computer science. 80 00:04:30,000 --> 00:04:32,000 I was like, "I'm good at computers. I can do this." 81 00:04:32,000 --> 00:04:36,000 I ended up just downloading WordPress and installing that on a domain that I bought. 82 00:04:36,000 --> 00:04:39,000 I was like, "I'm going to use this awesome music template I got." 83 00:04:39,000 --> 00:04:42,000 I uploaded that and I was like, "I need to change the colors and stuff." 84 00:04:42,000 --> 00:04:45,000 "What's in this fancy little CSS file?" 85 00:04:45,000 --> 00:04:48,000 WordPress and a band website was my intro into it, 86 00:04:48,000 --> 00:04:52,000 and I find that it's the most common story ever for people that got into web design. 87 00:04:52,000 --> 00:04:55,000 So many people I talk to are like, "Oh, I had to make a band website, 88 00:04:55,000 --> 00:04:57,000 "so now I'm a web designer." 89 00:04:57,000 --> 00:05:01,000 50% of web designers, that's their story. 90 00:05:01,000 --> 00:05:04,000 So did you jump into freelance work after that, or did you-- 91 00:05:04,000 --> 00:05:06,000 I've never really done freelance. >>Really? 92 00:05:06,000 --> 00:05:09,000 No. >>So you never did any kind of client work or anything like that? 93 00:05:09,000 --> 00:05:12,000 I did client work because after that weird Best Buy-ish place 94 00:05:12,000 --> 00:05:16,000 then I kind of regressed a little bit and went into prepress. 95 00:05:16,000 --> 00:05:19,000 I shouldn't say regressed. I think prepress is fun. 96 00:05:19,000 --> 00:05:21,000 It's like taking digital files that you get from designers 97 00:05:21,000 --> 00:05:23,000 and getting them ready to go to press. 98 00:05:23,000 --> 00:05:27,000 And it was fun because it appealed to all of my nerdier senses 99 00:05:27,000 --> 00:05:29,000 because there's so much. 100 00:05:29,000 --> 00:05:34,000 People don't even realize all the stuff that has to go into preparing a file for press. 101 00:05:34,000 --> 00:05:37,000 But I didn't get any-- There's no real creativity. 102 00:05:37,000 --> 00:05:39,000 You can be creative in weird, abstract ways 103 00:05:39,000 --> 00:05:41,000 like how an accountant can be creative, 104 00:05:41,000 --> 00:05:44,000 but you're not actually being creative like with art. 105 00:05:44,000 --> 00:05:48,000 And then after that I was building websites on the side-- 106 00:05:48,000 --> 00:05:52,000 because of course that's the other story that everybody has-- 107 00:05:52,000 --> 00:05:57,000 and built enough of those that I was able to get a job at an agency that did client work 108 00:05:57,000 --> 00:06:01,000 just by showing them cool sites I did for myself and stuff, like, 109 00:06:01,000 --> 00:06:05,000 "I have a blog. Check it out. It's cool. I made it by myself." 110 00:06:05,000 --> 00:06:09,000 That was enough. >>So for the last couple of years you've worked at Wufoo. 111 00:06:09,000 --> 00:06:13,000 How does that story begin, and what was that experience like? 112 00:06:13,000 --> 00:06:17,000 The agency that I worked at just out of Madison, Wisconsin--Chatman Design, 113 00:06:17,000 --> 00:06:23,000 still a great place--I worked there for years. 114 00:06:23,000 --> 00:06:26,000 Kind of just as I started that I started CSS-Tricks too. 115 00:06:26,000 --> 00:06:28,000 So it was like I was thrown into the fire. I was the only web guy there. 116 00:06:28,000 --> 00:06:31,000 I was like, "I've got to learn all this really fast." 117 00:06:31,000 --> 00:06:34,000 And so I was kind of blogging it as I was learning it, which was CSS-Tricks, 118 00:06:34,000 --> 00:06:37,000 and then that started to grow. As I worked there, I got better at the Web. 119 00:06:37,000 --> 00:06:41,000 And then I got invited to speak at a Front-End Design Conference, 120 00:06:41,000 --> 00:06:43,000 which was in St. Petersburg, Florida. 121 00:06:43,000 --> 00:06:45,000 It was the first time I was ever invited to speak. I was super excited. 122 00:06:45,000 --> 00:06:48,000 And Kevin Hale was also speaking at it, who is one of the founders of Wufoo, 123 00:06:48,000 --> 00:06:53,000 and we met there, and then just maybe a month or so after that he just called me and was like, 124 00:06:53,000 --> 00:06:55,000 "Hey, you want to work for Wufoo?" 125 00:06:55,000 --> 00:06:58,000 It wasn't just as simple as that because I was kind of a super fan of Wufoo before that 126 00:06:58,000 --> 00:07:01,000 just because it's just a great app. 127 00:07:01,000 --> 00:07:03,000 I'm still kind of passionate about it to this day. 128 00:07:03,000 --> 00:07:06,000 "Oh, my God. That Wufoo is so awesome, you guys." >>Sure. 129 00:07:06,000 --> 00:07:11,000 Yeah. I just said, "Yes, I will accept your job and move to Tampa, Florida." 130 00:07:11,000 --> 00:07:14,000 And so what was that like? What was the culture at Wufoo like? 131 00:07:14,000 --> 00:07:19,000 It was so cool. We actually crafted the culture at Wufoo. It wasn't just this organic thing. 132 00:07:19,000 --> 00:07:23,000 We were like, "We're going to make decisions deliberately to make our culture cooler." 133 00:07:23,000 --> 00:07:29,000 So we worked from home, we worked 4-day weeks, like you did-- 134 00:07:29,000 --> 00:07:32,000 or you do currently--which is really nice. 135 00:07:32,000 --> 00:07:34,000 Anybody listening that can influence your workplace, 136 00:07:34,000 --> 00:07:37,000 please do that because it's super good. 137 00:07:37,000 --> 00:07:39,000 But there's some science behind that stuff. 138 00:07:39,000 --> 00:07:41,000 It's like building and recovery periods. 139 00:07:41,000 --> 00:07:46,000 There's this cool chart that Kevin has that shows you work 40 hours a week 140 00:07:46,000 --> 00:07:48,000 and you have this productivity. 141 00:07:48,000 --> 00:07:50,000 So there's baseline productivity and you're working 40 hours a week. 142 00:07:50,000 --> 00:07:53,000 And let's say there's this deadline coming up that you have crunch time for, 143 00:07:53,000 --> 00:07:55,000 so you make everybody work 60 hours a week. 144 00:07:55,000 --> 00:07:59,000 Well, productivity is way above average because they're working more. 145 00:07:59,000 --> 00:08:01,000 And that works fine for about 4 weeks, 146 00:08:01,000 --> 00:08:04,000 and then at that point you're worse, 147 00:08:04,000 --> 00:08:08,000 you do worse work than if you would be working just 40-hour weeks. 148 00:08:08,000 --> 00:08:11,000 I don't know. There's some kind of studies and science behind all this. 149 00:08:11,000 --> 00:08:15,000 But your perceived productivity stays high so you think you're doing all good 150 00:08:15,000 --> 00:08:18,000 but you're really not. It's kind of weird. 151 00:08:18,000 --> 00:08:21,000 So don't do that. You can't just work 60-hour weeks all the time. 152 00:08:21,000 --> 00:08:24,000 So part of this was like, "But we want to utilize crunch time," 153 00:08:24,000 --> 00:08:28,000 because crunch time can be really useful to get big bursts of work. 154 00:08:28,000 --> 00:08:31,000 So you have to do that and build in recovery time, 155 00:08:31,000 --> 00:08:34,000 like giving people time off and vacations and stuff like that. 156 00:08:34,000 --> 00:08:37,000 I feel like I'm kind of rambling a little bit. But you get it, right? 157 00:08:37,000 --> 00:08:39,000 It's nice having Friday. 158 00:08:39,000 --> 00:08:42,000 And so we didn't bother each other with meetings during the week. 159 00:08:42,000 --> 00:08:44,000 We had 1 meeting a week. It was on Friday. 160 00:08:44,000 --> 00:08:46,000 We had no office, so we would rotate houses. 161 00:08:46,000 --> 00:08:50,000 So it would be Tim's turn to have the meeting there, then it would be Ryan's turn or whatever. 162 00:08:50,000 --> 00:08:53,000 We would all go there, and we'd save anything that was a big debate that week. 163 00:08:53,000 --> 00:08:56,000 If you're arguing with somebody on a Monday about something, 164 00:08:56,000 --> 00:09:00,000 we'd be like, "No, stop. Friday. We'll talk about it then." 165 00:09:00,000 --> 00:09:02,000 That way there was no blocking. 166 00:09:02,000 --> 00:09:04,000 You weren't spending the day having this argument. 167 00:09:04,000 --> 00:09:06,000 You were like, "Okay, tabled. Later." 168 00:09:06,000 --> 00:09:09,000 "I'll move on to the next thing so that I can spend my day productively." 169 00:09:09,000 --> 00:09:12,000 Anyway, I thought that stuff was so awesome when I started at Wufoo. 170 00:09:12,000 --> 00:09:14,000 I'm like, "God, you guys really--" 171 00:09:14,000 --> 00:09:18,000 And I had nothing to do with it other than I worked there and was a part of it. 172 00:09:18,000 --> 00:09:24,000 I didn't craft that culture. That was Kevin and Ryan and Chris's kind of child. 173 00:09:24,000 --> 00:09:27,000 I want to talk about CSS-Tricks. 174 00:09:27,000 --> 00:09:31,000 So css-tricks.com is a super-- >>"Dash" tricks. 175 00:09:31,000 --> 00:09:37,000 CSS dash tricks dot com is a super popular website. 176 00:09:37,000 --> 00:09:41,000 First, what is CSS-Tricks for people that are totally unfamiliar? 177 00:09:41,000 --> 00:09:45,000 It's my land kind of where I write about all things, 178 00:09:45,000 --> 00:09:49,000 mostly front end but I dabble once in a while in other kind of stuff. 179 00:09:49,000 --> 00:09:52,000 So if there's like, "Here's a cool new CSS thing that I learned," 180 00:09:52,000 --> 00:09:56,000 or, "Here's some philosophical thing about the future of CSS," 181 00:09:56,000 --> 00:09:59,000 or, "Here's a little trick or a snippet," or just anything, 182 00:09:59,000 --> 00:10:01,000 I'm like, "I want to publish that." 183 00:10:01,000 --> 00:10:04,000 And it's kind of like my external memory, in a way, 184 00:10:04,000 --> 00:10:06,000 so that I can reference my own stuff, 185 00:10:06,000 --> 00:10:09,000 and it's also people have enjoyed reading it over the years, 186 00:10:09,000 --> 00:10:11,000 the subscribership has grown. 187 00:10:11,000 --> 00:10:13,000 I know that's what we're supposed to be talking about during this interview 188 00:10:13,000 --> 00:10:15,000 is our web profile or whatever, and that's part of that. >>We'll get there. 189 00:10:15,000 --> 00:10:18,000 [laughter] That's what it is. 190 00:10:18,000 --> 00:10:20,000 So it's a blog mostly, but there are forums there. 191 00:10:20,000 --> 00:10:23,000 I also do screencasts. There's snippets there. 192 00:10:23,000 --> 00:10:28,000 I'm working on an almanac that is just like each CSS selector and property 193 00:10:28,000 --> 00:10:33,000 and just kind of a human language kind of Chris version of how I would describe it. 194 00:10:33,000 --> 00:10:37,000 There's great docs already like the Mozilla Developer Network docs for stuff like, 195 00:10:37,000 --> 00:10:40,000 "Oh, what's the syntax for nth-child or whatever?" 196 00:10:40,000 --> 00:10:43,000 They have a nice article and it's comprehensive but it's a little dry. 197 00:10:43,000 --> 00:10:46,000 So mine would be like, "Here's a more practical--" 198 00:10:46,000 --> 00:10:50,000 I want to write an almanac of nth-child but like how you would really use it. 199 00:10:50,000 --> 00:10:54,000 You know what I mean, just a human language-- >>I know what you mean. 200 00:10:54,000 --> 00:10:56,000 [makes squealing noise] 201 00:10:56,000 --> 00:11:00,000 So how did CSS-Tricks first start? What made you want to make that website? 202 00:11:00,000 --> 00:11:04,000 [chuckles] It's kind of unglorious in a way. 203 00:11:04,000 --> 00:11:07,000 Aren't they all, though? 204 00:11:07,000 --> 00:11:12,000 I had a friend who worked for tech support for Adobe. 205 00:11:12,000 --> 00:11:15,000 So he would answer the phone and somebody would be like, 206 00:11:15,000 --> 00:11:17,000 "Photoshop won't open," 207 00:11:17,000 --> 00:11:19,000 and he'd be like, "Did you plug it in?" or just dumb questions. 208 00:11:19,000 --> 00:11:23,000 So he kind of had a bead on what people asked. 209 00:11:23,000 --> 00:11:25,000 So we were like, "You know what? We're going to turn this into a blog." 210 00:11:25,000 --> 00:11:29,000 And we were reading guys like Darren Rowse, who does problogger.net and he's like, 211 00:11:29,000 --> 00:11:33,000 "I have a camera blog and put AdSense on it, and now I'm rich as heck." 212 00:11:33,000 --> 00:11:38,000 And we were like, "I want to be rich as heck. Maybe we can have a blog." 213 00:11:38,000 --> 00:11:42,000 So we made Photoshop Help, Acrobat Help, InDesign Help, 214 00:11:42,000 --> 00:11:44,000 and we had all these things and we were like, "Slap WordPress on it." 215 00:11:44,000 --> 00:11:47,000 He got calls and he'd be like, "Oh, that was a dumb question." 216 00:11:47,000 --> 00:11:53,000 "I'll just blog it and blog the answer to it and build up this archive of content of those things." 217 00:11:53,000 --> 00:11:56,000 And then I was like, "Let's do one for CSS too." 218 00:11:56,000 --> 00:11:59,000 Put that on there, slapped the same template on it. 219 00:11:59,000 --> 00:12:03,000 That was by far the least successful one. Nobody cared about that one. 220 00:12:03,000 --> 00:12:06,000 But all the rest of them just died immediately because it was like, 221 00:12:06,000 --> 00:12:10,000 "I can't wait to go home and write a tech support article about a dumb problem." 222 00:12:10,000 --> 00:12:12,000 I had no passion at all for it. 223 00:12:12,000 --> 00:12:14,000 And he didn't either. 224 00:12:14,000 --> 00:12:19,000 So we just were like, "Okay. That was a fun little run. Maybe in another life or whatever." 225 00:12:19,000 --> 00:12:22,000 The only one that stuck around, even though it was the least successful one, 226 00:12:22,000 --> 00:12:24,000 was CSS-Tricks because I was enjoying it. 227 00:12:24,000 --> 00:12:27,000 Building this kind of pseudo mini network of sites, 228 00:12:27,000 --> 00:12:30,000 I was learning a lot about CSS in the research. 229 00:12:30,000 --> 00:12:33,000 That was the only one I enjoyed writing for, so that's the only one that stuck around. 230 00:12:33,000 --> 00:12:37,000 And then I had little hits of growth once in a while. 231 00:12:37,000 --> 00:12:41,000 I got linked to by Smashing Magazine once way back in like 2007 or something, 232 00:12:41,000 --> 00:12:45,000 and they were even big then. They're way big now. 233 00:12:45,000 --> 00:12:49,000 And I got this big spike of traffic, the hockey stick or whatever they call it, and I'm like, 234 00:12:49,000 --> 00:12:51,000 "Oh, my God. I'm so excited!" 235 00:12:51,000 --> 00:12:54,000 And I spent the whole night that night redesigning the site to capitalize on the-- 236 00:12:54,000 --> 00:12:59,000 I made sure there was a big RSS button at the top that people could subscribe to. 237 00:12:59,000 --> 00:13:01,000 And people started reading it. 238 00:13:01,000 --> 00:13:05,000 It's not all just like, "And then I was successful forever." 239 00:13:05,000 --> 00:13:10,000 Then it comes back down and then it's more of a slow growth kind of thing. 240 00:13:10,000 --> 00:13:12,000 It is a super popular site now. 241 00:13:12,000 --> 00:13:16,000 How do you deal with that kind of heavy traffic? 242 00:13:16,000 --> 00:13:19,000 Are you just 1 guy? >>Like as a server? 243 00:13:19,000 --> 00:13:21,000 In any way you'd like. 244 00:13:21,000 --> 00:13:26,000 I mean in terms of the technicals of it or growing the community. >>Yeah. 245 00:13:26,000 --> 00:13:28,000 It's been a long, slow battle. >>How are you just scaling that? 246 00:13:28,000 --> 00:13:32,000 On a totally technical side, it's not that hard. 247 00:13:32,000 --> 00:13:34,000 It's just--I don't know. 248 00:13:34,000 --> 00:13:37,000 You throw WordPress on it, throw it on a decent server, 249 00:13:37,000 --> 00:13:42,000 put some caching on it--I use a CDN that requires no work, the caching plugin. 250 00:13:42,000 --> 00:13:44,000 It's like, "Use this CDN." It's like, "Okay." 251 00:13:44,000 --> 00:13:47,000 I know so little about that stuff, but the site holds up fine. 252 00:13:47,000 --> 00:13:53,000 It would take a lot to get it to stutter, I guess. 253 00:13:53,000 --> 00:13:56,000 But then there's the time, which you might have been more getting at, 254 00:13:56,000 --> 00:14:00,000 how do you manage that side of that because there's the endless flow of emails, 255 00:14:00,000 --> 00:14:02,000 there's the, "What do we do about content?" 256 00:14:02,000 --> 00:14:07,000 "What do we do about planning for the future of it?" [inhales sharply] I don't know. 257 00:14:07,000 --> 00:14:12,000 I just try. I wake up and I manipulate my computer and do the best I can. 258 00:14:12,000 --> 00:14:14,000 I have no master plan. 259 00:14:14,000 --> 00:14:20,000 One of the really great things about the site is the community and the forums. >>Yeah. 260 00:14:20,000 --> 00:14:26,000 What did you do to foster that growth, because that didn't just happen by itself, right? 261 00:14:26,000 --> 00:14:29,000 What did you do to kind of-- >>One is there's some dumb luck there, a little bit. 262 00:14:29,000 --> 00:14:32,000 Where do you think of when you think of CSS forums? 263 00:14:32,000 --> 00:14:36,000 Maybe Stack Overflow or maybe SitePoint has some stuff or something. 264 00:14:36,000 --> 00:14:38,000 Smashing Magazine dabbled in it, but I just looked the other day 265 00:14:38,000 --> 00:14:40,000 and I think they folded on their forums. 266 00:14:40,000 --> 00:14:45,000 It's just I put them up there because I would get an email and it said, 267 00:14:45,000 --> 00:14:47,000 "Chris, how do you make a triangle in CSS?" 268 00:14:47,000 --> 00:14:52,000 And there was a time where I was able to answer those emails. That time has gone. 269 00:14:52,000 --> 00:14:55,000 But I was like, "I'd love to answer you. I want to answer you." 270 00:14:55,000 --> 00:14:58,000 "Every time I answer you, now we have this connection." 271 00:14:58,000 --> 00:15:03,000 "You'll probably be a fan of me," like, "I helped you out, man." 272 00:15:03,000 --> 00:15:06,000 So I wanted to answer every single email that I got. 273 00:15:06,000 --> 00:15:08,000 And I was like, "Instead of answering with email, 274 00:15:08,000 --> 00:15:11,000 "I'm going to answer it on indexable content." 275 00:15:11,000 --> 00:15:13,000 I'm like, "Can we just move this over to the forums?" 276 00:15:13,000 --> 00:15:15,000 I would gently ask them, and they'd be like, "Sure." 277 00:15:15,000 --> 00:15:17,000 I'd post it there and then I'd post the answer there, 278 00:15:17,000 --> 00:15:20,000 so everything that I wrote then became part of building CSS-Tricks 279 00:15:20,000 --> 00:15:27,000 rather than email, which is fine but doesn't grow your content. >>Sure. 280 00:15:27,000 --> 00:15:33,000 CSS-Tricks I think stands really well on its own as a great resource, 281 00:15:33,000 --> 00:15:39,000 a really great community, but has it helped your career in other ways? 282 00:15:39,000 --> 00:15:41,000 I'm sure, right? 283 00:15:41,000 --> 00:15:43,000 I doubt I would even ever have gotten-- 284 00:15:43,000 --> 00:15:46,000 Kevin Hale and them would have never known who I was. 285 00:15:46,000 --> 00:15:51,000 I did a screencast on CSS-Tricks that was basically like an homage to Wufoo. 286 00:15:51,000 --> 00:15:57,000 So that I'm sure they noticed, and it got me that job. 287 00:15:57,000 --> 00:16:03,000 And that's just 1 thing. Imagine all the other doors it's opened--speaking opportunities. 288 00:16:03,000 --> 00:16:08,000 It basically in a weird, scary kind of way has defined me 289 00:16:08,000 --> 00:16:14,000 as who I am in the web industry is all the stuff I put there. 290 00:16:14,000 --> 00:16:17,000 It's changed me immeasurably. >>Sure. 291 00:16:17,000 --> 00:16:21,000 In our industry I would describe you as a thought leader. 292 00:16:21,000 --> 00:16:24,000 What are some-- [both chuckle] >>I lead thoughts, basically. 293 00:16:24,000 --> 00:16:29,000 You do. You have a lot of opinion currency. Is that what they call it? 294 00:16:29,000 --> 00:16:32,000 Opinion currency? I like that. >>Yeah. 295 00:16:32,000 --> 00:16:35,000 That's a word I learned today. 296 00:16:35,000 --> 00:16:40,000 What's some advice that you can give to people that are looking to try and raise their profile 297 00:16:40,000 --> 00:16:45,000 in the web industry to get speaking opportunities or to get that next client 298 00:16:45,000 --> 00:16:48,000 or that next job? >>Right, because it's pretty sweet. 299 00:16:48,000 --> 00:16:52,000 It's kind of worth doing because it opens-- 300 00:16:52,000 --> 00:16:56,000 Behind all that is money too, which everybody likes. 301 00:16:56,000 --> 00:17:00,000 But yeah, you have a higher web profile. 302 00:17:00,000 --> 00:17:03,000 Another cool thing is #Humblebrag. 303 00:17:03,000 --> 00:17:06,000 I'll probably never have to beg for a job ever again 304 00:17:06,000 --> 00:17:12,000 or craft a cover letter to send in an email, so that's pretty cool, that feels pretty good. 305 00:17:12,000 --> 00:17:17,000 That's part of doing CSS-Tricks and stuff like that. 306 00:17:17,000 --> 00:17:19,000 What should other people do? 307 00:17:19,000 --> 00:17:21,000 I feel like it's not even that hard. 308 00:17:21,000 --> 00:17:24,000 Building CSS-Tricks was a hard, long road. 309 00:17:24,000 --> 00:17:28,000 But just to raise your web profile a little bit or kind of become known a little bit, 310 00:17:28,000 --> 00:17:30,000 I feel like all you have to do is something like really rad 311 00:17:30,000 --> 00:17:34,000 and then have that be identifiable to you. 312 00:17:34,000 --> 00:17:37,000 If you built this website that looks awesome and you say, 313 00:17:37,000 --> 00:17:39,000 "Hey guys, I built this website," and other people link to it and are like, 314 00:17:39,000 --> 00:17:43,000 "Oh, you're the guy behind that awesome thing?" immediately skyrocket. 315 00:17:43,000 --> 00:17:48,000 You could really only have to do it once to really raise your profile a little bit. 316 00:17:48,000 --> 00:17:53,000 Just have some proof that you are good at what you do and people will find you. 317 00:17:53,000 --> 00:18:00,000 I think the web industry is clamoring to find more people to follow that do rad stuff. 318 00:18:00,000 --> 00:18:07,000 So for someone that's maybe a little bit newer to all this web stuff 319 00:18:07,000 --> 00:18:10,000 and they are looking to raise their profile 320 00:18:10,000 --> 00:18:15,000 or they're looking to maybe book a speaking slot at a conference, 321 00:18:15,000 --> 00:18:17,000 how do you go about doing that? 322 00:18:17,000 --> 00:18:19,000 Do you become friends with the conference? 323 00:18:19,000 --> 00:18:21,000 So you're a speaker organizer that's trying to find people 324 00:18:21,000 --> 00:18:24,000 or you want to start speaking? >>You want to start speaking-- >>Okay. Sure. 325 00:18:24,000 --> 00:18:29,000 as maybe 1 way to raise your profile or a way to make money. 326 00:18:29,000 --> 00:18:32,000 That's weird because your profile gets raised and then you get asked to speak, 327 00:18:32,000 --> 00:18:35,000 or you could raise your profile by speaking. 328 00:18:35,000 --> 00:18:37,000 So many conferences have the-- 329 00:18:37,000 --> 00:18:41,000 Christopher Schmidt is doing a CSS Dev thing in Hawaii in December 330 00:18:41,000 --> 00:18:45,000 and he's just opened it up, like, "Do you want to do a talk here? Submit it." 331 00:18:45,000 --> 00:18:47,000 There's a lot of them. That's how jQuery Conference does it. 332 00:18:47,000 --> 00:18:50,000 There's a lot of conferences that are just like--isn't that how jQ Conf does it too?-- 333 00:18:50,000 --> 00:18:52,000 just submit an idea. 334 00:18:52,000 --> 00:18:58,000 And if it's timely and if it's well presented and you sound like a good, smart human being 335 00:18:58,000 --> 00:19:01,000 who has good writing skills, you'll probably get in. 336 00:19:01,000 --> 00:19:05,000 I don't know, I've never done this, but I bet they get a lot of stuff like, 337 00:19:05,000 --> 00:19:08,000 "I want to talk variables," period. 338 00:19:08,000 --> 00:19:11,000 You're like, "Hmm, I'm going to try the next guy." 339 00:19:11,000 --> 00:19:13,000 So write good sentences. 340 00:19:13,000 --> 00:19:15,000 So submit to these conferences. >>Yeah. 341 00:19:15,000 --> 00:19:19,000 Do you think there's other ways, like getting to know the conference organizers 342 00:19:19,000 --> 00:19:25,000 or maybe-- >>Certainly. Follow them on Twitter and compliment their hair. [Pettit laughs] 343 00:19:25,000 --> 00:19:28,000 I don't know. Yeah, sure. "Have you ever submitted a talk?" 344 00:19:28,000 --> 00:19:31,000 One of the reasons I'm down here in Orlando at the moment-- 345 00:19:31,000 --> 00:19:35,000 I don't know if that's in the context of this, but we are in the city of Orlando as we speak-- 346 00:19:35,000 --> 00:19:40,000 I'm down here for a BarCamp, which are free conferences that you can go to. 347 00:19:40,000 --> 00:19:43,000 They're in tons of cities, so whatever city you're watching me through 348 00:19:43,000 --> 00:19:46,000 on the other side of your computer screen probably has one 349 00:19:46,000 --> 00:19:49,000 or there is one nearby or it's drivable if you want to. 350 00:19:49,000 --> 00:19:53,000 They're free and they're these unconferences where it's more about talking 351 00:19:53,000 --> 00:19:56,000 and who you meet and hanging out in the hallway kind of thing 352 00:19:56,000 --> 00:19:58,000 and then just presenting on anything you want. 353 00:19:58,000 --> 00:20:00,000 There's no set group of speakers and what they're going to talk about. 354 00:20:00,000 --> 00:20:02,000 All of that is decided in the morning. 355 00:20:02,000 --> 00:20:05,000 I just mention it as like going to those is a good idea. 356 00:20:05,000 --> 00:20:09,000 It may not raise your global web profile, but it will raise your local one, 357 00:20:09,000 --> 00:20:12,000 which is important too. And who knows what can happen from that? 358 00:20:12,000 --> 00:20:15,000 And it gets you more used to what the conferences are like 359 00:20:15,000 --> 00:20:20,000 and what good speakers are and what bad speakers are and all that type of thing. 360 00:20:20,000 --> 00:20:26,000 You collaborate a lot, and I think you collaborate a lot more than people realize, 361 00:20:26,000 --> 00:20:32,000 you work on a lot of different stuff, like podcasts or little side projects or whatever it may be. 362 00:20:32,000 --> 00:20:37,000 Is there a reason behind that other than it's just for fun or--? >>I don't know. 363 00:20:37,000 --> 00:20:40,000 I had to look back on that at one point, though. 364 00:20:40,000 --> 00:20:43,000 I'm like, "I wrote this book and I did it with Jeff Starr so I have that." 365 00:20:43,000 --> 00:20:49,000 Really, all these little projects I do I either seek out or fall into 366 00:20:49,000 --> 00:20:53,000 working on a small team on that project, and very rarely do I just do it all by myself, 367 00:20:53,000 --> 00:20:55,000 other than CSS-Tricks for some reason. 368 00:20:55,000 --> 00:20:58,000 But pretty much everything else I do is on a small team. 369 00:20:58,000 --> 00:21:01,000 I don't know what it is. I was thinking, "Is it just random?" 370 00:21:01,000 --> 00:21:03,000 I was trying to self-analyze this earlier. 371 00:21:03,000 --> 00:21:06,000 I'm like, "Or is it just my personality--that I prefer this thing?" 372 00:21:06,000 --> 00:21:09,000 because there are some obvious niceties, like having someone to bounce ideas off of 373 00:21:09,000 --> 00:21:12,000 and sharing the load and all that stuff, but I think there's more to it than that. 374 00:21:12,000 --> 00:21:16,000 I had this other idea for just a very small project that I work on. 375 00:21:16,000 --> 00:21:18,000 It's kind of a one-off thing. 376 00:21:18,000 --> 00:21:24,000 And I'm doing on it and I'm working on it and I was listening to myself 377 00:21:24,000 --> 00:21:27,000 think about how I want to find somebody else to get in on this thing. 378 00:21:27,000 --> 00:21:30,000 And I'm like, "Why do I even want that? It seems so random." 379 00:21:30,000 --> 00:21:33,000 I think it is somehow embedded in me that when I work on a project 380 00:21:33,000 --> 00:21:38,000 I need to find at least 1 more person to pull in on it. 381 00:21:38,000 --> 00:21:41,000 I had this idea to have Gold Bond alerts--remember that?-- 382 00:21:41,000 --> 00:21:43,000 where it's like it will text you if it's a really hot day 383 00:21:43,000 --> 00:21:45,000 and you should probably be wearing Gold Bond. 384 00:21:45,000 --> 00:21:47,000 It never got anywhere because I couldn't find-- 385 00:21:47,000 --> 00:21:49,000 I really wanted somebody else to share the glory. 386 00:21:49,000 --> 00:21:51,000 I was trying to bug Jim to do it with me, but he wouldn't do it. 387 00:21:51,000 --> 00:21:55,000 Or he didn't refuse, but he's a busy guy. >>I'll bug him for you. 388 00:21:55,000 --> 00:21:59,000 Okay. [laughs] I can't do that by myself. I need 1 more person. 389 00:21:59,000 --> 00:22:03,000 Last question. We've talked about how to raise your profile in the web industry. 390 00:22:03,000 --> 00:22:06,000 But I think there's probably a lot of people watching 391 00:22:06,000 --> 00:22:10,000 that would rather hear you talk about CSS maybe, 392 00:22:10,000 --> 00:22:12,000 so I'm just going to ask you a super vague question. 393 00:22:12,000 --> 00:22:15,000 What do you think is the future of CSS? 394 00:22:15,000 --> 00:22:18,000 Or will there ever be a replacement for CSS? 395 00:22:18,000 --> 00:22:21,000 Or where do you think it's going? >>Let me grab my magical globe. 396 00:22:21,000 --> 00:22:23,000 All right. >>[makes whooshing sound] 397 00:22:23,000 --> 00:22:27,000 Yeah, I have no idea. What? [laughs] There's obvious stuff. 398 00:22:27,000 --> 00:22:36,000 The syntax of CSS is always changing in a little bit and kind of really needs it. 399 00:22:36,000 --> 00:22:39,000 CSS preprocessors have been kind of popular and on the fringe 400 00:22:39,000 --> 00:22:43,000 and always kind of this ever-present, growing thing. 401 00:22:43,000 --> 00:22:46,000 They're big in my life right now because I've switched everything I do to starting to use them. 402 00:22:46,000 --> 00:22:49,000 These are things like LESS and SASS or whatever. 403 00:22:49,000 --> 00:22:52,000 CSS for sure--there's no doubt about it--is going to start adopting 404 00:22:52,000 --> 00:22:54,000 some of those ideas that can happen in there. 405 00:22:54,000 --> 00:22:58,000 So the ability to do nesting, the ability to do variables and stuff, that's coming. 406 00:22:58,000 --> 00:23:00,000 The future of CSS is slow, though. 407 00:23:00,000 --> 00:23:03,000 As we all know, it goes slowly. 408 00:23:03,000 --> 00:23:06,000 So let's say they finish the spec for nesting, 409 00:23:06,000 --> 00:23:08,000 now it's this new thing you can do in CSS. Done, right? 410 00:23:08,000 --> 00:23:11,000 Well, not really, because when can we use that? 411 00:23:11,000 --> 00:23:19,000 It's so long, like 10 years maybe we'll be able to write that in CSS without any help 412 00:23:19,000 --> 00:23:22,000 because there's no way that gracefully degrades. 413 00:23:22,000 --> 00:23:25,000 If a browser sees that that doesn't understand it, it just will show nothing. 414 00:23:25,000 --> 00:23:27,000 That's not acceptable. 415 00:23:27,000 --> 00:23:30,000 So the future of CSS, it's trucking along now. 416 00:23:30,000 --> 00:23:32,000 There's new cool stuff all the time. 417 00:23:32,000 --> 00:23:37,000 But our ability to actually use them without any help is slow. 418 00:23:37,000 --> 00:23:39,000 But I think the future is bright. 419 00:23:39,000 --> 00:23:42,000 People like to complain about CSS. 420 00:23:42,000 --> 00:23:45,000 They're like, "What, are you dumb? CSS is the worst. It can't do layout." 421 00:23:45,000 --> 00:23:49,000 I'm like, "I don't know. Have you seen the Internet? It's full of CSS. It's awesome." 422 00:23:49,000 --> 00:23:52,000 I think CSS is pretty all right. [chuckles] 423 00:23:52,000 --> 00:23:54,000 Thanks so much for your time. I really appreciate it. 424 00:23:54,000 --> 00:23:57,000 I think I definitely learned a lot. 425 00:23:57,000 --> 00:24:00,000 And thanks for hanging out. >>Yeah, man. Thanks for having me, Nick. 426 00:24:00,000 --> 00:24:05,000 Appreciate it. >>Treehouse! Is that a T? T! [laughs]