Lesson 1 - What even is a webpage?

Obviously the simple answer is the very thing you are looking at, but importantly what do we consider a ‘web page’? Well there is quite a lot of history to that, and I really suggest reading up on the birth of the web and all the great stuff Mr Berners-Lee has given the world - in fact today marks 30 years since the first HTTP communication happened. So let’s jump straight into…

HTML

This is the fundamental building blocks of a webpage, it is the ‘extension’ of the web if you like. Like a JPG is to images HTML is to websites. At it’s core it contains ‘tags’ which describe the structure and content of a webpage. Without HTML there is no webpage. When you load a page your browser will actually go off to where you have directed it (the url e.g. http://www.bbc.co.uk) and ask the computer at the other end to give back HTML. Your browser then downloads that HTML to your computer and ‘renders’ it by ‘parsing’ the text it finds. The text in HTML is written in a ‘tags’ or ‘markup’ and these ‘tags’ represent different things, like an img represents an image or a h2 represents a second order heading (i.e. not the biggest, that would be h1). This is going to be covered in much more detail going forward. The other thing your browser will do with the HTML is find ‘assets’ and these can range from files that you consume, like images, vides or sound, or things that ‘enrich’ the webpage which are ‘CSS’ and ‘Javascript’ - which your browser also knows what to do with.

CSS

So if HTML is the structure CSS is the painting and decorating. It decides how things look, that img is going to be this big or that h2 is going to be this type of font. CSS can do so many different things, from deciding which fonts are used where all the way to drawing the Simpsons. Again much more detail will follow in coming posts.

Javascript

So we have the structure in HTML and the styles in CSS, what Javascript gives us is interactivity! It can make simple things come alive, it can make your webpage change as it goes and fetches data from other places, it can even make games! Javascript as a whole has come a really long way in recent years, and is a fully fledged software language in it’s own right. It originally started as a scripting language purely to make things work on webpages that didn’t fit inside the standard ‘HTML’ or ‘CSS’ models but has subsequently become a very fast and exciting language.

So what now?

Well the first thing to learn is the fundamentals. So Lesson 2 will focus on HTML and elements.

Written by Darren who lives and works in Oxford, being a wizard like Harry Potter ⚡. You should follow him on Twitter