TutorialAICSIP

A best blog for CBSE Class IX to Class XII

Comprehensive notes HTML Basics Computer Applications class 10

Bytutorialaicsip

Jun 30, 2020

You are familiar with the web page in the previous chapter. HTML is used to develop the web page. Web pages created by HTML are static web pages. Static web pages contain text, hyperlinks, and images. So in this post, we will discuss the following:

Computer Applications - HTML Basics
Computer Applications – HTML Basics

What is HTML?

HTML is a markup language that helps to create the content of a web page using different commands.
  • H: H stands for Hyper, which means something which is active.
  • T: T stands for Text, command written with the help of alphabets, known as tags
  • M: M for markup, helps to render a portion enclosed in a specific tag
  • L: L for language, simple English language to identify the codes

Why HTML?

    1. HTML is needed to develop a web page or website.
    2. If you are looking for a career in web designing or web development in the future, HTML is the first step.
    3. To understands search engine and landing information.
    4. It helps to understand the scripting language, which is very important for web designers or web developers.
    5. It helps to create design templates and themes for different websites.

So now let’s talk about what are the requirements of HTML?

Requirements of HTML

For learning requirement you need to understand the following:

  • The structure of a page or document with its elements header, footer, document body, titles, margins, etc.
  • Formatting commands like fonts, bold, italics, underline, and so on.

For writing code and display results you need to understand the following:

  • Text editor: A software that is used to write the code. For example, Notepad, vim editor, notepad++, etc.
  • Web browser: A web browser is a program that is used to display the web page. It works as a platform for HTML that compiles your code and displays the output. For example google chrome, Mozilla Firefox, internet explorer, etc.

So for HTML, we will use notepad as a text editor and any chrome browser for the result display.

Start your HTML code
HTML Code

Writing HTML code

To write HTML code you need to have basic typing skills as well as windows navigation using a keyboard. As you will work on more than one window always while using HTML. At least three windows simultaneously:
  • Text editor
  • Browser
  • Folder window where you save your files

Remembers these short cut keys for quick navigation and helpful during writing HTML and viewing results.

  • Alt + Tab ↣ Navigate in different windows
  • Ctrl + S ↣ Save the file
  • F12 ↣ Save as
  • F5: Refresh the browser

So now to write HTML code you need to understand the structure of the HTML page.

Structure of HTML page

An HTML page structure has two main sections:
  • Head: Contains the information related to your page heading which is mostly not visible to users but useful for search web browser and WWW
  • Body: Contains the information or original contents to be displayed on your web page

An HTML page structure has few tags. These tags must be written for each and every page.

Basic tags of HTML structure

First, let me introduce what is a tag? A tag is an HTML command written in angular brackets. For ex. <HTML>…</HTML>. A tag is written with / is known as ending tag.
There are two types of HTML tag:
  • Container: A tag that contains starting as well as ending tag is known as a container tag.
  • Empty: A tag doesn’t have an ending tag with / mark is known as an empty tag.
There are four main tags used for HTML page structure:
  • HTML: Every page starts with <HTML> and ends with </HTML>. The entire HTML code must be written in between these two tags.
  • HEAD: It specifies the head or header of the page. Most part of this tag is not directly visible to the user. It plays an important role in a web page. It helps to divide the page, write different scripts, writing styles, and link different external documents for the HTML web page.
  • TITLE: It displays a page title on title bar the web browser and very important for the search engines to display information on WWW.
  • BODY: It is the main area of the page. Whatever you want to display on the page, you must write in this section.

Now be ready for your first HTML page is here with a single line output:

<HTML>
<HEAD>
<TITLE>
My First web page.
</TITLE>
</HEAD>
<body>
Welcome to HTML.
</body>
</HTML>
While writing code follow these important tips to avoid errors:
  • When you write a starting tag, immediately press enter and write ending tag as well if your tag is a container tag. Then write the required tags or code in between.
  • HTML is case insensitive language. It means that whether you write a tag in capital letters or small letters everything is accepted without error. You can check in my code, as I wrote a few HTML tags in the capital, few in small letters.
  • Whatever content you want in a specific block or under the tag that must be written in a proper sequence. Means if you write anything after </html> or </body> it has no meaning.

Type above code in notepad, don’t try to do copy paste as you are learning. Type the code. If possible try to give indentation for tags to write as blocks like this:

<html>
<head>
<title>Your Tile </title>>
</head>
<body>Your page contents
</body>
</html>

Saving HTML file

After completion of the above code typing, now it’s required to be saved. Follow these steps to save the file:
  • Click on File ➡️Save option. A save dialog box appears.
    Save file as html
    Save file as html
  • Don’t forget to write .html at the end of file.
  • Then click on the Save button.

Rendering your HTML File

Now go to the location where you save the HTML file. You will get a browser icon generally internet explorer with the file name. Double click to open and that’s it. You will get your output.
Now again if you want to write in your HTML file again, you need to open that file in the text editor.
  • Select the file.
  • Right-click on that
  • Select open with option
  • Choose notepad

Or open notepad and use open command. Select all files in all files option available next to the filename in the file open dialog box.

By tutorialaicsip

Related Post

Practical File Computer Applications Class 10 Comprehensive Guide

The complete guide – HTML Forms for CBSE class 10 Computer Applications

Inserting Images in HTML

Leave a Reply