WEB DESIGNING

INTERNET

• The internet can be defined as a large network that connects other networks of computers
all around the world
• Example:
office or school building: all the computers linked within an office or school building.
It may be described as global network connecting millions of computers.
A network of networks of computers that links many different types of computers all over the world.
Uses of Internet
• It is place where you can talk to your friends and family around the world.
• It is place to do research for thesis or business presentation.
• Gather information with news, sports, weather and any current affairs around the world
with information updated daily, hourly or instantly.
• Listen to music and watch digital movies.
• Locate and download computer software and other products that are available in
cyberspace.
Internet services
E-mail (Electronic mail)
e-mail is a system for exchanging messages through a computer network.
How to use?
two ways to get an email account
• Install an email software on your computer and get an email address through internet
service provider.
• Set up a web mail account with one of the web site services such a gmail, yahoo etc.
ADVANTAGES
• Messages can be sent at any time of the day.
• Messages will be in the recipients mail box within minutes.
• Delivery of messages can be firmed.
• Messages can be read at the users convenience.
• Incoming messages can be saved.
• E-mail reduced the volume of paper that is to be processed.
• Copies can be sent automatically to everyone.
• Messages need not be read in full immediately.
DISADVANTAGES
• Recipients must also be electronic mail user.
• Until mail-box is checked there is no way of knowing that a message has arrived.
• The user must have computer, a modem and a phone line or mobile with data pack.
• Viruses.
• Spam: The definition of spam is unsolicited bulk messages, that is, messages sent to
multiple recipients who did not ask for them.
• Hacking: the act of breaking computer security is termed as hacking.

VOICE-MAIL
voice-mail also known as voice message is a computer based system that allows users and
subscribers to exchange personal voice messages.

TELNET OR REMOTE LOGIN

telnet is a computer based protocol which permits your computer to log onto another computer at
some other location and use it as if you were there eg: teamviewer, anydesk.
CHAT
Internet chat is a way for people to communicate live with each other by typing text messages which
are seen immediately. Eg: yahoo messenger/MSN messenger/whatsapp (audio or video).

NEWSGROUP
These are discussion groups on internet. They are used for free exchange of information.
Newsgroups are provided by special computers called news servers.

FTP (FILE TRANSFER PROTOCOL)

FTP is a standard internet protocol for transmitting files between computers on the internet over
TCP/IP connections. ( client-server)

E-COMMERCE
It stands for Electronic commerce. E-commerce means to carry out business dealings by internet.
eg: online banking, shopping etc.

GOPHER
It is a protocol (http)
A gopher on the internet is a system for users to search and retrieve network protocol.

Some terms related to WEB

WWW
• WWW is component of the internet that presents information in a graphical interface.
• The “world wide web” or www is a collection of online documents stored on servers around
the world that are connected to the internet.
• This is also called web or www or 3w.
• The collection of all web pages in all web sites on internet is called www.
• This web page provides us information in the form of text, pictures, audio and video formats
etc.

WEB PAGE:
A web page is a file of www, written in HTML which commonly includes text, graphics and links to
other documents on the web.

WEBSITE
A website is a collection of web pages.
It is able to display a wide variety of content such as text, graphics, images, multimedia, sounds,
animation and much more, linked either on a single or multiple topics.

WEB BROWSER
A web browser is a software application that enables a user to display and interact with HTML
documents hosted by the web servers.
Eg: Netscape navigator, Mozilla firefox, opera, google chrome, safari, mosaic, Microsoft internet
explorer.

HTTP (Hypertext Transfer Protocol)

• http is the set of rules for exchanging files (text, graphics, images, sound, video and other
multimedia files) on the world wide web
 • which defines how messages are formatted and transmitted and what actions web server
and browsers should take in response to various commands
• Example: http://yahoo.com means request is sent to the webserver

URL (UNIFORM RESOURCE LOCATOR)

It is also known as web address
This is a technical syntax for global identification of network retrievable documents. Eg:
http://google.com

SEARCH ENGINE
A web search engine is software code that is designed to search for information on the world wide
web.
eg: google.com, yahoo.com, bing, alatavista, ask, aol, etc.

Surfing on the internet:

The term surfing means user jumps from page to page on the internet searching for specific
information

DNS (Domain Name system)

• A name that identifies a computer or computers on the internet. Eg: sjpuc.com. This is
also called as host name.
• The product that domain name registrars provide to the their customers. These names are
called registered domain names.
• Names used for other purposes in the DNS. Eg: @ sign in the email address.
• An internet service that translates domain names into IP address, because the domain
names are alphabetic (198.105.232.4)

HTML (Hypertext Markup Language)

HTML IS NOT CASE SENSITIVE
• It is a simple text formatting language used to create hypertext documents.
• A hypertext document thus created can be viewed in a web browser.
• The following are the tools which will help us in the process of creating a HTML document.
1. Text editor: to create html code we require a text editor. Editors such as notepad, WordPad.
2. Web browser: the code created by an editor should be tested and executed. This operation
can be performed with the help of web browser
3. Graphics software: sometimes html document may include pictures. To get the pictures we
require graphic software.
4. Web server: the html document created on a system can be viewed only on a local server
where it is created. If the document is to be made available on the internet then we will
have to host it on a webserver.

HTML elements uses two types of tag element

1. Container tag
• A container tag includes a section of text, which specifies a formatting
construction for the selected text.
• A container tag always includes a start tag and an end tag.
• Eg: <body>……………………. </body>
2. Empty tag
• An empty tag represents a formatting option such as line breaks, paragraph setting and
so on.
HTML Document
• Every html document should contain certain standard html tags.
• Each document contains two sections i.e. Head section and Body section.
• The head section contains the title
• The body section contains the actual text that is made up of paragraphs, list and other
elements.
Advantages
• Html document browser interfaces are easy to build.
• It is easy to learn because it is very simple.
There are some specialized structures in html.

STRUCTURE OF HTML DOCUMENT

<HTML>
<HEAD>
<TITLE> SJPUC</TITLE> HEAD SECTION
</HEAD>

<BODY>
<H1> ST JOSEPHS PRE-UNIVERSITY COLLEGE </H1>
<H2> MUSEUM ROAD </H2> BODY SECTION
<H3> BANGALORE- 25 </H3>
</BODY>
</HTML>

BASIC TAGS OF HTML

• HTML : this element tells the browser that this elements defines the whole html document.
The element has a start tag <HTML> and an end tag </HTML>
• HEAD: this element identifies the first part of the HTML coded document which contains the
title.
start tag<head> and end tag</head>
• TITLE: this element contains the document title and will be displayed on the title bar of the
browser window. The title tag should be inside the head tag.
• BODY: it is the second part of html document. This element contains the contents of the
document displayed within the text area of the browser window.
HEADING TAG: html has 6 levels of headings that is H1, H2, H3, H4, H5, H6.
Where h1 is the largest and h6 is the smallest.
Example: <h1>computer science</h1>

PARAGRAPH TAGS
• Br – line break tag- <BR>
This element end a line. It contains only a opening tag and no end tag.
• <P> : paragraph tag
This element starts a new paragraph. The closing tag is optional because the browser understands
that when they encounter a <p> tag the previous paragraph has ended.

TEXT FORMATTING TAGS

• BIG: to display the text slightly bigger than the normal font
<big>………………………. </big>
• SMALL: to display the text slightly smaller than the normal font
<small>………………………. <small>
 • FONT: this tag is used to specify the font style, color and size of the text
Eg: <font face =“Ariel bold” size=“7” color=“red”> computer science</font>
• BOLD: this tag is used to display the data in a thicker and darker manner.
it is represented as <B> ………………. </B>
• ITALICS: this tag is used to display the data in italics
it is represented as <i>…………………………………. </i>
• UNDERLINE: this tag is used to display the data with an underline below it
it is represented as <u>…………………………………. </u>
• CENTER – this tag is used to display the data in the center of the line
it is represented as <center>………………………………….</center>
• MARQUEE- this tag helps to make the text scroll from one end of the document to
the other as required
<marquee direction=“right”>……………………….</marquee>
• BACKGROUND COLOR (BGCOLOR)
this tag is used to change the background color.
eg: <body text= “blue” bgcolor=“yellow” >
…………………………
………………………….
</body>

Lists: a list is used to display a collection of items in a particular form

Html supports 3 types of lists
1. Unnumbered lists: it is also called as bulleted list
<p> Life </p>
<UL>
<li> Forgiveness
<li> Love
<li>Humanity
<li> Respect
</ul>
OUTPUT:
Life
• Forgiveness
• Love
• Humanity
• Respect
2. Numbered lists: it is also called ordered list
<p> combinations at sjpuc </p>
<ol>
<li> PCMB
<li> PCMC
<li> PCME
<li> CEBA
</OL>
OUTPUT:
combinations at sjpuc
• PCMB
• PCMC
• PCME
• CEBA
 3. Definition list:
<DL> is a definition list
<DT> is used to alternate the definition term
<DD> is actual definition
The definitions are displayed on a new line and are also indented
Eg : <DL>
<DT> Science combination
<DD>PCMB PCMC PCME
<DT> Commerce combination
<DD>CEBA MEBA MSBA CSBA
<DT> Arts combination
<DD>HEPS
</DL>

OUTPUT:
Science combination
PCMB PCMC PCME
Commerce combination
CEBA MEBA MSBA CSBA
Arts combination
HEPS

LINKING:
the anchor tag <a> is used in html to link one page with another.
<a href=“filename.html”> subject </a>
<a href=“second.html”> profile of josephite</a>
href means html reference

IMAGES
Syntax: <img src=“image name”>
Example: <img src=“abc.bmp” height=“100” width=“50” align=“top”>
• Img stands for image
• Src stands for source.
• Only bmp, gif or jped format can be displayed on the webpage
• Image name is the URL of the image.
• If the image is in the hard disk then the complete path along with the file name should be
included.
• Height and width attribute are used to stretch or shrink.
• The align attribute is used to specify the position of the image(top, bottom, left, right,
center)