In this post we will look at the introduction to HTML. How to get started with HTML to make a simple and good web page.

Let's point out some of the key points we will be discussing in this post.

  • What is HTML
  • Prerequisites to learn HTML
  • HTML Elements
  • HTML Documents
  • HTML Page Structure
  • How To Save Html Files
  • HTML Code Editors

I will make sure this post is beginner friendly for the benefit of beginners, intermediate and professional in the field of web programming.

Beginners Programmer


So let us dive down to to why we are here

What is HTML ?

HTML stands for HyperText Markup Languge, it is a mark-up language that gives the structure of a webpage in a web browser. Web browers (like chrome, Firefox, internet explorer etc) receive html documents from webservers or local storage and it is rendered as multimedia in mobile or desktop devices. 

HTML is a mark-up language the browsers uses to present contents to the users like texts, links, images, videos etc. HTML is the basic components of all webpages. In order words, the first step to learning programming is understanding HTML and CSS. HTML is what every developer should learn because it's very useful in creating websites, web application and other applications.

Prerequisites to learn HTML

Nothing much really. As a beginner you need a functional system (PC) and get the needed software installed (code editors).

HTML Elements

HTML Elements are tags use for specific purpose in an html documents. HTML elements hold the contents viewed on a webpage in the fromtend (in some cases the contents may not be viewed from the frontend). This elements goes in this pattern

<opening tag> Content... </closing tag>

The illustration shown above are for elements with an opening and closing tags. For instance a paragraph element is written as <p> while the closing tag is written with a forward slash as </p>  whle there are tags without closing tags an example of them is <b> which specify a line break

HTML Documents

When writing your first line of code you should declare what kind of HTML document you are working with. It allow browsers to properly display your content on the web page. Currently we have HTML 5, and it is declared as 

<!DOCTYPE HTML>

This should be the first line of code to appear on your code editor. It is no case sensitive. Therefore it can also be written as; <!Doctype html> or <!doctype html>


HTML Page Structure

A basic and some HTML web structure should look like this

<!Doctype HTML>

<html>

 <head>

 <title>My website</title>

</head>

<body>

All contents are written in the body elements

</body>

</html>

All contents written between the body tags are visible on the frontend of the webpage.

How To Save Html Files

HTML files are saved using the extension .html. Create a folder and give it a name (can be name of your project). Open the folder and create a text file. Open the text file using any of your code editor. Press your save key Ctrl + S, to save then name the file as index.html them click on save.

HTML Code Editors

Code editors are softwares used by Developers to write codes and also execute commands. There are many code editors you can use to learn your coding successfully. I will list some of which I know go through them and pick the best of your choice. Although most developers recommend notpad for beginners even though it has very little features compared to other editors. 

List of code editors

  1. Notepad++
  2. Sublime (I recommend this for beginners)
  3. Visual Studio code
  4. Atom
  5. Bracket

If you need a tutor to guide you into the world of programming, contact +2348076839855 (WhatsApp number)