Denise R. Jacobs (@denisejacobs) is a writer, speaker, designer, and educator on many things web. She is author of The CSS Detective Guide, and is a co-author for InterAct with Web Standards: A Holistic Approach to Web Design. She is a Web Solutions Consultant based in Miami, Florida, and is currently available for speaking, trainings, and new clients.

Giovanni: Hey, this is Giovanni with Unmatched Style and I’m here with Denise Jacobs. We’re going to talk about her book “The CSS Detectives Guide” and her convoluted, complex evolution from many, many things into a teacher, writer, speaker, and designer. So tell us a little about your book.

Denise Jacobs: OK, so my book is called “The CSS Detectives Guide” like you said. It’s basically about troubleshooting. A lot of people get into writing code, start with it, and then they run into a wall and can’t move forward, and get stuck. The editor that I talked to at Peach Pit, she’s like I want to do this troubleshooting guide and I was like troubleshooting is what I’m all about.

So basically I created this way of getting around really common CSS bugs, ways of laying things out, and way of just thinking about coding collectively, organizing your code, or actually solving the problems when you get to them.

Giovanni: Why don’t you tell us a little bit about how you came to the methodology that you employ in this book?

Denise: It’s actually interesting. It developed when I started teaching web design and web development at Seattle Central Community College. I taught there from 2000 to 2005. It was really interesting, I would be teaching people HTML, and we started off with HTML and then ended up moving into CSS eventually because in 2000 you didn’t really need to teach CSS. You could roll-out with your table based layouts and people were like [sarcastically] “Oh my God! That’s so cool, and you would be like yo what’s up?”

[laughter]

Denise: So my students would be coding and then they would just literally–the way I like to describe this is like those little dolls with the elastic in it and you go shh they go phew, and they just fall–and they would completely be ineffectual. So I developed this approach, and I actually developed this little cute couple page guide to troubleshooting HTML like if this doesn’t show up, it’s probably these three things. If this happens, it’s probably these three things.

If you have a problem look where it is on the screen the way it’s rendered and then go into the code and then move in concentric circles like a spiral outward, so that you can potentially find it. But don’t go looking everywhere in the code. It’s not going to be everywhere in the code. It’s going to be in one place or maybe two places.

Giovanni: Right.

Denise: And so to get people into this thinking, instead of thinking it could be everything, to say it can really only be one of three things. And then that way it’s easier and then you’re not as freaked out about it, and you’re not as anxious about it, and then you can get to the problem and you can just move on to the next thing that you need to solve.

Giovanni: So your method revolves around the fact that different elements of HTML and CSS are relative to other things that are happening at the same time?

Denise: Yes, and CSS especially, but not only that, there’s really a limited range of what the problems could be. And that’s why I’m saying it is not everything, it is a few things. When you have that limitation, just like in this conference a lot of people are talking about how creativity stems from having limitations.

Giovanni: Right.

Denise: You’re troubleshooting skills or your ability, your capacity to solve problems really is greatly increased when you know that the problem is only within a range. It could be any problem. You can’t solve every single problem, but you can solve the fact that, for some reason or another, your page isn’t showing up. It’s like oh well it’s probably somewhere in the head, it’s probably a missing bracket in the title tag, or something like that. Easy. Then once a page shows up you can look at something else.

Something like that is really easy to find and really easy to think through. Whereas if you think oh my god should I look at the end of the code? No you shouldn’t look at the end of the code. Look at the beginning of the code because that’s the very first thing that’s going to be dealt.

Giovanni: So everyone, “CSS Detectives Guide, ” Denise Jacobs, and thanks a lot. We will see you guys later.