Few weeks ago I volunteered at my local library to teach teens web development. One weekend I taught HTML basics and the next weekend I followed up with elementary CSS. I’ve never taught anyone anything before so this was a new experience for me and I want to write about it.

There were about 7 teens for the first class on HTML and about 4 for CSS. I expected a lot more with my first class but I was happy with the turnout and since CSS class was based on the HTML class, the lower turnout for CSS was expected. There were a mix of girls and boys with age range between 12 and 18. We provided laptops for those who didn’t/couldn’t bring their own computers. I noticed that some kids didn’t even know how to type an angle brace because they don’t have a personal computer at home but instead just use iPad/iPhone or some other tablet or phone, which is interesting on its own. Some kids were flying through the HTML basics completing their tasks even before I get to finish my slides because they have already taken CodeAcademy classes on web development. It was an interesting and little bit eye opening session for me.

When I first signed up to do this I thought this would be really easy to do since teaching HTML and CSS basics is not that hard. I’ve been using HTML and CSS for a long time now and even though I don’t know the inns and outs of every single tag or CSS property (especially with the ones in HTML5 and CSS3) how hard would it be to come up with a hands-on teaching for teens? Well, apparently it was hard for me. I spent a lot of time making the presentation and coming with a plan to teach. I probably put in a lot more time and effort into the preparation because I had no idea what teens learned nowadays on their own or in their school curriculum and so I couldn’t access the level and/or pace at which I should go about teaching the class.

I thought both the classes went well but who knows what they actually learned. In both the classes all of the teens did make a really simple website some form or the other and got hands on experience using both HTML and CSS. I made them use Sublime Text instead of the crappy Notepad and asked them to invest time in a good text editor if they are going to continue web development or any other programming.

I made the presentations using Prezi so I’ve attached both of them below if it helps anyone else plan a similar session :) It’s free to use!

HTML 101

CSS 101