HTML is a markup language that is used to create the structure and content of a webpage. By definition, HTML is not a programming language (but please don’t make a big deal when a newbie calls it a programming language. Just stay cool 😉)
You use HTML tags to put something on the webpage, such as the title, headings, paragraphs, and images.
Creating an HTML page
An HTML page can be created with any text or code editor application you have on your computer.
You can use free programs like TextPad, NotePad, or VSCode. You can even use terminal-based text editors like Vim or Nano.
Create a new document using your editor program and add the following HTML code to your document:
Save the file as
practice.html, and open the page on your favorite web browser.
You should see the following output generated in your browser:
You can see the parts of the HTML document being rendered on the browser.
Anything you put in the
<head> tag of the HTML document is used to inform the browser about the HTML document.
The content of the
<head> tag is also known as the document’s metadata.
<body> tag is where you place the page content. Anything you put there will be rendered on the browser’s main screen.
<body> tag is empty, a blank page will be rendered by the browser.
Even though you can create a button using the
<button> HTML tag, clicking the button does nothing.
This is because your button has no instructions on what to do when the button is clicked.
Add the following code to your
Save the HTML document, then refresh the browser.
When you click on the button, an alert box will appear as shown below:
onclick is added to the
<button> element. When you click on the button, the code you define inside the
onclick attribute will be executed as a response to the click action.
You can also use a
changeHeading() is defined inside the
<script> tag above.
onclick attribute is assigned with the call to the
It allows you to stream movies and chat with friends using web applications like Netflix, Amazon Prime, Facebook, Instagram, and literally any website you visit with your web browser.
Modern browsers you installed on your computer come with web developer tools.
One of these tools is the ability to view the source code of the page you are currently opening.
Here’s an example of inspecting the source of the Facebook landing page:
While they are used for different purposes, they work together to create a well-rounded and functional web application.
|Description||A programming language that runs on browsers||A markup language that gets rendered by browsers|
|Purpose||Adds dynamic interaction to a web page||Create a static structure and content of a web page|
|Support||Partial support depending on the browser version||Supported by all modern browsers|
By using both languages together, developers can create powerful and efficient web applications.