🎄 Get 20% off from our HTML course for the holidays! 🎄
Introduction to HTML

Introduction to HTML

Ferenc Almasi • 2019 August 07 • Read time 3 min read
Get a goot introduction to html all the way from the beginning to more advanced tutorials. Lay your foundations from the ground up.
  • twitter
  • facebook
HTML

So you came here and wondering what all these shiny little words are doing on the screen in the picture above, scratching your head, trying to figure out what it all means? Well, to fully understand that and have a proper introduction to HTML, we have to step back a little bit and start from the ground.

First things first, what is HTML is even stands for? 🤔 That’s right, you probably already guessed it, it’s an acronym and it stands for HyperText Markup Language.

Thinking emoticon
Thinking emoticonly

But where does it come from? And how it came to be the thing it is today?

In order to get the full picture, let’s take a step back even further and go back in time, all the was back to the 1980s.

html in the 1980s

Everything started with a physicist called Tim Berners-Lee, who was a contractor at CERN at that time. He proposed a system for researchers there to use and share documents with. It was based on a concept of hypertext. Jumping forward 10 years, in 1990 he specified the HyperText Markup Language and although the project was funded, CERN not adopted it formally. However, only one year later the first publicly available description has been made and thus HTML was born. 🎉

fun fact: There was never a first version for it at all… the first version was actually called HTML 2.0

Now we are at the fifth version of HTML. It is now the standard markup language for creating websites and web applications. It describes the structure of a web page, and in the early times, it also described the appearance of the document.

So how does it work actually? — Well simplifying it, basically web browsers receives an HTML document from a server or from your local machine and renders them accordingly. Easy as that… But let’s get a little bit more deep into it.

An HTML document is made up of tiny little pieces of HTML elements which are called tags. We have opening and closing tags and we can format them like this: <html>

The closing tag follows the same format, only this time, we need to specify a slash after the less than sign, like so: </html>

There are also self closing tags, they are almost identical to the standard closing tags, expect we have the slash before the greater than sign, for example to display an image, we would have to write: <img />

There are of course certain words that should be between the less than and greater than signs, like <html> or <body> each one telling the browser how to render it. So you can’t just write anything in there, that would be outrageous right?

Now that’s cool and all, but you’re probably screaming, let me see an example document already! Which we are going to look into right in the next story. This is really just a short introduction to HTML.

I plan this to be a kind of series, so make sure to follow along đź‘‹


TOC

Did you find this page helpful?
📚 More Webtips
Frontend Course Dashboard
Master the Art of Frontend
  • check Access exclusive interactive lessons
  • check Unlimited access to hundreds of tutorials
  • check Remove ads to learn without distractions
Become a Pro

Recommended