Tutorial – How to build your own website using HTML and WordPress

I have published a set of workshop notes on Github called Build Your Own Website – A Beginner’s Guide, covering the basics of HTML and WordPress-driven websites. I gave the workshop at a recent Engineering Day event at thetrainline.com, where the audience was largely non-engineers from marketing/finance/HR etc., and it was interesting and useful to return to the first principles of HTML in ways accessible to novices.

One of the fun analogies I came up with that of a webpage structure being (a bit) like a snowman – with two main parts:

HTML snowman - head and body!

The reason for the focus on HTML in Part 1 of the workshop was that in my experience, website editors who do not understand HTML are quite restricted in the kinds of editing they can do and the decisions they take, whereas those with a decent grasp of at least the basics of HTML are able to fix basic formatting problems (such as result from the ‘Paste from MS Word’ nightmare).

Part 2 of the workshop covers the use of WordPress, and particularly how HTML is used by WordPress to build webpages. The idea here is to allow novices to get a website up and running rapidly, yet with the HTML skills to be able to help themselves when needed.

byow-Github

Having to return to first principles can be a useful exercise once in a while; too often we engineers can become so used to technical jargon and TLAs that we miss the benefit of a simple explanation. In this respect, I enjoyed taking HTML back to its simplest form; likewise with WordPress.

I intend the workshop notes on Github to be usable by a trainer to deliver the workshop without much further guidance, so I’d love to receive feedback.

Join the discussion...

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

WordPress.com Logo

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

Facebook photo

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

Connecting to %s

This site uses Akismet to reduce spam. Learn how your comment data is processed.