Web DesigningWeb Designing

By By

Bhupendra Ratha, LecturerBhupendra Ratha, LecturerSchool of Library & Information ScienceSchool of Library & Information Science

D.A.V.V., IndoreD.A.V.V., Indore

ContentsContents Introduction to Web Page Introduction to Web Page Web SiteWeb Site Types of Web siteTypes of Web site Why a Web Site for the Library?Why a Web Site for the Library? Web DesigningWeb Designing Characteristics of a Good Web SiteCharacteristics of a Good Web Site Basic Requirement for Web DesigningBasic Requirement for Web Designing Basic Element of a Library Web SiteBasic Element of a Library Web Site Steps for Web DesigningSteps for Web Designing Tips For the Web DesigningTips For the Web Designing Using the HTML for Web DesigningUsing the HTML for Web Designing

Introduction to Web PageIntroduction to Web Page

Web page is a collection of the data/information Web page is a collection of the data/information in various formate such as text, graphical, in various formate such as text, graphical, audio-visual etc.audio-visual etc.

A file of information formatted using HTML, A file of information formatted using HTML, which is almost accessible via HTTP on the which is almost accessible via HTTP on the internet that is sent by a web server in response internet that is sent by a web server in response to a web browser’s request is called web page.to a web browser’s request is called web page.

Web SiteWeb Site

Web site is a collection of Web pages or other digital Web site is a collection of Web pages or other digital assets. The home page is the first or top page of any assets. The home page is the first or top page of any web site. A site can be just one page or can be dozens web site. A site can be just one page or can be dozens or even hundreds of pages. or even hundreds of pages.

Underlined or highlighted Underlined or highlighted hyperlink hyperlink text is often text is often embedded in the home page. The hyperlink serve to embedded in the home page. The hyperlink serve to connect the top page with other pages throuout the connect the top page with other pages throuout the site.site.

Types of Web Site Types of Web Site

We can classified the types of web site in We can classified the types of web site in three grouping for the designing;three grouping for the designing;

1.1. Structural groupingStructural grouping

2.2. Functional groupingFunctional grouping

3.3. Visual groupingVisual grouping

Structural GroupingStructural Grouping

1.1. Tree/ outline structureTree/ outline structure

2.2. Linear structureLinear structure

3.3. Random structureRandom structure

Tree/ outline or HierarchicalTree/ outline or Hierarchical In tree/ outline structure information's are in In tree/ outline structure information's are in

hierarchical manner, moving from general hierarchical manner, moving from general information to more specific data.information to more specific data.

Home Page

Web PageWeb PageWeb PageWeb Page

Web Page Web Page

LinearLinear In linear structure, one page leads to next In linear structure, one page leads to next

page, which leads to the next one and so one.page, which leads to the next one and so one.

Home Page

Web Page

Web Page

Web Page

RandomRandom Random structure is really a lack of structure Random structure is really a lack of structure

in which pages are connected to one another in which pages are connected to one another seemingly at random.seemingly at random.

Home Page

Web PageWeb Page

Web Page Web Page

Web Page

Functional GroupingFunctional Grouping Functional grouping includeFunctional grouping include

– InformationalInformational– EntertainmentEntertainment– EducationalEducational– PersonalPersonal– BusinessBusiness

Visual GroupingVisual Grouping Visual grouping includeVisual grouping include

– Text oriented Text oriented – GUI styleGUI style– Pure staticPure static– Static with tabulation and descriptiveStatic with tabulation and descriptive– Audio-visual styleAudio-visual style

Why a Web Site for the Library?Why a Web Site for the Library? To present a visual display our library and their sections.To present a visual display our library and their sections. To correspondence through e-mail.To correspondence through e-mail. To provide chat referencing service.To provide chat referencing service. To use of Web OPAC.To use of Web OPAC. To display of information about the library, their functions To display of information about the library, their functions

and services.and services. To provide online library product and services.To provide online library product and services. To provide information and library services on the world To provide information and library services on the world

wide.wide.

Web DesigningWeb Designing Web designing is a systematic process of the Web designing is a systematic process of the

selection and coordination of available selection and coordination of available components to create the layout and structure of components to create the layout and structure of the web pages.the web pages.

Web design is a process of conceptualization, Web design is a process of conceptualization, planning, modeling, and execution of electronic planning, modeling, and execution of electronic media content delivery via Internet in the form of media content delivery via Internet in the form of technologies (such as markup languages) suitable technologies (such as markup languages) suitable for interpretation and display by a web browser.for interpretation and display by a web browser.

Characteristics of a Characteristics of a Good Web SiteGood Web Site

Well-organizedWell-organized Easy to navigateEasy to navigate AttractiveAttractive UsefulUseful Up-to-dateUp-to-date

Basic Requirement for Web DesigningBasic Requirement for Web Designing

A computer systemA computer system Collected data (Text, graphics, images, sound, Collected data (Text, graphics, images, sound,

videos etc).videos etc). Application and supporting software (PageMaker, Application and supporting software (PageMaker,

coral draw, notepad, adobe reader etc).coral draw, notepad, adobe reader etc). Knowledge about above software.Knowledge about above software. Knowledge about markup language (html or Java).Knowledge about markup language (html or Java).

Basic Elements of a Library Web SiteBasic Elements of a Library Web Site Web site addressWeb site address Heading or Title of the web siteHeading or Title of the web site Logo Logo About usAbout us SectionsSections PublicationsPublications ServicesServices Contact usContact us

For ExampleFor Example

Steps to a Well Designed Web SiteSteps to a Well Designed Web Site

Have a GoalHave a Goal Target AudienceTarget Audience Create a PlanCreate a Plan Select a Web Service ProviderSelect a Web Service Provider Testing and MeasurementTesting and Measurement Implementation of the WebImplementation of the Web

Tips for Website DesigningTips for Website Designing Before creating a website, a specific purpose and goal must Before creating a website, a specific purpose and goal must

be defined.be defined. Before creating a website, we must define the target Before creating a website, we must define the target

audience.audience. We should be observed the other web sites that related with We should be observed the other web sites that related with

similar purpose, field and subject.similar purpose, field and subject. Home page must be virtually attractive, informative & easy Home page must be virtually attractive, informative & easy

to navigate.to navigate. The site should be user- friendly with the interface and The site should be user- friendly with the interface and

navigation simple and reliable. navigation simple and reliable. Each page of a web site should be independent and also Each page of a web site should be independent and also

provide appropriate jumps from the page to page or resource provide appropriate jumps from the page to page or resource of interest by hyperlink.of interest by hyperlink.

Cont…Cont…

Attractive and appropriate colors should be used with the Attractive and appropriate colors should be used with the consulting background colors on each page according to consulting background colors on each page according to necessary.necessary.

Content of WebsiteContent of Website Clear navigationClear navigation Consistency in designConsistency in design