My first after-school Code-a-thon

The beautiful blogs poster, as made skillfully by Sian, one of my digital leaders.

The beautiful blogs poster, as made skillfully by Sian, one of my digital leaders.

So, I know I’ve been writing for a while, but this is something that I have had a passion for and looking for an outlet. The school I currently work at busses the students in, which makes extra curricular a real challenge. usually we have to run any kind of extra curricular club in lunchtime which does limit the way we work and also the need for giving students the chance for lunch.But I’ve finally cracked it and got 10 students to stay behind for an after school session, titled “Beautiful Blogging” and aiming to teach the skills of HTML and how blogs work. The aim to encourage students to program and learn a new outlet for the skills that we teach in the classroom.

Now, like most things, this isn’t an entirely original idea, I saw this at a Manchester Girl Geeks event with another teacher who ran it. I thought it was so brilliant I have kept it, revamped it and used it in my class. the results were good, I got girls and boys from 12 to 15 to learn some HTML skills using the Tumblr platform.


Estafety in schools is a massive issue and whenever there is talk of social networking sites (As tumblr generally is classed due to its links with facebook and twitter), you need to consider the information surrounding it.

When I approached the school they were reticent. You’re using a social media platform to teach? (fear and trepidation from the child protection officer). Writing a brief proposal of how I wanted to use the platform and also in the session think about E-safety issues (e.g. making sure the blog is not listed on google so you have to know the email to find them).

I also had to approach the technicians to allow the network to unblock Tumblr for a few hours so the students could get in. If you have access to Tumblr in school, great, if not you could also try Blogger, WordPress(duhh) or Edublogs.

I chose Tumblr for one simple reason, I wanted a platform that students were already keen on and using in order to gain the most appeal.  You can find the proposal that I submitted to the safeguarding officer, demonstrating the settings that I applied with the students here:

Beautiful Blogs SG Letter

The Session

Lasted for 1 hr 30 mins, with 11 students who signed up and seemed to go well (If I were doing this again, I could invite other schools, but I would need additional permissions and I’d need to be ‘dead-on’ with my delivery). The main issue I had involved getting the students signed up to the site. What I failed to take into account was that Tumblr makes sure you are 13 to sign up, so you have to make sure there is more than one option or try a different blog. You could, if you wanted, make dummy accounts for students below the age of 13 to try, but that would be illegal, so i wouldn’t endorse that at all.

When the students have signed up, the students alter the blog settings for e-safety (See above) and also that you alter the settings to allow for the students to write in RichText/HTML. (A word of warning, if they don’t activate the account using the email, HTML won’t work in the blog, weird!)

Introducing the session students were also introduced into the topic of blogging. Through the demonstration of blogs that I know students in the past have set up and discussion of what people write about, students had an idea about what to write. The initial discussion was to create an “about me” page (also thinking about e-safety) with things that the students are passionate about, in order for them to decide on their first post.

Using the following worksheet (BBSample), the students were able to think about the different tags they could use to make the page more effective.  The kids got a real kick out of the work, most had a smattering of HTML, so in an hour and a half I talked about what to write a blog about and also putting some funky HTML into a blog you couldn’t do without using code (E.g. marquee’s and funky CSS borders).

The students really saw the value in this as they could not of done this with a standard Tumblr blog, this meant that they could do things at home that other students couldn’t! (everyone loves showing off!)

Were to go next

I planned this session as one of 3. Which means that the second session would probably feature more CSS then the final session on how to change the site to alter the theme and make it more attractive.

Not sure what people’s thoughts are but I think that this could easily be applied to other schools and through the general excitement that the social network produced in order to teach HTML, I think this could be a new (different) way of applying HTML in the classroom. The larger scale of this (rolling it out in a standard classroom session) would probably be open to more abuse, but as a follow up to an existing classroom activity in HTML it can have a real benefit to ICT and computing as a subject.

*Mr Gristwood did not write any HTML in the making of this blog (unfortunately)

(Adendum) Pedagogical Approach

As students were entering the class at differing levels of expertise the resources had to be planned for differentiation. The worksheet allowed for the differentiation of the class with beginner(left hand side), intermediate (right hand side) and advanced (back of the sheet).

The idea of using different pedagogical styles:

  • Visual – here is a worksheet, this is what you can achieve (powerpoint)
  • Audio – here are some visual tutorial foudn online of how to code HTML
  • Kinesthetic –  lets do something fun and interactive

I have found recently with using tools like notepad, students enjoy the experience of programming, refreshing the page and seeing what they have learned. This does have it’s drawbacks, so when approaching this task i wanted to use an online tool that would show instantanious response (if they had done this correctly), so tumblr engages students with the effect of showing what they have learned instantly, in a piece of software that has real life application for them. This also meant if they made mistakes they can see the response qucikly.

Teaching HTML in previous classes has shown that studnets want to get working fast, so by getting students t produce something quickly that they can see, then refining that product to make it more interactive and fun has worked well in this example. Providing sutdents with additonal research allows us to plan for progression and challenge them beyond the taught task.

Students generally have to be taught a way of working with HTML in that they have to learn to develop a base product and then refine quickly checking each step along they way. This also aids them in a future career in computing where one of the more popular ways of working is Test Driven Design, which is widely adopted as being good working practice within industy, and also version control which allows them to work togheter online on the same blog, with version control showing the development of the product.

During the class I was also chatting with a numebr of students that had their own web projects outside of the classroom, this allowed me also to aid in their development beyond the curriculum.

What I have seen in the last 3 years due to the advent of courses like this and support in student’s learning beyond the classroom is the general shift for students to take more computing in the school. Through this level of nurture and support, Computing numbers are rising within the school and the keen-ness and enthusiasm for a subject which (in this school) is an option and competing with other subjects which are more established in the curriculum.


Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s