IVAN STANTON

Junior Web Developer

Learn HTML part 1.1: Hello World

Why learn HTML?

There are many reasons to learn how to use HTML and how to create a website.

Scope of this series

This series will include specifically what I know. I am particularly unskilled in Javascript (I know enough to get by, but I should learn more). Instead, I am specifically talking about HTML and CSS here.

Getting started

HTML is a markup language. That means it's a way to store documents. Compared to other markup languages (like those used by Microsoft Word), HTML has support for stylesheets(sets of rules used to determine the document's look) and scripts(like macros, but way better), and it's designed to be edited in a text editor. HTML is the official markup language of the Web.

HTML is made up of tags which consist of an opening tag, enclosed with < and >, and a closing tag enclosed with </ and >.

Every HTML document must include the following:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
  </body>
</html>

Let's break this down, shall we?

<!DOCTYPE html> tells the browser that this is an HTML file. It also enables the compatibility options in most browsers.

<html> and </html> determine where the document starts and ends.

<head> and </head> are the start and end of some information for web browsers about the page.

<meta charset="utf-8"> tells the browser what to do with special characters like emojis and the copyright symbol.

<body> and </body> determine the start and end of what's visible on the page. This is the most important section of a page.

Your first webpage

HTML consists of different tags determining the start and end of certain types of content. Let's start with the traditional first project, which begins with the template mentioned earlier:

<html>
  <head>
    <meta charset="utf-8">
  </head>
  <body>
  </body>
</html>

Now, add the following between the <body> tags:
<p>Hello, world!</p>

The <p> and </p> determine where a paragraph starts and ends. Paragraphs are automatically spaced. You can place any text within the paragraph.

Save your file and open it in a browser. You should see "Hello, world!".

I hope this article has been useful! Read the next one.