2008-08-27

Chris Coyier: the man behind CSS- Tricks

We welcome to the hot seat Chris Coyier. He is the designer and writer behind the CSS-Tricks blog. CSS-Tricks discusses new tricks (duh), ideas, and styles in CSS.

Preeti at Web Hosting Search: Let's start with the beginning, how did you decide to apply for a job at Chatman Design without any 'real web' experience?

Chris Coyier: It was a lucky break, really. I head from a friend of a friend they need somebody quickly so I got my resume together and called over there. I was working this crazy job as a Prepress tech at a printing company working three 12 hour shifts from 6pm to 6am. So I had four days off every week and I was spending my time immersed in learning about web design.

So I didn't have any "real" web experience, but I had plenty of "learning on my own" web experience. During my first interview, we popped open a laptop and viewed some of the sites I had been working on. So that's an important tip, definitely have some websites ready to show off if you are trying to get a web design job!

WHS: How was CSS-Tricks born (for those who don't know)?

CC: That first obsession with web design began with this idea to start a bunch of blogs focused around helping people out with design stuff. Most of them were focused on specific Adobe software (like IllustratorHelp.com, now long gone). By far the least successful of these was CSS-Tricks.com, but as it turned out, it was the one that I enjoyed writing for the most. It became my early journal for documenting all the stuff I was learning about web design. I found that if I wrote up what I was learning as a tutorial I learned it myself a lot better. That is basically still what CSS-Tricks is today! Only it's just grown a lot since then and all those other blogs have faded away.

WHS: How do you balance your schedule between the day job and CSS-Tricks?

CC: I work regular day-job hours where I work on day-job stuff. I work on other projects, including CSS-Tricks at night and weekends and when I have free time. It's manageable. CSS-Tricks requires no particular commitments. I plan to keep active at it forever, but if my work schedule got too busy or something unforeseen were to happen, it could take a rest. The day-job is where all the ideas come from anyway, it's like my training for CSS-Tricks.

WHS: You have Band Website Template, any plans for more sites like this?

CC: Yep. That was fun to make! The idea is that its a website template, but not soley just a design. It comes with extra functionality built in that is specific to the type of site it is. In the case of the Band Website Template, it is a secure interface for managing a gig calendar. Something that all band websites need. I help some friends out with a website for their band, and the idea was first built into their site and then re-structured for this template.

When we do a new template, I want it to be the same way. Not just a design, but some context-specific functionality. I want them to so well made and designed that even if you didn't need the template, you could buy it and poke through it as a lesson in web design and development.

WHS: What is your favorite CSS-Trick? Okay maybe you can't choose one, two is fine.

CC: My favorites are really the big classics. CSS sprites are really cool. That is, using one big image which you only display small parts of in certain places. You can drastically reduce the number of server requests using CSS sprites properly and significantly speed up a website. CSS image replacement is a classic too, allowing you to use really clear, semantic, text tags in your HTML and then swapping that out for an image with CSS. This provides the best of all worlds, full design control, high accessibility, and better SEO. Another favorite is the sticky footer, that's a clever bit of CSS right there.

WHS: For those new to web designing, what is CSS and why is it important to use it?

CC: Even if you aren't a web designer, you know what HTML is. It's the language which browsers read to display websites. Every website in the world uses it (or a version of it). Even "Flash" websites are just flash files embedded into HTML. The idea behind CSS is remove anything from the HTML that has to do with the design of the website, leaving behind only the content of the website. Having those two things separate is loaded with positives. Perhaps most importantly, it keeps your code easier for YOU to understand. Updating content becomes a lot easier.

Search engines also have a lot easier time with content not cluttered with irrelevant information. Changing the design down the road becomes a lot easier. The pages are more efficient and load faster. The list goes on and on. With today's internet, any site not using CSS for design/layout is just dumb.

WHS: So I'm trying to make my own website and learn CSS, HTML, etc, but it can be very confusing. What advice do you give to new web designers?

CC: My advice is to start with a template. Download something you like from somewhere, get it up as website, and then start getting creative and changing things to get them how you want them. How I learned was actually installing WordPress and messing with themes. You can learn a lot that way quickly.

Then, once you have your feet wet, go back and start learning some fundamentals. What is the box model and how does that work? If you start with those fundamentals, you will bore yourself to sleep because you don't have something tangible to relate it to first. It's a bit like learning the guitar. Yes, you really need to work on fundamentals. But, it's a heck of a lot funner and you'll stick with it if you learn to play a song first.

Let's talk about you…

WHS: I notice one of your hobbies is photography? What do you like to shoot?

CC: I'm really an amateur, but it is really fun. I'm attracted to all the nerdy things you need to know about like shutter speed and aperture. Portraiture is usually my favorite, I like close up candid shots that happen to capture something really emotional or special. Like I said though, I'm really an amateur and what I really need to do is just take more pictures!

WHS: How do you enjoy Portland, OR compared to Madison, WI? Does cow tipping exist there? Just kidding. :)

CC: HA! When I was in high school in Verona, WI (just outside of Madison), there was definitely some cow-tipping going on. I didn't grow up here in Portland so I don't really know, but I bet some of the rural areas around here have their fair share. The city of Tillamook actually isn't that far from here which is a gigantic cheese manufacturer, so it's not like there isn't any cows around here =).

Madison is awesome though, I certainly didn't leave because I hated it (Go Badgers!). I work from home and so I can work from anywhere and I'm just out here for the change in scenery.

WHS: mmmm. cheese.

WHS: Lastly, you have some pretty cool friends: Chris Spooner, David Walsh, Steven Snell. Do you get to met IRL or is it virtually?

CC: I've actually never met any of those guys in real life, which is too bad really. Even David, who is from Madison, I've never actually met. We became better friends after I had moved out here to Portland. All three of these guys do seriously amazing work though which I really respect on top of them just being nice guys in general.

I'd probably meet folks more often if I actually went to conferences or meetups or anything, I just never seem to make it. I somehow manage to have some friends in real life too, who are also very cool, just aren't techy enough to be on my blogroll =).

Thank you Chris for your time on this interview. We definitely love to hear about the inside view of web designing. If you want to contact Chris, you can do so by visiting his website at www.css-tricks.com . Either way, do visit his website, there's a dearth of good information.

And P.S. we also want to wish him a happy birthday!

Add Your Thoughts

captcha

Shashi Kumar,  22 May, 2009

Firstly Thank you for posting this great interview from Chris, I regularlky visit css-tricks and learnt the most valuable things needed in this business from css-tricks, nevr had the time to say thanks to chris there, her I thank you both

AskApache,  22 July, 2009

For sure I've been a huge fan of css-tricks.com for years.. Back when I was really learning CSS that was T-H-E place I would go to learn cool stuff... lots of ground-breaking articles etc.. Nice interview!

dougS,  7 October, 2009

For sure, Chris is a rock star. No doubt about it. Thanks!

Bob,  28 December, 2009

Thank You very much! Now it works. I wish, I had found this document a few hours earlier.
membuat Blog

Elune,  4 January, 2010

Thanks for useful CSS tutorials!

telecharger sonnerie gratuite,  1 March, 2010

You know, i always have to work with Internet but i have little experience about web. Thanks a lot for your useful article. I wish you would keep on posting more.

dog tags for dogs,  1 December, 2010

I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts. Any way I'll be subscribing to your feed and I hope you post again soon.
<a href="http://dogtagsfordogs.org">dog tags for dogs</a>

List all related articles..

Overall Best Web Hosts

1. $1.99Review
Visit Lowest Price Guarantee
2. $2.95Review
3. $4.95Review
4. $3.99Review
5. $3.49Review
Visit Lowest Price Guarantee

Get hosting confidently - When signing up for one of the tagged hosting plans above you can be confident that you are getting the lowest price available for that plan.

Buying Guide

Can't decide what hosting is right for you? Answer 2-5 questions and get your perfect hosting match!

To Questions

User Reviews

Make your voice heard. Review your web hosting provider - good or bad.

  •  
  •  
  •  
  •  
Everything has been very stabile and I was very impressed with all the features and extras that were included in the plan.

Bill about iPage

Read iPage Review