What is web page designing?

Introduction to web page

What is web page designing? How to start web page designing? When we visit the internet, we can see and scroll the pages which are called webpages. Every new screen you see is a new webpage. A webpage can include text, graphics, animation, video, sound. A webpage contains different information about particular. The first webpage was created by Tim Berner-Lee and put online on August 6, 1991.

“A webpage is a document commonly written in HTML (Hypertext Markup Language) that is accessible through the Internet using different web browsers.”

The collection of web pages is called a website. A website can have one webpage or thousands of pages or millions of pages depending on the website.

What is web page designing?

Web page designing is the process of creating and publishing simply too complex pages with hypertext so that such a page can be viewed and shared by every user on the web. As the user of the Internet in the World Wide Web (WWW) has been expanding and growing every day. Information sharing is becoming a regular process through websites. Therefore, web page design is very important these days. There are several web pages designing software. Some of them are: HTML, CSS, JavaScript, PHP, ASP.Net etc.

Types of web pages.

There are two types of web pages in general. They are static webpage and dynamic web pages. Static web pages show to same content each time are viewed whereas dynamic web pages have content that can change each time they are accessed. The dynamic pages are typically written in programming languages such as PHP, ASP, JavaScript, etc.

What is HTML?

HTML is a Hypertext Markup Language. It is a markup language which is a set of markup tags that are used to create web pages. HTML was developed by Tim Berners Lee of Switzerland in 1990.
Features of HTML
• HTML is easy and simple to use.
• HTML supports, controls, and navigates to read along with documents easily.
• HTML is supported by different text editors like notepad, notepad, subline, brackets, atom, visual basic, etc.
• HTML documents can execute in different web browsers such as Google Chrome, Mozilla Firefox, Internet Explorer, Safari, Opera mini, etc.
• HTML supports different hyperlinks and image formats.

Basic Structure of HTML

The structure of HTML contains mainly two sections: <body> and <head>. The <head> contents title and other general information about the page. The <title> tag defines the title of a page in the title bar. <body> contains the matter that should be displayed on the page. Moreover, the comment is written anywhere in the HTML file and the tag <! –> is used for comments. Comments have no effects on HTML codes.

Basic Structure of HTML

<!DOCTYPE html>
<html>
<head>
<title> Web page designing</title>
</head>
<body>
This is my first webpage
</body>
</html>

What are HTML tags?

HTML tags are all the keyboards or commands used in HTML. They are surrounded bye angle brackets like <html>, <body>, <head>, <title>, etc. The tags tell the browser how to display document in the webpages. The HTML tags normally are in pairs like <h1> and </h1>.

Types of HTML Tags

Basically, there are categorized two types of tags in the HTML

a) Container tags (Paired tag)

A container tag is such a type of tag which has its related ending tag with start tag. Start tags are written within angular brackets and the end tags are written within angular brackets with a slash (/) in front. The text and other tags are written between the start tags and end tags. The starting tag activates the effect and the closing tag turns off the effect. Some examples of container tags are :<html>, <head>, <title>, <body>, <h1>, <b>,<i>, <u>, <p>, etc.
The basic structure of the paired tag is as follows:

<title> This is a webpage title</title>

⇑⇑⇑ ⇑⇑⇑

[Start Tag] [Markup Text] [End Tag]

<p> This is a paragraph I am container tag </P>

⇑⇑⇑ ⇑⇑⇑

[Start Tag] [Markup Text] [End Tag]

b) Empty tags (singular tag)

The tag which has no ending tags is called empty tags. They are called standalone or singular tags. Some examples of empty tags are <img>,<br>, <hr> etc.
The basic structure of a singular tag is as follows:

<imgsrc=”computer.jpg”>

Here <img> is an empty tag that does not have its ending tag.

HTML Attributes

The attributes are keywords and characters used to provide additional information to describe the HTML elements. They are always included in the start tag of the element with some value after the equal sign. Some of the common attributes are color, height, width, or the location of the linked file.
The basic structure of a tag with its attribute is as follows:
<tag _name attribute1 =”value” attribute2 =”value”>
For example, the tag for setting the background color red is shown below.

Here, the body is a tag, bgcolor is the attribute name and red is the attribute value.

Let us take another example,

<h1 align =”left”> This is biggest heading</h1>

Here, h1 is a tag with attribute align having the value “left”.

The tags with multiple attributes are given below.

For Example

<font align =”center” color =”green” size =”16”> My first page </font>

General rules for writing HTML tags and attributes

• space is not allowed in the beginning as well as in between the
tag name. For example <head>< head> both are incorrect.
• The value of the attribute may be written in the double quotes.
• The tags are not case sensitive, for example <head> and <HEAD>
gives the same meaning.
• The tags are surrounded by angle brackets like <html>
• The attribute values may be case-sensitive.
• The commas are not allowed between the attributes

HTML Basic Tags

<!DOCTYPE html>: The <!DOCTYPE> represents the document type and helps web browsers to display web pages correctly. It must only write once, at the top of the page (before any HTML tags).

<html>: This is the very first tag that informs the browser that the document is related to HTML. It marks the starting and end of the HTML document. All the other tags are contents of the webpage are contained within this tag.
Syntax:

<html>
All tags
</html>

<head>: This tag shows the starting of the head section and </head> shows the ending of the head. This tag is specially used to put some information about the HTML document.
Syntax:

<head>
<title> This is title of webpage</title>
</head>

<title>: This tag is used inside the head tag to keep the title of the document on the browser’s window.
Syntax:

<title>
How to make webpage
</title>

<body>: The<body> tag is used to include all the entire contents of HTML with in it.
Syntax:

<body>
HTML content goes here
</body>

Creating an HTML document or Web Page

We can create the HTML documents either by using plain text editors software like Notepad, Notepad++, subline, brackets, atom, visual studio or by using web designing software like Microsoft FrontPage or Macromedia Dreamweaver. The HTML file format has .html or the file extension. Here we will learn to create an HTML document using Notepad.
The steps to create an HTML document using a document using text editor Notepad are as follows.
Step 1: Open the Notepad.
(Click on the Start screen then, scroll left to get all installed applications to find Notepad click on the Notepad icon.)
Step 2: Type the HTML code using any text editor like Notepad.