# Writing HTML by Hand

Throughout the Webmaking 101 challenges you'll be writing a lot of code and you'll be doing it with your own fair hands. When you write your code ( instead of having software to do it for you) it is referred to as  "coding by hand". In this challenge you're going to take that phrase literally. To complete this challenge you'll need a sketchbook or paper, a pen and some means of taking a digital photograph.

Time:30 mins

## Task 1 - Hello World

This task is going to introduce you to writing a basic html document. But you'll do it on paper, using a pen, for fifteen minutes. Think of this challenge as the Webmaking 101 equivalent of [wax on, wax off][0](from the original Karate Kid film).

You're going to keep doing this until (hopefully) you can do it without making any mistakes and (ideally) by memory. It's important to be able to do this because this basic html document will form the basis for (almost) every html document you write in the future.

Below is the code that you're going to write out by hand. Be sure to copy it verbatim. Every quote, space, capitalisation and indentation is important. When you start writing more complex HTML & CSS you'll see why ;) You can be creative with your Hello World and include your name and a personal message.

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title> Hello World by Susie Creamcheese</title>
    </head>
    <body>
        <h1> Hello World by Susie Creamcheese</h1>
        <p>
            This code is written by hand. How awesome am I?
        </p>
    </body>
</html>

If you make a small mistake that's ok, but if you make a big mistake then start again. If you manage to get to the end without making a mistake in under fifteen minutes, then start again, but this time doing it from memory.

At the end of the fifteen minutes you should have got through a few pages or sheets of paper and have something that resembles the above code.


## Task 2 - Post It On Your Blog!

From all the glorious handwritten examples of beautiful html that you've created over the last fifteen minutes select your best effort. Take a photograph (or scan) of it, making sure that the code is legible so that others can read it. Now spend about ten minutes of time writing a blog post to accompany your photograph (or scan). You should include how many attempts it took for you to get to the end of the code. If you've found it frustrating mention that, but ask yourself why - is there anything you could do to alleviate this?

When you're done writing your blog post and it's published, post a link to it on the challenge discussion page. 

## Task 3 - Feedback To Your Peers

Spend the last five minutes of time looking for other peoples blog posts on the community wall for this challenge and leave comments for them. If you can find any errors in peoples work mention it to them, but do so in a way that you'd like people to do to you.


[0]: http://www.youtube.com/watch?v=3PycZtfns_U

# Badges

# Possible Badges:

## Webmaking 101 

HTML by hand Badge: 
Description: have completed challenge 2
Assessment type: self assessment
Rubric: N/A

## Peer


Description: The Helpful Feedback Badge recognizes the ability to provide helpful and interesting feedback while maintaining a respectful tone.
Assessment type: peer assessment
Assessment formula: accumulative needs a rating >3 from 1/3 of x active peers
Rubric:

/////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////
# Smartools optional



* A smartool is a tool that a learner can use again and again in other challenges.For example, Firebug (if Firebug was to be unlocked as a tool after completing challenge x) is a type of smartool. Smartools can also be user created, such as the collection of visual HTML references in Challenge 4. In unlocking smartools learners connect the skills they have gained to actual tools they can use and master.

================
Community Feedback
================

I know "Hello World" is pretty standard, but I think people remember things better if they see their names.  What about "HTML made by Susie Creamcheese?" +1, this is a good opportunity to let folks exercise a bit of creativity.

Tantek mentions in "HTML5 Now" that the shortest HTML5 compliant document is actually something like this:

  <!DOCTYPE html>
  <meta charset="utf-8">
  <title>HTML made by Susie Creamcheese</title>
  <h1>HTML made by Susie Creamcheese</h1>
  <p>This code is written by hand. How awesome am I?</p>

That said, perhaps it is useful to be more explicit about the <head> and <body> tags while teaching newcomers. OTOH, I personally love the brevity of the implicit version--it's short enough to tweet and easily memorize.