Placed in: Home arrow Useful arrow Reviews arrow All about CSS-Tricks and more with Chris Coyier viagra australia
viagra online
viagra sale
cialis online
cialis australia
All about CSS-Tricks and more with Chris Coyier

Last week, I had the privilege to have a chat with Chris Coyier (nice alliteration). If you've never heard from this guy living in Chicago (Illinois), I'm pretty sure you've seen his website one ore more times: CSS-Tricks. On his site, he shares great information about CSS, jQuery and more webdevelopment techniques.

During this conversation, Chris shared some great information that could be interested for everybody that's working in the webdesign field. You can read the whole chat here.

Chatting with Chris Coyier

Now, lets sit down, take a drink and chat with this creative man behind the scenes of CSS-Tricks.

All about CSS-Tricks and more with Chris Coyier

Hi Chris! First of all, I want to thank you for taking the time to chat with me. Most of the readers will already know you from CSS-Tricks, but for those that don't, could you please introduce yourself? Where do you live, what do you do and what do you love to eat?


Hello everyone -- and thanks Marco for having me for this interview. I'm looking forward to doing this "conversation style", I'm sure it will be fun. If anyone has heard of me, it's almost certainly from my web design/development community site CSS-Tricks. That's something I've been doing for a number of years. CSS-Tricks has a number of faces. It's a blog where I write tutorials and opinions and whatnot on web related topics. It's a forum, where people ask and answer questions and discuss web stuff. And it's screencasts, which are hands-on instructional tutorials (all free) where I demonstrate some technique of some kind. There is a bit more too it than that, but those are the big parts, with more to come of course!

I have a "day job" as well though. I work at a small design company out of Madison, Wisconsin. I live in Chicago, Illinois and work for them remotely. I get inspiration for articles from all over, but a huge source is my day to day life as a regular web designer.

My favorite thing to eat is a good bowl of beans and rice!

A bowl of beans and rice! That's something that I haven't heard before.

You just told us a little bit about CSS-Tricks. The most notable thing of all (at least: in my opinion) are your screencast. You really put a lot of time and effort in creating high quality video tutorials.

How and why did you come up with the idea of doing screencasts? Your screencasting setup has grown to an almost professional looking recording system. And how do you decide what kind of stuff will be placed on your blog and which one will be a video tutorial?


I think screencasts just clicked for me one day as an obviously good method for teaching. You can say so much more with voice and video than you can with the written word. I remember when I first started doing them I was extremely nervous. It probably took me 40 screencasts to be really relaxed doing it. The beauty of it is the ideas are in no short supply. Literally almost any post on my site could become a screencast. I have a tendency, for better or worse, to ramble on and on about what I'm thinking. So if I decided I was going to do a screencast about CSS formatting, I'm sure I could fire up the recorder and talk about that for 45 minutes with almost no plan at all. Unfortunately that probably wouldn't be very interested, so I do spend some time trying to think of things that would make the best use of the video format. Typically it's start-to-finish end product kinda tutorials rather than abstract concepts.

Believe me, the setup is not very professional at all. It just the microphone in the shockmount on the mini boom stand that makes it look cool =). A good microphone is a must, I bought that before I did my very first one. Even still, it was only a few hundred bucks. The software is inexpensive as well, so all in all it was a small investment. That's a good thing too, because the screencasts sure don't make any money. In fact if I didn't have a generous provider of free bandwidth they would lose a good bit of money.

You're right - Video's explain a lot more than most regular tutorials. I tried making a video tutorial too before, but I'm kinda ashamed of my "broken" English because of my Dutch accent.

About your "rambling" - You recently spoke (together with other great web-people) on the Front-End Design Conference. In your Wrap-up you mentioned it was your first speaking at a conference like that.

How was it and what did you like most of it? Would you do it again another time and what would you do differently than what you recently did?


I don't think you should be ashamed of your voice! If you worry about being able to understand, just talk slow, practice, and keep it short and sweet. I'm sure you'd be great at it.

The Front-End Design Conference was awesome. It was my first time not only speaking at a conference but even attending one. I learn so much in my day to day, I've never been able to justify spending all that money and traveling just to learn. However now that I've been at one, I understand they are far more than that. It's so great to be hanging out with folks and be able to "talk shop" in a way that most of us can't with our family and friends.

If I get the chance to do it again, I think I'd spend more time on the slides. I think my presentation went great live, but the take-home slides didn't have much to offer by themselves without the talk.

I don't know about that - you might want to add some comments to your slides, but I personally like them as they are. Too much text on each slide would be distracting. Liked watching your presentation though! Sadly, I couldn't be there to meet you (and other great folks) in person, since it is on the other side of the world.

Talking about meeting persons - It must have been great to actually meet some people that you probably only knew online. Are there any great people left that you would love to meet in real person that you only know from "the written online word"? Why those people?


I just like to meet anybody that is really into web design and doing cool things. Sometimes in just regular life I'll meet someone who tells me they are a designer. I always get really excited and want to talk shop and find more about what they do. Then a lot of times you'll find out that they just aren't that into it, it's just a job to them. That's fine of course, but unfortunately the excitement is lost because they just aren't interested in talking about design stuff. That's why the conference thing was so great, since if you've made it this far, you at least somewhat excited about design.

If I budget myself well enough, I hope to make An Event Apart in Chicago since I'm sure that will be jammed with awesome folks I'd like to meat. Holy cow though, that one is expensive.

Did you ever meet someone that recognized you from CSS-Tricks (which you didn't know)? That would be pretty cool.

A while ago, you were crowned as Count Chris Coyier. From that point on, your blog kept on growing and growing and you should be a king right now.

Could you tell us a little bit more about how your blog grew in the past couple of years? Which (kind of) article did make your visitor count boost? Where did you receive most traffic from etc.? In short: "What's the secret behind the success of CSS-Tricks"?


Nope that's never happened to me (except at the conference I guess, but that doesn't count). That'd be pretty neat but it's highly unlikely. As Noreen Morioka once said, "being a famous designer is like being a famous dentist.", and she's actually famous.

CSS-Tricks is only a little over two years old now, so yeah it's kind of shocking how much it's grown, especially since the blog portion is 95% written by me (just a few guest articles, like yours!).

I hardly ever look at analytics to be honest, but just now I'm taking a peak at it looks like my #1 traffic source is Google. I think that's awesome. My biggest goal with the site is to have it be a useful resource, and the fact that my site is showing up as a resource for things people are searching for means I'm doing something right. I also get a good chunk from both referring sites as well as direct traffic. This is also great because it means my traffic isn't dependent on any one particular source. For example, StumbleUpon can be a great traffic driver for blogs, but if 90% of your traffic is from that, that means you are slave to creating content that panders to it, and if it dries up, you are bust.

I wish I could tell you there is some "secret" to it, but I really have no idea. I like to think it's because I try to create useful and interesting content that comes with my voice and opinion. I refuse to do stuff like "Over 7,000 Photoshop Brushes!!!". I think that stuff is a plague on the design writing community. There is no voice there, and even if that stuff gets 2 million saves on Delicious, it doesn't give your site true lasting value.

Marcofolio.net made that change in the beginning of the year. Most articles from 2007 and 2008 are "written for the social communities" (Top # of something - the list type of articles), while the last articles from 2008 and almost every article from 2009 are written "just to teach". Although the visitor count did go down, the feed count went up. Also, it does feel more satisfying writing an article yourself and helping others, instead of gathering articles others have written.

Your website is called CSS-Tricks. Lately, you don't blog always about CSS or about Tricks (guess you picked that name in a very early blogging stage). When and why did you start switching to articles that are interesting to webdesigners/webdevelopers (PHP, jQuery etc.), instead of sticking only to CSS?


It's not even the concept of "list posts" that is the problem, it's just when they are poorly done and lack opinion and voice. For example, if you wanted to write a post called "Top 10 Design Trends of 2009" and look at hundreds of popular sites and come up with some opinions on what you see happening commonly in design, that would be interesting. It would be your research, your opinions, your words. But if you write a site "30 Design Sites You Should Follow!!" and take screenshots of the homepage (if even that) and write half a sentence about each on that is probably copied from the sites tagline, that's just trash.

I have mused a bit before about the name of my site. I even included a survey question about it recently in my 2-year anniversary survey/giveaway, where I asked people how much they cared that what I wrote about wasn't always (or even usually) about "CSS" or "Tricks". Most people didn't care, although more than I would have liked didn't like it. Oh well. The name probably isn't going anywhere, and most days, I think it's still fine. CSS is heart of web design. You absolutely need it, and I still love writing it more than any other language. There are no competing languages for CSS, so it will be a central concept of web design for a long time to come.

As for the other topics I write about (PHP, jQuery, etc), I just write about what I am doing at the time usually. So as I expand my own knowledge and come into doing work in other areas, chances are it's going to make it into some articles or screencasts. I try and keep things at a beginner to intermediate level though, as that's usually where I am at =) .

Talking about "list posts": At the end of 2008, I wrote an article called Best of the Best: 2008. It was a roundup where I asked several bloggers what they thought was their best article of that year. One truly unique entry there was yours, called The CSS Wishlist.

Some entries in that article are great (I especially like the one from Jeffrey Jordan Way), but I was hoping to find your opinion there too. Since it's missing, I'm going to ask the same question to you: What are you currently "missing" or would you like to see coming to the next version of CSS? And if we take it one step further: What do you hope the "next generation" of the Web will bring us?


There is lots of stuff I'd like to see in CSS. The stuff going on in LESS is kinda awesome: nested selectors, variables, mixins, simple mathmetics. That is all stuff that could go into the CSS spec potentially and be really powerful. But I have to admit, it's smarter people than me that write these specs, and it's very very tricky business. They have to take into consideration all kinds of stuff I can't even dream of I'm sure.

One thing that just came up recently for me is a problem with background positioning, where you are only allowed to set values that start from the top and left. It would have been really useful to be able to set values for this background image from the bottom right instead.

I do hope that all this fancy CSS3 transitions and animations stuff becomes more widespread adopted by browser vendors, but I'm not holding my breath on that. I say "fancy", which the end results can be, but don't misunderstand me in that these affects are only for fluff. Take for example if you wanted to have the background color of a link fade from red to orange when rolled over, because it went with the aesthetics going on your site. That's JavaScript territory right now, and essentially a hack (rapidly altering the DOM). But the end result is a simple design choice, which really just belongs in the CSS.

LESS indeed is very promising. Would be great if those techniques were directly implemented into CSS. But we would have to wait until 2050 for that.

How did you become so good at "doing what you do"? Did you just started messing around with HTML/CSS some time ago and took it off from there? Did you took classes or do you only read books? Please share with us how you started and grew from a "regular geek" to a CSS/webdev "hero".


I really appreciate the kind words, but I am very far from any type of hero. I feel like I'm pretty darn good at HTML and CSS but beyond that my skills are very average. I remind myself I've only been doing web design professionally for a little over two years. I went to college for design, but we never touched HTML or CSS. I have read a bunch of books but I see books as ways to reinforce what you already know and inspire, more than the teach from scratch.

I credit WordPress with a lot of what I know about web design. Most of my early experience was poking around trying to figure out how to get blog themes to look how I wanted them to look and do what I wanted them to do. I always suggest to people that starting with templates is a great way to learn. Fixing up a car is a lot easier than building one from scratch. Same deal. It's nice to have the blog as an outlet as well, and I highly recommend that. If you learn a whole bunch about something one day, like how to build a dropdown menu for example, write it down. Re-teaching it will reinforce it in your mind and give you a reference for later when you inevitably forget how to do it.

Having WordPress as your entry to the webdesign world is pretty unique, but it has turned out very well for you. My personal experience is that I tought the basics of HTML myself, learned some advanced HTML/CSS on school but my PHP knowledge is mostly self-thought: By playing around with Joomla!.

Can you answer these questions just by the top of your head:

  1. What's the most useful quick/small CSS trick that you love to use?
  2. What are your favorite three web-safe fonts?
  3. What three websites to you frequently visit when looking for inspiration?


  1. On pretty much every site I do I end up using CSS image replacement and Body ID's. Simple stuff, but always useful.
  2. I do almost everything in "Lucida Grande", Georgia, and Helvetica.
  3. I like Best Web Gallery (web design), Pattern Tap (specific areas of web design), LogoPond (guess), and For Print Only (print design).

The famous Helvetica! Well, most desingers love to use that font, so no big surprise there.

One great thing about your blog is that most of the stuff placed there is really unique and innovative. How do you get those ideas and prevent getting into a "writers block"? Where do you get your most inspiration from, both online and offline?


I get ideas for things to write about from lots of places. I get them from emails and the forums and the community around CSS-Tricks. I get a lot of ideas from my day to day work as a designer. I get ideas out of the blue from just daydreaming about design and code. I get ideas from general life and all the non-nerds I know, who help me always remember how strange and complicated all this web stuff can seem.

I avoid writers block by always having an archive of ideas going. I use Things on my Mac for keeping to-do lists, which is just brimming with ideas for things to write about or screencast. If I'm in the writing mood, I can usually glance through the list and find something that seems palatable at the time.

Haha - I have a folder for that (that contains folders with post titles and ideas). Lots of proof of concepts can be found there, but don't have the time to convert them into a tutorial/article.

A couple of blogging people are also going to publish books (or already have), like Retro Style Graphics from Grant Friedman, The Smashing Book from Vitaly Friedman (and other writers) and The Rockable Books from Collis Ta'eed.

You and Jeff Starr announced your book, Digging Into WordPress a while ago. How was it, writing an actual book? How and why did you start? And why only in PDF, and not a "hardcopy" book?


The idea itself was literally just "hey we should write a book". I think it's a natural step for people who do a lot of writing and designing anyway. I can say it's an absolute ton of work. At this point we've easily written the whole book two times over already and have plenty more work to do. We actually use Google Docs to do the writing. It's a really simple and great way to do collaborative writing.

The decision to go with the PDF was just because we decided we really wanted to just write to the beat of our own drum, so to speak. It was a tough decision that we wrestled with for a long time. It certainly would be cool to see our names on the shelf at Barnes & Noble, but ultimately it's going to be even cooler to have 100% control over everything we do and see 100% of the profit. It's possible, even somewhat likely, that ultimately the book will hit paper at some point, if just in limited quantities.

It indeed sounds like a logical step. I guess you need loads of time, knowledge and motivation to do so. Although I'm not a WordPress guy, I can't wait to see your book. Might help me get me first steps getting into the ever-popular blogging platform.

You said writing a book was a natural step for you. Do you have any more plans on growing as a web personality? You already came up with the AreMySitesUp service, Quotes on Design, Script and Style and HTML Ipsum. Do you have any other projects in the tubes?


I have a slight redesign for CSS-Tricks coming soon that will be launching a new area of the site, so that's pretty exciting, but other than that, no big secret new projects in the work. The book is a gigantic enough project that that is taking any extra chunks of time. I'm sure as time rolls on there will be new stuff =)

That's what you get when you are so creative! New ideas just keep popping up. Some (like AreMySitesUp) are loved by the community, others (like your Status and my WeirdGlobeNews) sadly die silently.

If, for some reason, the whole internet would be "lost" (how about that for a scenario) and you had to re-build CSS-Tricks from scratch once again (you can't place back a backup), what would you do differently than you are doing now? In other words: Would you do things differently now than when you first started CSS-Tricks?


Fortunately because data is stored so redundantly these days (locally, the cloud, physical media, etc) mass catastrophic failure is pretty unlikely. It is an interesting thought though. I guess after the rioting stops from the global economic meltdown, I'd just start right back up again writing. Design will be important forever.

What do you think which quality is a "must have" for every webdeveloper/designer and why?


Time and Patience. Like any other skill that a person can have, getting good at it takes a lot of time and patience. By time, I mean years and years of hard work. By patience, I mean staying calm and realizing that today's frustration is tomorrows learning schedule. Ask Yo-Yo Ma if he became a great cello player by watching TV or practicing cello for countless hours.

Sadly, those particular skills are really hard to find these days. But you're right; If you want something, you must work hard to achieve it!

Chris, I want to thank you a lot for this inpirational chat conversation where you shared some great information with me (and my readers). Are there are last words that you want to share?


Just thanks for having me Marco! You should do more interviews like this. The conversational style is definitely a good approach. Take care!



Tags:  chris coyier css-tricks interview chat conversation

Interested in this topic? You might enjoy another article I've written called

Did you like this article? Subscribe to my feed or email to keep updated on new articles.

Spread the word and submit to:
Digg!Reddit!Del.icio.us!Facebook!StumbleUpon!
 
< Prev   Next >
Subscribe

Subscribe to Marcofolio