Web Designing: Malay Mehta Presents

Malay Mehta Presents:
WEB DESIGNING
INTRODUCTION
 What is web-designing?
Web-designing = website + designing
 What is website?
Website means an advertise given in electronic
media which shows the information or
importance about a company, an institute or an
organization.
A website requires
 Web-space from a server
 Domain name from registrars
 Appropriate plan and coding by designer
BASIC TERMINOLOGY
 HTML: HYPER TEXT MARKUP LANGUAGE
 HTML is not a programming language but it is a MARK-UP
language using which the coding of website is done.
 WEB ADDRESS: it is the address of website using
which we call the website.
 For ex. If we want to call website google.com than we write:
http://www.google.com
 http stand for HYPER TEXT TRANSFER PROTOCOL
 www stands for WORLD WIDE WEB
 Google is a domain name which is converted into web
address and call the website www.google.com
 .com is an extension. there are many other extension like
.net, .org, .biz, .edu.
BASIC TERMINOLOGY
 WEB BROWSER: the software used for browse
and open the website is known as web-browser.
For ex.
Internet explorer
Mozilla Firefox
Opera
Google chrome
 A web browser consist of different bars.
Title bar
Menu bar
Tool bar
Address bar
Status bar
WEB BROWSER The bar which shows the name of browser
& website is known as TITLE bar
The bar which shows different

menus like, File, Edit is known as
MENU bar
The bar which shows identical

commands in terms of picture or
icon is known as TOOL bar
The bar in which we write the

name of website is known as
ADDRESS bar
The bar which shows the status or

current condition of website is known
as STATUS bar.
BASIC TERMINOLOGY
 HTML editor:
The software used for making websites
using languages like HTML is known as
HTML editor.
For example:
 Notepad
 Publisher
 Front page
 Dream waver
BASIC FORMAT OF HTML
<html>
<head>
<title>
</title> The TAGs written between
<HTML> and </HTML>
</head> defines webpage.
<body>
</body>
</html>
BASIC FORMAT OF HTML
 The text written between < and> is known as TAG.
 TAG can be of two types:
 Opening tag: <TEXT>
 Closing tag: </TEXT>
 HEAD TAGs: the TAGs defined between <head>
and </head> known as HEAD TAGs.
 TAGs related to the identities of website like, its name,
description or keywords are included into HEAD TAGs.
 BODY TAGs: the TAGs defined between <body>
and </body> is known as BODY TAGs.
 TAGs related to appearance of website and color inside
the website are included into BODY TAGs.
HTML TAGs
 <title>: Title TAG.
It is used to give title to our webpage.
It is defined in HEAD part.
We specify the title between <title> and </title>.
For ex.
<title> GOVT. ENGINEERING COLLAGE, BHAVNAGAR </title>
 : Paragraph TAG.
It is used to write a paragraph in webpage.
It is defined in BODY part.
We write the paragraph between and .
HTML TAGs
 <hn>(n= 1,2…6): Heading TAG.
It is used to give headings of different size.
It is the only element which is given by numbers.
h1 is max. size and h6 is min. size for heading.
This TAG is used in BODY part only.
We write heading between <hn> and </hn>
 : Line break
It is used to break the current line and start a
new line.
It is a singular TAG, is not used.
HTML TAGs
 <hr>: Horizontal rule.
It is used draw a horizontal line and break the
page.
hr TAG has attributes unlike br TAG.
It has three properties:
 Height: used to set the thickness.
 Width: used to set its length.
 Color: used to set line’s color.
It is defined in BODY part.
It is a singular TAG, </hr> is not used. For ex.
<hr height=“10” width=“100%” color=“blue”>
EXAMPLE 1
<html>
<head>
<title> WELCOME TO GOVT. ENGINEERING COLLAGE,
BHAVNAGAR. </title>
</head>
<body>
<hr>
<h1> WEB DESIGNING </h1>
<hr height=“10” width=“75%” color=“red”>

Web designing is very interesting. 
All students are enjoying the session of web designing. 

<hr>
</body>
</html>
EXAMPLE 1
HTML formatting TAGs
In HTML, the TAGs which are used to change way of
writing the text are known as formatting TAGs.
 /: bold/strong TAG
This TAG is/are used to make the write-up BOLD.
 : underline TAG
This TAG is used to write underlined text.
 : italic TAG
This tag is used to make text italic.
 To use any of these three TAGs we have to give our
content between opening and closing TAGs. For ex.
 internet will give output:
internet
 : font TAG
This TAG is used to present the text in our
content more attractively.
It has three properties:
 Color:
 It is used to change the color of text
 To specify the color either we use name of color or
we use the code for that color
 The code for any color is of 7 characters:
#_ _ _ _ _ _
Percentage of Red Green Blue

 Size:
 This property is used to increase or decrease the
size of text.
 To increase the size we have to use ‘+’ sign and to
decrease the size we have to use ‘-’ sign.
 Face:
 This property is used to write the text in different
types of fonts. For ex.
 Arial
 Verdana
 Times new roman
 Courier new
EXAMPLE 2
<html>
<head>
<title> WELCOME TO GOVT. ENGINEERING COLLAGE,
BHAVNAGAR.</title>
</head>
<body bgcolor=“pink">
<hr color="orange">
<h1> WEB DESIGNING </h1>
<hr height="10" width="50%" color="white">


 india is my contry 
 i love 
 my 
 india 

<hr color="green">
</body>
</html>
EXAMPLE 2
EXAMPLE 2
 : Superscript Tag.
It is used to display text with superscript. For
example, today’s date: 16th October.
Date: 16th October
 : Subscript Tag.
It is used to display text with superscript. For
example, chemical formula for water: H2O
Chemical formula of water:
H2O
LIST
 There are three types of lists frequently
used in HTML
Ordered list
○ In this type of list we give numbering to the
elements of list. For ex. 1,2,3… A,B,C… a,b,c…
Unordered list
○ In this type of list we give symbols instead of
numbers to the element of list. For ex. ●,▪,○…
Definition list
○ In this type of list we specify a word as TITLE and
it is defined in the DEFINITION part.
EXAMPLE 3
 Example_list.txt
 list.html
INSERT IMAGE IN WEBPAGE
 <image>: Image Tag
It is used to show image in webpage.
Attributes:
- Src : source
- Align : alignment: left, right, top, bottom, middle.
- Width
- Height
- Border : thickness of border in pixel
- Alt : Alternate name/Information to be displayed while loading the
page.
For ex.
 <image src=“image/rose.jpg” align=“center” width=“400”
height=“350” border=“3” alt=“rose”>
<body background=“image/t2.jpg”>
CREATE TABLE
 <table>: Table Tag
It is used to create table in the webpage.
It is distributed in three parts
- Table header <th> </th>
- Table row <tr> </tr>
- Table data <td> </td>
Attributes of table tag:
- Align: alignment: left, right, center
- Border : thickness in pixels
- Cell padding: in pixels
- Cell spacing: in pixels
- Width
EXAMPLE 4
 TABLE1.html
 TABLE.html
CREAT A HYPERLINK
 To create a website containing more
than one pages we have to use
Hyperlink to interconnect them.
 There are two types of links:
Internal links: the hyperlink is within the
webpage.
External links: the hyperlink is outside the
webpage.
 Link is also known as Anchor.
CREAT A HYPERLINK
 <a>: Anchor Tag
Syntax for External link:
<a href=“Location Address”> Caller </a>
Syntax for internal link:
<a name=“Lname”> Target </a>
<a href=“Location Address#Lname”> Caller
</a>
EXAMPLE 5
 link.html
 Summery Example:
my first website
SPECIAL THANKS TO :
MR. HALAK RAVAL
(MY TEACHER)
PREPARED BY:
MR. MALAY MEHTA

Web Designing: Malay Mehta Presents

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Web Designing: Malay Mehta Presents

Uploaded by

Copyright:

Available Formats

Malay Mehta Presents:

The bar which shows different

The bar which shows identical

The bar in which we write the

The bar which shows the status or

<hr height=“10” width=“75%” color=“red”>

Percentage of Red Green Blue

You might also like