INTRODUCTION TO HTML

Tuesday, 12th March 2019

HTML

The first thing you must know about HyperText markup language (HTML)

 

INTRODUCTION TO HTML

HTML (Hyper Text Markup Language) is a language for specifying how text and graphics appear on a web page.

When you visit a web site (e.g., www.worldtok.com), your web browser retrieves the HTML web page and renders it to a user readable format for you to view conveniently.

The HTML page is actually stored on the computer that is hosting the web site and the page is sent to your browser.

To see what HTML looks like go to your web browser and when you have opened a webpage and it has fully loaded right click on any part of the page and you will see an option “inspect” click on it and you will see exactly what HTML looks like.

Again if you are working on chrome, opera or Firefox, you can simply click ctl+u to view the HTML source of a webpage.

Two things to note before viewing an HTML source of a webpage:

1.   You must be using a laptop or desktop. (Windows, MAC OS, and or LINUX )

2.   The webpage must have been fully loaded before the source code will be read

 

IDENTIFYING HTML

 

HTML is a textual language that includes special markup tags such as:

…,  …, 

The tag specifies a title for the web page

HTML code is stored in a simple text file that has either a (.htm) or a (.html) filename extension

(e.g., index.html):

Hint: Always use (.html and not .htm), see details at StackOverflow

 

HOW TO WRITE YOUR FIRST WEB PAGE IN HTML

 

Things you must have before you can start writing HTML on your pc

A simple text editor such as notepad, sublime, notepad++. Etc.

Web development tool: Use a web editor tool Jetbrains Webstorm, GitHub Atom etc. To create more professional looking HTML documents. These recommended web development tools come with syntax highlighting and autocorrecting which will be a great support to you as you code.

P.s: Consider starting with a text editor like notepad so that will first master the syntax before using professional software. This will make you master the code and the syntax beforehand.

Once you are done with the document kindly save it and remember to select file extensions as (.html). Save it in your desktop and right-click on it and choose open with chrome or any other browser you have installed on your system.

When next you want to edit or modify it just right click on it and choose open with your desired text editor such as notepad.

Some HTML tag you need to know before you start

HTML title

A title is usually displayed on the top bar of a web browser’s window when you visit a web site.

The title will now be displayed in the main web browser window, just on the top bar.

Example of a title HTML tag:

Pay close attention to how the opening and closing tag goes. Each tag in HTML starts with a less than symbol (<) and after you have written the name of the tag,

close it with greater than symbol and just after the first enclosure put your text and as well following the same opening step but now after the first less than symbol (<) kindly insert a forward slash (/) and this will indicate that you are closing the tag.

Don’t worry how you are going to be able to master all this just pay close attention to examples and as well practice each example and within a short period of time, you will master everything about web development and design.

is the end tag.

HTML Headings

HTML allows you to create sections in a document using headings, there are six levels of headings the first level creates the most significant heading, e.g.,

 

This is a major section

 

And the sixth level creates the least significant heading, e.g.,

 

This is a minor section

 

After each heading, you insert the text and images that pertain to that section.

 

HTML PARAGRAPHS

 

The <p> tag is used to start a paragraph.

The </p> tag is used to end a paragraph.

 The text between the two tags is your paragraph and that is what the browser will render for you

example

<p>Iam a paragraph</p>

The closing tag may sometimes be forgetton and the webpage will still render corectly but some browsers will give you error and format your webpage disorderly

 

 

Note: Things may not always work out as default so it is strongly recommended that you close every HTML tag in your web page.

HTML LINE BREAK

You can force a line break using the <br>
tag

HTML TEXT FORMATTING

Italics: renders text in italics form.

Bold: renders text in the bold format.

italics and bold: this will produce italics bold text.

Html tags are numerous but with the way we have packaged this tutorial, you will be able to grasp it perfectly without having to think that it is hard.

Now that you have gotten the introduction to HTML our next topic will take you through the major getting started steps in mastering HTML.

Leave a Reply

RELATED POSTS


Total of 0 Comment