In September 2020, my 4th book published by a publisher (6th overall) came out. It’s called HTML and CSS: Visual QuickStart Guide and it’s a (very) beginner’s guide to learning HTML and CSS. The process was long and at times frustrating. I wanted to go through how I wrote it, from inception to hitting the shelved.
Joe: Hey Everyone. Real quick before we get started, I want to tell you about my newsletter Build Something Weekly. It is a free weekly newsletter, I send it out every Monday, and it includes the latest takeaways from the week’s episodes, top stories that I’ve come across, my content, tips, tricks, tools, and more. And I’ve got to say, I feel like I’ve fallen into a really good groove with this newsletter. I’m excited with the content in it. I’m excited with the interactions I’m getting from people who are currently on the mailing list through clicks and ratings, and things like that. I’ve even introduced a new section or a new newsletter that’s part of it called the Friday Toolkit, which is monthly. But if you sign up for Build Something Weekly, you get that as well. So if you are interested in getting this totally free, totally weekly newsletter, you can head over to howibuilt.it/subscribe, that’s howibuilt.it/subscribe to sign up today.
Intro: Hey, everybody, and welcome to another episode of How I Built It, the podcast that asks, How did you build that? I’m not sure if I’ve done that in the show in a while actually. So kicking it old school this week. It’s Episode 197 and it’s a solo show. I’m going to be telling you about how I wrote my book. Back in September, my fifth book, third properly published, I believe, or fourth properly published came out. It’s called HTML and CSS: A Visual Quickstart Guide. It was my first foray into building a general interest web development book, I guess. All of my books have been pretty niche, too. Two were on WordPress and one was on Google Glass. So I was excited to hit this general learning topic. So if you’re interested, the book’s over at htmlvqs.com. But this is what we’re going to be talking about today. I’m gonna give you a peek behind the curtain to see how I wrote this technical book. So let’s get started here.
When I learned HTML and CSS, I learned it by doing it. I learned how to write HTML and CSS in like 2001. So there weren’t a whole lot of online courses. I was a high school kid. I didn’t feel like buying another textbook. So I opened up Microsoft’s front page, and I would make a page in it and then I would have a look at the HTML tab to see what the source code looked like. And I did eventually moved to Notepad or more accurately, Notepad++, shout out to my friend Steven Mccosh, who introduced me to Notepad++ and so many things, including CSS.
So what I would do is I would try something and I would see what happens. I would make an HTML page, add some markup, open it in the browser, see what happens, or I would copy someone else’s source, and modify it. That wasn’t necessarily ideal but that was the way that I learned. Today, there are a lot of great alternatives. There’s CodePen to just try stuff, there are online courses over at LinkedIn Learning, and a bunch of other places. And I am happy to add a new resource to the fray. That’s my new book HTML and CSS: A Visual Quickstart Guide.
Now, this is the ninth edition of the book. The eighth edition was written in 2012. So it definitely needed an update. So here’s how I came to write this book because I wasn’t the original author, I wasn’t the updated text author. I was essentially just a guy at this point. But it dawned on me in March of 2019, which I know feels like 1000 years ago, that my first real published book, like published through an honest to goodness publisher, my first book “Responsive Design with WordPress was coming up on its sixth year anniversary.
Now, in the web development world, in the technology world, six years is like 1000 years, right? So I wanted to update it. I had an itch to write a new book. And while I’m mostly in the online course space now, there’s still just something about putting words on a page and then seeing those words printed in real life, going to the bookstore, and seeing a book with your name on it. I’m very privileged to have that experience. And I was interested to see if my publisher was willing to publish a second edition.
So I reached out to them, that’s Peachpit. They’re a subsidiary of Pearson. I was honored to write for Peachpit because all of the books that I bought that taught me web development were Peachpit books. So I was like in the ranks of people like Dan Cedar Homes, which is amazing. Anyway, I reached out to them to see if they’d like to do a second edition of Responsive Design with WordPress, but they told me the book was going out of print. Apparently, people don’t buy that many WordPress development books. I guess they look to other online resources for that.
But my editor, my publisher, they offered me an alternative to rewrite from scratch the ninth edition of HTML and CSS: A Visual Quickstart Guide. I was really excited about this. An HTML and CSS book has a much broader appeal than advanced WordPress development book. Plus, for a while, I taught HTML and CSS at the University of Scranton, and I used a book. But I thought, man, I could update this classic textbook. I mean, a book doesn’t get to nine editions without being popular, right? So I could update this popular classic textbook to fit today’s students.
One of the reasons my editor wanted to go with me or thought about me was I also make online courses and now there are quickstart guides, and some of their other books come with a video section, a web edition, and videos for the course. So I could tackle more interesting concepts and do more of a show intel that might be easier than going and describing a big long process with words. So I agreed. Then we had to get into a couple of things before I could actually start writing.
The first is for many publishing companies, or for many content creation companies really, the original author is generally offered first right of refusal. So that means in order for me to rewrite this same title from scratch, they would have to go to the previous author and get their approval or their refusal really. So they had to offer the previous author the opportunity to rewrite the book first. Because a couple of things are happening here. First of all, if I wasn’t writing it from scratch, the way the royalties are set up is I would essentially split royalties with the original author if I was just working off his or her work. If I’m writing it from scratch, that means now that the author is forfeiting any royalties for later editions. If people still buy the eighth edition, he or she gets royalties, but the ninth edition, they don’t get royalties, because, again, I started it from scratch.
The previous author did not want to do the ninth edition. So we proceeded from there. I had to do a proposal at that point because I was working off of an eighth edition. I had a general idea of what I was going to be writing but my editorial team kind of said, “You know, make it your own.” But I had to justify a lot of the reasons why I was going to write this book. So I touched on the important parts like the huge changes that have happened since 2012 in the web development space in both HTML and CSS. In the browser space, there’s been a big focus, again, on performance, on accessibility, and things like that. And I wanted to touch on those things in the book as well. So there was a lot to cover.
I also had to look at the competition. Now the main competition and the book that I taught from when I was teaching at the University of Scranton was actually HTML and CSS by Jon Duckett. I think that’s a really nice visual book. What I’ve come to learn in writing my book is that it’s definitely more of a teacher’s aide in my opinion. I think it’s more of a teacher’s aide than it is I’m a person who wants to be self-taught. Because yes, there are a lot of graphics and explain things really nice but there aren’t deep explanations in it. I think in this book, my book, I do some more explanation. Mostly thanks to my editor. So that was the first step. Get approval from the previous author and then create a proposal and outline.
Right after this word from our sponsors, I will tell you all about how I decided to figure out what content I was going to teach.
Sponsor: I am so excited to let you know that this episode is brought to you by ConvertKit. You’ve heard me talk about ConvertKit basically all year. I’m a huge fan of the tool and I’m so excited to have them back on the show sponsoring officially. ConvertKit, if you don’t know, is a newsletter and mailing lists software. But it’s a lot more than that. ConvertKit helps entrepreneurs like you turn your side hustle into a full-time career by growing your audience, promoting your business, and building a meaningful relationship with your audience in a fraction of the time it used to take.
And I can totally vouch for this. When I signed on to ConvertKit in 2018, I knew nothing about my audience and I would just kind of send them random things. But ConvertKit helped me know and understand my audience a little bit better. You can showcase your products and upcoming projects by building custom landing pages in minutes, saving time to help you focus on taking your business to the next level. And this is great.
You can create a simple landing page with an opt-in for your mailing list. You can even point a custom domain to it and you don’t have to worry about building a full website just yet. This is all included in ConvertKit’s free plan. Plus their email designer helps you create beautiful simple emails that help you build your brainchild into a brand. I absolutely love ConvertKit and all the tools they have to offer. I’ve created sequences to help me automate some of my emails but also keep me in contact with my listeners or my readers.
I use automation to make sure that I sort out all of my subscribers in the right way so that they’re only getting the stuff that they want. And I know that the campaigns they are getting are always relevant to them because I can create an unlimited amount of forms and landing pages to appeal to the people who are signing up. So if you are interested in trying out ConvertKit, I would strongly recommend it. My business has grown because of ConvertKit. You can go to convertkit.com/built to sign up for a free account and find your audience faster. That’s convertkit.com/built. Sign up for ConvertKit today and start growing your business.
And now back to the show.
Joe: Okay, so we have gotten the approval from the previous author, we have the proposal done. My next step for writing this book was to create a mind map. And I used an app called MindNode for that. And that’s because HTML and CSS are such vast topics. I had about 400 pages to communicate these vast topics. So this book is for the beginner beginner. Like no experience whatsoever. That means that we started with: what is a website? How do you make one? What are files? How do I create a new file on my computer? So because we were starting there, I wanted to make sure that we covered all of the basics. I wanted to make sure that I didn’t get in the weeds with any one topic. I basically wanted the reader to come away with a nicely designed simple website that they could style and make look a little nicer.
So I mind mapped everything in HTML and CSS that I knew personally, I mind mapped some of the other topics like accessibility, SEO, and performance, and then I did a little bit more research. I looked at the previous edition of the book, to see what topics the previous authors covered and how I should go about covering those topics. I used Jon Duckett’s book. I know that is competition, but I also wanted to see what he thought was important and how he covered it. And I looked at some online courses, my own online course, I have an online course on HTML and CSS, as well as some that are offered on other websites. I wanted to get a good general idea of what everybody thought was important to cover and then what I thought was important to cover. This was a book in my voice so I wanted to make sure that I hit some topics that not necessarily everybody wanted to cover, but I felt was important for one reason or another.
So I made the mind map. I whittled it down and kind of compared my mind map to the previous edition of the book, looked at how much room I had, and I created an outline. That outline turned out to be way different from the writing—from the first draft. Not as far as like chapters go. I got the chapter topics down pretty good, but the bullet points under each chapter. And that’s because the visual quickstart guide is a little bit unique in the way it works. It’s generally you explain something. And then there’s what’s called a step by step where the reader can follow examples verbatim and have some result on their website.
So my topics were generally more big picture, and this book was a lot more hands-on. So I finally got that a few chapters in. But my original outline, I basically just use it as a guidepost. I’ll make sure I cover this topic, make sure I cover this topic. I really liked the way that the book turned out because of it. Again, like I said at the top of the show, I’m a learn by doing kind of guy so I wanted to make sure that the students were also learning by doing. Or the readers I should say.
As an aside here, I also made sure to set up a GitHub repository with all of the code and the start and finish or at least starting points and ending points so that they could see how they were starting, what’s the right way to have this code just in case there was some something lost in translation. So there were a lot of outside things besides writing.
But as far as the writing process goes, I’m generally a get all of my thoughts on one page kind of guy, and then send it off for edit. I am really, really bad at proofreading and I am eternally grateful to the editorial team for this book to make sure that I didn’t have a ton of typos and we reworded a lot of things to make sure it was understandable. I had a tech editor to make sure that what I was saying was factually correct. And in some cases we had disagreements. You know, there are certain things that are technically correct, but colloquially or widespread they’re referred to as one thing or another.
One example is framework versus library. We had a disagreement on how to use those words. Using the words tag and element or in CSS, properties, and rules interchangeably. So we wanted to make sure that we struck the right balance between if I’m talking to another developer, am I going to understand what they’re saying, and am I going to know the right term? MDN, the Mozilla Developers Network, their web docs, incredible. Like hugely, hugely helpful. I’m very grateful to my tech editor for leaning on that website enough to make me also lean on it. And I’m grateful to Mozilla for maintaining that website.
So the writing process went like this. I would read it over once usually, I wouldn’t usually make a lot of changes, though. And then I’d send it to my editor. He would read it over, reword things that needed rewording or make suggestions, ask questions to the tech editor, send it to the tech editor. The tech editor would look over it, make his suggestions, he’d send it back to my editor. My editor would read it over one more time and send it to me. And then I would make changes.
This process in most cases resulted in small changes here and there. But in certain cases, like the forms chapter, we basically rewrote that chapter from scratch. Because I took let’s build a form approach. My editor who is familiar with the vacuous series realized that “Hey, this needs to be more comprehensive.” So what I thought was like boring lists of things, like input elements, and whatnot turned out to be very valuable. Because again, I’ve been a developer for 20 years. Some of the things I shouldn’t be making assumptions about.
I actually in a blog post I wrote for this, I pointed out that I needed to essentially relearn HTML and CSS. Not in the how does this work and why does it exist sense. But I’m basically self-taught, and I’ve been writing HTML and CSS for 20 years. And if I’m teaching beginners, I need to make sure of two things. My experience doesn’t color what I decide to teach in the book and I use the right terminology. In certain cases, my experience was coloring what I decided to teach in the book. Mostly, it’s the fact that I’ve been using WordPress long enough that I haven’t really built a form from scratch in a long time. So you know. what is important there. So I’m very grateful to my editor and my tech editor for making sure we got it right. And I really think we got it right. I think the book turned out really good thanks to them.
So that was the revision process. I would rewrite a chapter and then I would send it back to my editor. And then I would essentially not see it again until it was in layout. So he would look it over, he would send it to a second copy editor, who would review both of our work and catch any more typos. Then it would go to layout. Once the book is in layout, I would get PDFs of each chapter where I would have to review things and we’d have to make sure everything was aligned properly. We didn’t have any orphaned concepts that should be somewhere else, to make sure the images looked okay, and things like that. And that was our last chance to kind of make changes.
One of the things that we did where we could was replace any W3Schools links with the MDN link. I mean, I know that people have opinions about W3Schools. But MDN is more documentation-like and updated and kept more regularly. Mozilla makes a browser. So that was one of the things that we tried to do. As far as graphics goes, their graphics team is great. Anything that essentially wasn’t a screenshot of a website, I sketched on my iPad using an app called Procreate. And then I would send that sketch to the team and they would turn it into a nice looking graphic. Because I’m not a graphics guy. So any of the nice looking flowcharts or things like that, the concept is something I sketched out and then the Peachpit graphics team made it look nice.
So before we get into the videos, there is another thing that I usually do in my learning resources that I didn’t do for this one. And that was a concept website. Because this was very learn the specific thing, we didn’t decide we’re gonna build out a whole website. Because we wanted to make sure to cover all the bases. I didn’t, I honestly didn’t want to shove certain concepts into a website. Like definition lists, for example, or I should say description lists. That was one of the things that I had to change and readjust. Before HTML5, they were called definition lists, but now they’re called description lists, which are more semantically correct. We’re not just creating dictionaries here. Description lists can be used for all sorts of things, but I didn’t want to have to come up with specific content just to make sure I got every HTML tag in here done. So we leaned heavily on certain concepts actually. I tried like a space motif in one chapter, I did a baseball motif and another chapter.
And then when we got to the CSS part, we did have a concept that we worked more closely with. And it was styling a Sherlock Holmes short story. But for the most part, I didn’t have a full concept site that we built out from start to finish. I just didn’t feel like that was the right fit for this particular book. My online courses, generally, yes, there is a better fit there. But for this book, I thought that it would be too contrived. I thought that it would be like shoving a square peg in a round hole. So that was the full book process.
I’ll finish that up, and then we’ll get into the videos, but first, a word from our second sponsor.
Sponsor: This episode is brought to you by Hostinger. Hosting is a dime a dozen these days, with lots of places claiming to be optimized for platforms like WordPress while also being affordable, but they don’t deliver on that promise. Hostinger does. I recently started using Hostinger for a personal project and I was blown away by how easy the setup was, how affordable their packages are. Just a few dollars a month in most cases. And they offer the best price to quality ratio I’ve seen. And I’ve used tons of hosting companies.
Their dashboard is well designed and easy to use. They offer a free domain and SSL certification. Plus they’re optimized for WordPress. That is music to my ears. When I set up my site, I was happy to see that they put some real thought into the WordPress setup process. Buying a domain was easy, then you pick your template you want to use, and they set up the site for you in mere minutes. Plus, they use Astra for all of their site templates with an assist from Elementor. So I know the site is going to be fast starting off.
They also have caching and you can very affordably add Cloudflare for a CDN. Between that daily backups and being able to manage WordPress plugins without having to log in, I was sold. So if you’re looking for affordable hosting for your side project that’s fast, secure, and optimized for WordPress, Hostinger is it.
Head over to Hostinger.com/joecasabona to see what plans they offer. I recommend the business shared plan, though they also have a managed WordPress business plan. For whatever you decide to go with, you can use the code “Joecasabona” for an additional discount. That’s hostinger.com/Joecasabona and the code “Joecasabona” at checkout. So if you want affordable, good hosting, check out hostinger.com/Joecasabona.
And now back to the show.
Joe: So once I reviewed the final layouts, it went to print. And I have the book in my hands. Again, I love the way it turned out. But when I was done reviewing all the layouts, I wasn’t done. I still had to record and edit about 100 videos. I basically would go through, I added several videos per chapter, anything that I thought was worth demonstrating or any concept that I thought would be good to just show instead of trying to explain with words. So I had to make sure that there was continuity between what I described in the book and what I was showing on screen, my editor helped with that. I had to make sure that there was continuity between videos and things like that. So that was a lot of work, though. It wasn’t too bad.
There was at one point, I showed the file system and user name, and it turned out to be one of my book’s competitors so I just made sure to change that. But aside from that, creating the videos and editing them, I think it went really well. It was a lot of work over a short amount of time, but we got them all done in time for launch. Again, I’m just really happy with the way the book turned out.
The two challenges I face even now as the book is out and being reviewed, it got a bad review. Like a kind of a mean review, to be honest. But I really can’t let that sort of thing get me down. I know that some people have certain expectations. This reviewer seems to already have known HTML and CSS. So maybe his or her experience is colored by the fact that they already know these things. But my two challenges now are capturing customers who buy the book and adding them to my mailing list and then promoting the book. The first way or the capturing customers part, I do have a mention in the book, that they can get more info, if they go to a particular URL, and sign up for the mailing list. So you know, if they make it that far into the book, then they’ll maybe want to join.
Promotion has been tough because I’ve been promoting a lot of things all at the same time. In the new year, I plan on messaging a lot of college professors who might be looking for a new book to teach in their classes. So one of our goals was to get the book published by July so that we could do that for the upcoming semester. But with the global pandemic, and there were certain delays in production on my side and on their side and finding a tech editor and things like that, we just weren’t able to do that. So that’s really my next big goal. I also want to reach out to other publications, send them a copy, see what they think get testimonials, and things like that. But there’s a lot going on in my world right now and promoting the book is part of it. So that’s just another challenge I have to tackle.
Outro: But that’s it for this episode. If you have specific questions about the book writing process, let me know I’d be happy to answer them. You can find links to the book and our sponsors and everything that we talked about here today over at howibuilt.it/197. I want to thank Hostinger and ConvertKit for sponsoring this episode. Honestly, I think they’re a good one to punch to get maybe your new business or a side hustle off the ground quickly and affordably. So definitely check them out. Let them know I sent you, say thanks. If you liked this episode, give it a rating and review. Make sure to sign up for the mailing lists.
I’m giving you too many calls to action. Here’s the one call to action for you. If you want to learn more about this episode, and say thank you to the sponsors, and sign up for the mailing list, you can do it all in one spot, howibuilt.it/197. Thank you so much for listening. And until next time, get out there and build something.