WEBSITE FOR SBK WOMEN’S UNIVERSITY (SUB

CAMPUS) KHUZDAR

FINAL YEAR PROJECT DOCUMENTATION

Khalida Misri Khan KF17/MCS-01 Group Leader

Bi Bi Ruqia KF17/MCS-02 Group Member

Hafsa Khan KF17/MCS-03 Group Member

SUPERVISOR

Rizwana Qayyum

Department of (CSE&S)

SARDAR BHADUR KHAN WOMEN’S UNEVERSITY (SUB-CAMPUS)

KHUZDAR

BATCH (2017-2018)
DEDICATION
We dedicate this project to Almighty Allah our creator, our strong pillar, our source of
inspiration, wisdom, knowledge and understanding. He has been the source of our
strength throughout this program and on His wings only we soared. To all those who are
having thirst for knowledge. For all those students who have decided to gain and spread
knowledge and have great love for the people and want to help and work for them to the
level they could do the best.

This project is dedicated to our beloved parents, brothers, sisters, well-wishers and
specially teachers whose love and guidance will always be the source of encouragement
in our whole life.

i
 ABSTRACT
This report is based on a website for the Sardar Bahadur Khan Women University
(Sub Campus) Khuzdar. A website on a Network enables employees, students and
visitors to get information and submit their reports anywhere. The main important feature
is the administrator that can communicate with federal/provincial authorities. In the
current era a Website plays a vital role in any organization because the manual work flow
had taken very longtime to accomplish and accord, this is the main cause to reduce the
time of any organization instead of manual work flow.

Launching a Website is essential to improve an organization's ability to provide

information and the source of communication to the employees, students and visitors who
can use this information simultaneously. A Website improves how we share data through
internet, by enhancing our "ability to give access to more Employees, students and
visitors about the activities of entire organization.

ii
 ACKNOWLEGEMENTS

We would like to thank all those who have helped us in the development of this project
‘Especially’ to

ALLAH ALMIGHTY for giving me the endurance to complete this project, no doubt HE
is THE Merciful and Kind.

We want to pay tribute to Ms. Rizwana Qayyum, the project Supervisor, for her
continued encouragement, help and support throughout, this project without which this
project would not have been possible.

We would like to thank to our Parents who have supported us at every step of life.

Finally, we would like to thank to the people who gave us all the good ideas and who
spent their time to validate our requirements and gave their feedback.

Thanks to all of you.

iii
 SARDAR BAHADUR KHAN WOMEN UNIVERSITY
(SUB CAMPUS)

KHUZDAR

Department of Computer Sciences

CERTIFICATE
This is to certify that the work presented in this project report/thesis Website for
SardarBahadur Khan Women University (Sub Campus)Khuzdar”is entirely written
by the following student’s themselves/himself/herself under the supervision of Miss
RizwanaQayyum

Nameof Student Roll No

KhalidaMisri Khan KF17/MCS-01 Group Leader

Bi BiRuqia KF17/MCS-02 Group Member
Hafsa Khan KF17/MCS-03 Group Member

This Project is submitted in partial fulfillment of the requirement for the award of
“Degree of Masters in Computer Sciences”

Sign Sign Sign

Project Supervisor External Examiner Head of

DepartmentDate:

iv
Contents

DEDICATION.............................................................................................................................. i

ABSTRACT ................................................................................................................................. ii

ACKNOWLEGEMENTS ......................................................................................................... iii

CERTIFICATE .......................................................................................................................... iv

LIST OF FIGURES .................................................................................................................. 10

CHAPTER 1 ..................................................................................................................................

INTRODUCTION.........................................................................................................................

Introduction and Background .....................................................................................................................1

Problem Statement ......................................................................................................................................2

Scope...........................................................................................................................................................2

Project Objectives .......................................................................................................................................3

CHAPTER 2 ..................................................................................................................................

LITERATUREREVIEW .............................................................................................................

Literature Review: ......................................................................................................................................5

PHP: ............................................................................................................................................................5

HTML5: ......................................................................................................................................................5

CSS3: ..........................................................................................................................................................6

Bootstrap: ....................................................................................................................................................6

Notepad++: .................................................................................................................................................7

Notepad++ features: ....................................................................................................................................7

WowSlider: .................................................................................................................................................8
Visual Light Box:........................................................................................................................................8

AdobePhotoshop: ........................................................................................................................................8

Adobe PhotoshopFeatures: .........................................................................................................................8

WAMPP:.....................................................................................................................................................9

CHAPTER 3 ..................................................................................................................................

METHEDOLOGY ........................................................................................................................

Methodology: ............................................................................................................................................11

Requirementgathering: ..............................................................................................................................12

Requirementanalysis: ................................................................................................................................12

Analysis Objectives: ....................................................................................................... 12

RequirementValidation: .................................................................................................. 13

Requirements Definition Document: .............................................................................. 13

Designing: .................................................................................................................................................13

Software process model: ...........................................................................................................................13

Spiral Development: .................................................................................................................................14

ObjectiveSetting: ......................................................................................................................................15

Risk Assessment And Reduction ..............................................................................................................15

Development AndValidation ....................................................................................................................15

Planning ....................................................................................................................................................15

Functional Requirements: .........................................................................................................................16

Tools: ........................................................................................................................................................16
CHAPTER 4 ..................................................................................................................................

IMPLEMENTATION ..................................................................................................................

Index page: ...................................................................................................................... 18

Topheader: ...................................................................................................................... 19

Header: ............................................................................................................................ 19

Menubar: ......................................................................................................................... 19

Slider: .............................................................................................................................. 20

QuickAccess: .................................................................................................................. 21

Welcome: ........................................................................................................................ 21

Bottom footer: ................................................................................................................. 22

Home Page: ..................................................................................................................... 23

Chancellor Message: ....................................................................................................... 24

Vice Chancellor Message:............................................................................................... 25

Director Message: ........................................................................................................... 26

MA Program: .................................................................................................................. 27

BS Program: .................................................................................................................... 28

Apply Online:.................................................................................................................. 29

Registration Form: .......................................................................................................... 29

BS Courses: ..................................................................................................................... 30

FACILITIES ...........................................................................................................................................31

Library: ........................................................................................................................... 31
 Hostel: ............................................................................................................................. 31

Day Care Center:............................................................................................................. 32

Transport: ........................................................................................................................ 32

Cafeteria: ......................................................................................................................... 32

Gallery: .....................................................................................................................................................33

Contact Us: ...............................................................................................................................................34

CHAPTURE 5 ...............................................................................................................................

TESTING .......................................................................................................................................

Verify the Application ..............................................................................................................................36

Open the XAMP ............................................................................................................. 36

Open the web based application ..................................................................................... 36

Checking the home page ................................................................................................. 36

Opening messages ........................................................................................................... 36

Programs ......................................................................................................................... 36

Apply Online ................................................................................................................... 37

Gallery............................................................................................................................. 37

Only for admin ................................................................................................................ 37

Testing conclusion .......................................................................................................... 37

CHAPTER 6 ..................................................................................................................................

END USER MANUAL .................................................................................................................

End User Manual ......................................................................................................................................37

Open XAMPP ............................................................................................................... 37

 Local host ........................................................................................................................ 37

Home Screen ................................................................................................................... 38

Messages ......................................................................................................................... 39

Online Registration ......................................................................................................... 39

Registration Form: .......................................................................................................... 40

Facilities .......................................................................................................................... 40

Courses:........................................................................................................................... 41

Scholarships: ................................................................................................................... 42

Need Base Scholarship: .................................................................................................. 42

Contact Us:...................................................................................................................... 42

Gallery: ........................................................................................................................... 43

CHAPTER 7 ..................................................................................................................................

CONCLUSION .............................................................................................................................

Conclusions:..............................................................................................................................................44

Future Plan ................................................................................................................................................44

References:................................................................................................................................................45
 LIST OF FIGURES

Figure 1 Flow Digram.......................................................................................................................................11

Figure 2 Spiral Model .......................................................................................................................................14

Figure 3 Index Page ..........................................................................................................................................18

Figure 4 Topheader ...........................................................................................................................................19

Figure 5 Header ................................................................................................................................................19

Figure 6 Menubar..............................................................................................................................................20

Figure 7 Slider ..................................................................................................................................................20

Figure 8 Quick Access ......................................................................................................................................21

Figure 9 Welcome .............................................................................................................................................21

Figure 10 Bottom Footer...................................................................................................................................22

Figure 11 Home Page .......................................................................................................................................23

Figure 12 Chancellor Message..........................................................................................................................24

Figure 13 Vice Chancellor Message .................................................................................................................25

Figure 14 Director Message ..............................................................................................................................26

Figure 15 MA Program .....................................................................................................................................27

Figure 16 BS Program ......................................................................................................................................28

Figure 17 BS Courses .......................................................................................................................................30

Figure 18 Library ..............................................................................................................................................31

Figure 19 Library ..............................................................................................................................................31

Figure 20 Day Care Center ...............................................................................................................................32

Figure 21 Transport ..........................................................................................................................................32

Figure 22 Cafeteria ..........................................................................................................................................32

Figure 23 Gallery ..............................................................................................................................................33

Figure 24 Contact Us ........................................................................................................................................34

Figure 25 Open XAMPP...................................................................................................................................37

Figure 26 Local host .........................................................................................................................................37

Figure 27 Home Screen ....................................................................................................................................38

Figure 28 Massage ............................................................................................................................................39

Figure 29 Online Registration...........................................................................................................................39

Figure 30 Registration Form .............................................................................................................................40

Figure 31 Facilities ...........................................................................................................................................40

Figure 32 Courses .............................................................................................................................................41

Figure 33 Scholarships......................................................................................................................................42

Figure 34 Contact Us ........................................................................................................................................42

Figure 35 Gallery .............................................................................................................................................43

 CHAPTER 1

INTRODUCTION
Chapter 1 Introduction

Introduction and Background:

The title of this project is “Website for SBK Women’s University (Sub-Campus)
Khuzdar”. The project gives an easy access to all stakeholders like students, faculties,
employees and general users from any location of the world to gain information
regarding Sardar Bahadur Khan Women University (Sub Campus) Khuzdar.

Sardar Bahadur Khan Women University (Sub- Campus) Khuzdar was established in
May 2017. It is affiliated with Sardar Bahadur Khan Women University Quetta.

The sub-campus is situated at Khuzdar Balochistan. Since it’s inspection, Sardar

Bahadur Khan Women University (Sub Campus) Khuzdar has progressed continuously
through obtaining good position in university results, the outstanding performance by
the students in Balochistan. All these achievements have made SBKWUK the premier
varsity in the Balochistan and country. What makes SBKWUK programs special is the
breadth of our curriculum, an impressive intellectual community of faculty and Scholars
heightened by visiting professors as well as constant participation by professional
faculty members. Our students are also exposed to eminent scholars from around the
world from prestigious institutions and leaders in their area of expertise.

The Sardar Bahadur Khan Women University (Sub Campus) Khuzdar is one of the
leading universities in Balochistan keeping the academic excellence.

The Sardar Bahadur Khan Women University (Sub Campus) Khuzdar does not have
any type of web or social collaboration of information sharing the authorities of Sardar
Bahadur Khan Women University (Sub Campus) Khuzdar wish to have website. And
we decide to build a website for online registration system for Sardar Bahadur Khan
Women University (Sub-Campus) Khuzdar as our final project. The main objective of
the website is to provide relevant and up to date information to various visitors. As it
observed that remote visitors of the Sardar Bahadur Khan Women University (Sub-
Campus) Khuzdar coming for taking information daily so it will be better to get

1
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 1 Introduction

information to any ever after gating information they will trouble to come at university
and deliver their problems. Therefore, the purpose of our project is to insure accuracy,
consistency, integrity and protection of identity and image of the Sardar Bahadur Khan
Women University (Sub Campus) Khuzdar by developing this website.

Problem Statement:

In the era of 21th century electronics communication such as website is more popular.
Through which any organization become global. Now this website contains all
information about the University as well as learning problems of the concern university.
The goal of project is to develop a website on which information notification circulation
available on this site. If a candidate need admission application so he, she visits to Sardar
Bahadur Khan Women University (Sub Campus) Khuzdar now that will be on this site
any one can download and submit their online admission form or search their results. The
all advertisements of Sardar Bahadur Khan Women University (Sub Campus) Khuzdar
will be declared and uploaded on this webpage.

Scope:

Keeping in view the experiences through which Sardar Bahadur Khan Women University
(Sub Campus) Khuzdar executes the matters in manual work causes the loss of time, due
to previous system. Delays have been noticed in announcement of results and further the
teachers/officials of the university were not conveyed up-to-date decisions,which
obviously affects the education system in the SBKWUK. Like-wise issues are being
overcome by lunching the website, and further the website creates an easy access for the
authorities of the institute to its assets like employees etc. The scope of this project is the
information about the university to facilitate faculty, staff students and to provide access
to the people outside the university about Sardar Bahadur Khan Women University (Sub
Campus) Khuzdar.

2
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 1 Introduction

Project Objectives:

To create a website for Sardar Bahadur Khan Women University (Sub Campus) Khuzdar.
To facilitate the access of detailed information about Sardar Bahadur Khan Women
University (Sub Campus) Khuzdar.

3
Sardar bahadur khan women’s university sub-campus khuzdar
 CHAPTER 2

LITERATUREREVIEW
Chapter 2 Literature Review

Literature Review:

Before starting our project, we collected necessary information and literature which
helped in the creation and implementation of Sardar Bahadur Khan Women University
(Sub Campus) Khuzdar website. We studied about different software and collected
information of them for developing of the said website. After deliberately discussion with
group members and advisors, decided to make the website by usingHTML, CSS,
Bootstrap, JavaScript, PhP,XMP Server (kindly add the names of the other software that
u people used for this project)

PHP:
PHP is the engine behind millions of dynamic web applications. Its broad feature set,
approachable syntax, and support for different operating systems and web servers have
made it an ideal language for both rapid web development and the methodical con‐
struction of complex systems.
One of the major reasons for PHP’s success as a web scripting language is its origins as a
tool to process HTML forms and create web pages. This makes PHP very web-friendly.
Additionally, it is eagerly promiscuous when it comes to external applications and li‐
braries. PHP can speak to a multitude of databases, and it knows numerous Internet
protocols. PHP also makes it simple to parse form data and make HTTP requests.[1]

HTML5:
HTML is the predominant markup language used to describe content, or data, on the
World Wide Web (another lesser-used markup language is XML). HTML5 is the latest
iteration of the HTML5 language and includes new features, improvements to existing
features, and JavaScript APIs.
That said, HTML5 is not a reformulation of previous versions of the language it includes
all valid elements from both HTML4 and XHTML 1.0. Furthermore, it’s
been designed with some principles in mind to ensure it works on just about every
platform, is compatible with older browsers, and handles errors gracefully. A summary of
the design principles that guided the creation of HTML5 can be found on the W3C’s

5
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 2 Literature Review

HTML Design Principles page.

First and foremost, HTML5 includes redefinitions of existing markup elements in addition to
new elements that allow web designers to be more expressive in describing the content of their
pages. Why litter your page with div elements when you can use article, section, header, footer,
and so on[2]

CSS3:
Cascading Style Sheets (CSS) use a separate language from HTML. CSS allows you to
apply consistent styling of elements across all pages on your site, so that all headings,
lists, and paragraphs look and act the same on every page of a site.[3]’

Bootstrap:
Bootstrap is a free and open source front end development framework for the creation of
websites and web apps. The Bootstrap framework is built on HTML,CSS, and JavaScript
(JS) to facilitate the development of responsive, mobile-first sites and apps.

The styling and presentation of your website is imperative, as it plays an important role in
creating a sublime user experience. Therefore, you need to acquire design skills, which
help you to create attractive websites. Add deadlines to the project where time is
imperative and you realize you have quite a task at hand. Several toolkits and frameworks
have come to the fore to ease and streamline the task of web designing but none comes
close to the open source framework, Bootstrap.[4]

JavaScript:
JavaScript is a prototype-based, multi-paradigm, dynamic language, supporting object-
oriented, imperative, and declarative (e.g. functional programming) styles. JavaScript was
developed by Brendan Eich, a developer at Netscape Communications
Corporation, in 1995. Its initial development was very rapid, and much of the criti‐ cism
leveled at JavaScript has cited the lack of planning foresight during its develop‐ ment.
However, Brendan Eich was not a dabbler: he had a solid foundation in computer
science, and incorporated remarkably sophisticated and prescient ideas into JavaScript.[5]

6
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 2 Literature Review

Notepad++:
The text editor that we will be using in the Computer Science labs for creating our Java
programs is called Notepad++ and is
freely available for the Windows operating system. If you plan to do work outside of the
labs, perhaps at home, you may like
to use the same software that we have available in the labs. This document describes how
to install and configure Notepad++ using the same settings available in the labs.

Notepad++ features:

Notepad++ supports several programming languages and natural languages.

General features include:

 Tabbed document interface

 Drag-and-drop
 Multiple clipboards (plug in required)
 Find and replace with regular expressions (including multi-line); over
multiple documents; and marking/summary of occurrences
 Square selection (to edit multiple lines at once )
 Text encoding formats such as ASCII, Unicode, UTF-8 and several UTF-
16encodings
 Works on Microsoft Windows, Unix and Classic Mac OS line ending
characters
 Split screen editing and synchronized scrolling
 Spell checker (requires spell)
 Data comparison
 Zooming (with Control/Command + Mouse wheel)

In Programming Notepad++ is one of the most popular source code editors in the world,
and supports syntax highlighting and code folding for over 50 programming, scripting,
and markup languages.[6]
7
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 2 Literature Review

Wow Slider:
A wow slide is an image slider and they’re all about the same, right? Not so fast. What
Are the main requirements for choosing any king of web components? Compatibility,
easy setup, higher performance, and nice look and feel. With Wow Slider we’ve tried to
create the perfect html slider that covers all these needs Notepad

Visual Light Box:

Visual LightBox is a free wizard app that helps you easily generate popup image galleries
with a terrific lightbox overlay effect, in a few clicks without writing a single line of
code. Just drag & drop your photos into Visual LightBox window, press "Publish" and
your own picture slideshow with beautiful lightbox effects will open in the browser
instantly! No java script, css, html coding, no image editing, just a click to get your
gallery ready, Responsive, mobile-ready, unobtrusive, search engine friendly, translated
to 31 languages.[7]

Adobe Photoshop:

Adobe Photoshop is the predominant photo editing and manipulation software on the
market. Its uses range from full featured editing of large batches of photos to creating
intricate digital paintings and drawings that mimic those done by hand.[8]

Adobe Photoshop Features:

Adobe Photoshop is hands down, the most popular program for creating and modifying
images for the web. This is true not only because Photoshop is available on a wide array
of platforms ranging from Mac to Windows to UNIX, but because after four generations
of development, Adobe Photoshop has the most intuitive user interface, the most
complete set of tools, and the largest number of reference books around. Photoshop

8
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 2 Literature Review

is only one tool in a good designer's arsenal. Other popular tools include Paint Shop Pro,
DeBabelizer, or LView Pro for Windows and GIF Converter or Graphics Converter for
Macintosh. Fractal Design, Aldus and HSC also put out some excellent programs.[8]

WAMPP:
Stands for Windows, Apache, MySQL, and PHP." WAMP is a variation of LAMP For
Windows systems and is often installed as a software bundle (Apache, MySQL, and PHP).
It is often used for web development and internal testing, but may also be used to serve
live websites.

The most important part of the WAMP package is Apache (or "Apache HTTP Server")
which is used run the web server within Windows. By running a local Apache web server
on a Windows machine, a web developer can test webpages in a web browser without
publishing them live on the Internet[9]

9
Sardar bahadur khan women’s university sub-campus khuzdar
 CHAPTER 3

METHEDOLOGY
 Chapter 3 Methodology

Methodology:

While developing any website there are some phases through which it accomplished
successfully. First the requirements are gathered analyzed then the Designing process
starts after that we start coding it and test it in “Testing process”. If any error occurs the
process will repeat from Designing.

Figure 1 Flow Digram

11
Sardar bahadur khan women’s university sub-campus khuzdar
 Chapter 3 Methodology

Requirement gathering:
There are many types of requirement gathering which are as follows.

 Group interview.
 Interview (Face to Face).
 Study of existing Systems.
 By prototyping.

In our project we gather requirements by implementing interview method.

We gathered requirement from Director and various administrative employees of the
university. They give us the following requirements.

 Information about all the departments.

 Information about the advertisement of various positions.
 Information About the institute.
 NEWS, Events of the university and about various activities.

Requirement analysis:
Software engineering task bridging the gap between system requirements engineering and
software design.
Provides software designer with a model of:
 System information
 function
 behavior
For web developing the requirements can be recorded with the web category form
multidimensional classification model.

Analysis Objectives:
 Identify customers’ needs.
 Evaluate system for feasibility.
 Perform economic and technical analysis.
 Allocate functions to system elements.

12
Sardar bahadur khan women’s university sub-campus khuzdar
 Chapter 3 Methodology

 Establish schedule and constraints.

 Create system definitions.
Requirement Validation:

 Correct?
 Consistent?
 Complete?
 Externally - all desired properties are present.
 Internally - no undefined dereferences.
 Each requirement describes something actually needed by the customer.
 Requirements are verifiable (testable)?
 Requirements are traceable.
Requirements Definition Document:

 General purpose of document.

 System background and objectives.
 Description of approach.
 Detailed characteristics of proposed system (data &functionality).
 Description of operating environment.

Designing:
The designing is one of the main process of website developing. In this phase we design
the requirements after analyzing, there are many tools for designing as follows:

Software process model:

A software process model is an abstract representation of a software process. Each

process model represents a process from a particular perspective, and thus provides only
partial information about that process. These generic models are not definitive
descriptions of software process. Rather, they are abstractions of the process that can be
used to explain different approaches to software development. You can think of them as
process frameworks that may be extended and adapted to create more specific software
13
Sardar bahadur khan women’s university sub-campus khuzdar
 Chapter 3 Methodology

Engineering processes. There is different software development model which are given
below.

1) The water fall model.

2) Spiral model.

3) Component based software engineering.

We have chosen spiral model for the development of the database application system.

Spiral Development:
The spiral model of the software process was originally proposed by Boehm (Boehm,
1988). Rather than represent the software process as a sequence of activities with some
backtracking from one activity to another, the process is represented as spiral. Each loop
in the spiral represents a phase of the software process. Thus, the inner most loops might
be concerned with system feasibility, the next loop with requirements definition, the next
loop with system design and so on. Each loop in the spiral is split into four sectors:

Figure 2 Spiral Model

14
Sardar bahadur khan women’s university sub-campus khuzdar
 Chapter 3 Methodology

Objective Setting:
Specific objectives for that phase of the project are defined. Constraints on the process
and the product are identified and a detailed management plan is drawn up. Project risks
are identified. Alternative strategies, depending on these risks, may be planned.

Risk Assessment and Reduction:

For each of the identified project risks, a detailed analysis is carried out. Steps are taken
to reduce the risk. For example, if there is a risk that the requirements are inappropriate, a
prototype system may be developed.

Development and Validation:

After risk evaluation, a development model for the system is chosen. For example, if user
interface risks are dominant, an appropriate development model might be evolutionary
prototyping. If safety risks are the main consideration, development based on formal
transformations may be the most appropriate and so on. The waterfall model may be the
most appropriate development model if the main identified risk is sub-system integration.

Planning:
The project is reviewed and a decision made whether to continue with a further loop of
the spiral. If it is decided to continue, plans are drawn up for the next plans of the project.
The main difference between the spiral model and other software process models is the
explicit recognition of risk in the spiral model. Informally, risk simply means something
that can go wrong. For example, if the intention is to use a new programming language, a
risk is that the available compilers are unreliable or do not produce sufficiently efficient
object code. Risk result is project problem such as schedule and cost overrun so risk
minimization is a very important project management activity. Risk management, an
essential part of project management, is covered.A cycle of the spiral begins by
elaborating objectives such as performance and functionality. Alternative ways of
achieving these objectives and the constraints imposed

15
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 3 Methodology

On each objective and sources of project risk are identified. The next step is to resolve
these risks by information-gathering activities such as more detailed analysis, prototyping
and simulation. Once risk have been assessed, some development is carried out, followed
by a planning activity for the next phase of the process.

Functional Requirements:
After analyzing the requirements by consulting with end users we concluded that the
system should contain the following features.

Tools:
o Adobe Photoshop
o Note pad++
o Visual light box
o Wow slider

16
Sardar bahadur khan women’s university sub-campus khuzdar
 CHAPTER 4

IMPLEMENTATION
Chapter 4 Implementation

Index page:

Figure 3 Index Page

18
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Top header:
In web page layout, header is the upper (top) part of the web page. Headers are often
referred to as «Site Menus» and positioned as a key element of navigation in the website
layout.

Figure 4Topheader

Header:
A website header sits at the top of each page and serves a few very important purposes.
This does more than provide a place for your logo; it is part of a consistent user
experience that all good websites share. The design of a header may differ from site to
site, but the core features that determine how a site is navigated and experienced remains
the same.

This section is usually consistent across all of the pages on the website, however, some
designs give the home page a slightly different header appearance in order to draw
attention to featured areas of the site.

Overall, a good header makes your website easier to navigate, establishes your brand, and
creates a consistent browsing experience throughout your website.

Figure 5 Header

Menu bar:
The menu bar is the part of a browser or application window, typically at the top left side,
that houses drop-down menus that allow the user to interact with the content or
application in various ways.

19
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

In Microsoft Word, for example, the "File" menu, for example, provides options to open
a file, create a new one, and save or print -- among others. The "Edit" menu allows the
user to perform such functions as copying and pasting, finding and replacing text.

Figure 6Menubar

Slider:
In web design terminology, the term Slider is used for a slideshow added into a web
page. There are many Word Press slider plugins available which allow you to create your
own sliders and add them to your home page, landing pages, posts, or anywhere you want

Using slideshows or sliders within web design is an effective method of highlighting

your portfolio projects. As the current trends dictates, they are typically found above the
fold on the homepage.

Figure 7 Slider

20
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Quick Access:
Quick Access Toolbar (QAT) is a small, customizable toolbar that exposes a set of Commands
that are specified by the application or selected by the user.

Figure 8 Quick Access

Welcome:

Figure 9 Welcome

21
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Bottom footer:
Bottom footer is at the bottom of every page, preferably in a slightly smaller font size
than the rest of the text.

Figure 10 Bottom Footer

22
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Home Page:
A home page is a webpage that serves as the starting point of website. It is the
default webpage that loads when you visit a web address that only contains a domain
name. For example, visiting http://techterms.com will display the Tech Terms home
page.
The home page is located in the root directory of a website. Most web server allows the home
page to have one of several different filenames. Examples include index.html,
index.htm, index.shtml, index. PHP, default. html, and home html. The default filename of
a website's home page can be customized on both Apache and IIS servers. Since
the home page file is loaded automatically from the root directory, the home page URL does
not need to include the file name.

Figure 11 Home Page

23
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Chancellor Message:
This page gives information written by Chancellor expressing his views related to the
university and its environment

Figure 12 Chancellor Message

24
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Vice Chancellor Message:

This page gives information written by Vice Chancellor expressing her views related to the
university and its environment.

Figure 13 Vice Chancellor Message

25
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Director Message:

It is a message where director motivates the women of Baluchistan to be motivated and

educated. Further he expresses that universities are the catalysts to change which
increases the rate of progress.

Figure 14 Director Message

26
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

MA Program:
It is detailed information of MA programs which provides information of year, fee structure,
documentation, and its eligibility.

Figure 15 MA Program

27
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

BS Program:
It is detailed information of MA programs which provides information of year, fee structure,
documentation, and its eligibility.

Figure 16BS Program

28
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Apply Online:
After selection a program you get complete information of course and its fee structure etc, for
online Registration click button given below

Figure -4.15 Apply Online

Registration Form:
Clicking apply online button you get an registration form which requires your data needed for
applying in university and finally submit it.

Figure -4.16 Registration Form

29
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

BS Courses:
It is the total information about the BS program, its semester wise subjects, total marks ,
and its credit hours etc

Figure 17BS Courses

30
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

FACILITIES

Library:

Figure 18Library

Hostel:

Figure 19Library

31
Sardar bahadur khan women’s university sub-campus khuzdar
 Chapter 4 Implementation

Day Care Center:

Figure 20Day Care Center

Transport:

Figure 21Transport

Cafeteria:

Figure 22 Cafeteria

32
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Gallery:
A Gallery is an image gallery that displays multiple images on one page,
alternating between them in a way that highlights one image at a time. The slideshow
gallery allows you to showcase your images by presenting them one at a time.
In this article, we will show you how to add a slideshow image gallery using the built-in
tools in your Website.com editor. We will also show you how to customize your
slideshow gallery so that it better fits your needs.

Figure 23Gallery

33
Sardar bahadur khan women’s university sub-campus khuzdar
Chapter 4 Implementation

Contact Us:

Figure 24Contact Us

Contacts are the key source to enable the visitors for queries and information about the
university either it is related to admissions, jobs, scholarships etc.

If got one)

Contact or what his question is about)

34
Sardar bahadur khan women’s university sub-campus khuzdar
 CHAPTURE 5

TESTING
Chapter 5 Testing

Test Cases

Tests have been performed throughout the implementation of the

application. When the tests have found an error, the problem was found and
resolved.

The following tests cases were done after the system was “completed”.

Verify the Application

Open the XAMP

It helps in opening the website on the browser offline and it opened precisely.

Open the web based application

The web will be opened as intended there are no bugs and glitches.

Checking the home page

Clicking on any of the home page opens properly as designed or instructed.

Opening messages
The message opened as it was given by VC and the director.

Programs
Opening the programs opened properly as designed giving options of MA/MSC/BS
& MCS
Then I selected one of the programs given above it informed me about the whole
course duration, fee structure, credit hours etc.

36

Sardar bahadur khan women’s university sub-campus khuzdar

Chapter 5 Testing

Apply Online
I clicked on the apply online button which opens into a registration form which
required my bio data needed for the registration, for true information eligible for
admission it submits successfully.

Gallery
The icons given to the quick access works better when I opened the gallery it
provided me pictures of past events etc.

Only for admin

When I clicked on the button (only for admin) it required password when entering it
successfully I got excess to it where I got all students record and I was able edit or
giving any kind of feedback to it.

Testing conclusion
Here I conclude that all of the web based application was found correct and
authentic.

37

Sardar bahadur khan women’s university sub-campus khuzdar

 CHAPTER 6

END USER MANUAL

Chapter 6 End User Manual

End User Manual

Open XAMPP

Before opening website first open XAMPP and start Apache & MySQL.

Figure 25Open XAMPP

Local host;
For opening our site search (localhost/infor/index.php) and enter on any browser.

Figure 26Local host

37

Sardar bahadur khan women’s university sub-campus khuzdar

Chapter 6 End User Manual

Home Screen
When you enter the website you get a home page where you can excess any
information related to the university given below.

Figure 27Home Screen

38

Sardar bahadur khan women’s university sub-campus khuzdar

Chapter 6 End User Manual

Messages:
When you click message icon on menu you can get (Voice Chancellor Message &
Director Message) where they share their views about university.

Figure 28Massage

Online Registration:
On a program page by clicking this you get complete information of course and its fee
structure etc, for online registration click button given below.

Figure 29Online Registration

39

Sardar bahadur khan women’s university sub-campus khuzdar

Chapter 6 End User Manual

Registration Form:
Clicking apply online button you get an application form which requires your data
needed for applying in university and finally submit it.

Figure 30Registration Form

Facilities:

Clicking facilities button you are informed about the facilities like library, transportation,
cafeteria, hostel etc.

Figure 31Facilities

40

Sardar bahadur khan women’s university sub-campus khuzdar

Chapter 6 End User Manual

Courses:

User can see the detailed information about courses as given below.

Figure 32Courses

41

Sardar bahadur khan women’s university sub-campus khuzdar

 Chapter 6 End User Manual

Scholarships:
It gives idea of applying for scholarships and its eligibility for students those can apply
for scholarships.

Figure 33Scholarships

Need Base Scholarship:

Contact Us:
For further information, you get a bar given below where you can leave a message and
you will be replied as soon as possible.

Figure 34Contact Us

42

Sardar bahadur khan women’s university sub-campus khuzdar

Chapter 6 End User Manual

Gallery:
User can see images of previous events, convocations, seminars, departments etc by
clicking icon given below.

Figure 35 Gallery

43

Sardar bahadur khan women’s university sub-campus khuzdar

 CHAPTER 7

CONCLUSION
 Chapter 7 Conclusion

Conclusions:

After we have completed the project it is concluded that the problem in the
existing system are overcome. Because this project assists the faculty members
and students to get knowledge about (Sardar Bahadur Khan Women
University (Sub-Campus) Khuzdar) by just searching the link on internet. We
used Php, Html, Css, Java Script, Note pad++, wow slider, Visual Light Box
for completion of ourproject.

The main purpose of this project is to encourage university activates and

educational opportunities by providing online information to remote visitors.

Future Plan:
The main purpose of a dynamic website is mechanization. A dynamic website
can operate more effectively, built more efficiently and is easier to maintain,
update and expand according to future necessaries and demands. It is much
simpler to build a template and a database than to build hundreds or thousands
of individual, static HTML webpages.

In future we have following plans to enhance the capability of our

website which are as under: -

 Commitments in Home page.

 Online fee submission facility.
 Online complain Box.
 Progress bar for each student.
 Online Lecture Sessions through video links.
A search bar in Home page.

44
Sardar bahadur khan women’s university sub-campus khuzdar
 Chapter 7 Conclusion

References:

[1] D. Sklar and A. Trachtenberg, PHP COOKBOOK, Third Edit. Gravenstein

Highway North, Sebastopol: O’Reilly Media, 2014.
[2] A. Goldstein, L. Lazaris, and E. Weyl, HTML5 & CSS THE REAL WORLD,
Second Edi. 48 Cambridge Street Collingwood VIC Australia 3066: SitePoint Pty.
Ltd, 2015.
[3] Jeremy Osborn, Jennifer Smith, and the AGI Training Team, Web Design with
HTML and CSS Digital Classroom. simultaneously in Canada: Wiley Publishing,
Inc., Indianapolis, Indiana, 2011.
[4] A. Ahenoy and U. Sissou, Learning Bootstrap. Livery Place 35 Livery Street
Birmingham B3 2PB, UK: Packt Publishing Ltd, 2014.
[5] E. Brown, Learning JavaScript, 3rd editio. 1005 Gravenstein Highway North
Sebastopol, CA 95472: O’Reilly Media, 2016.
[6] T. Compsci and T. Editor, “Notepad++ configuration instructions,” pp. 1–13.
[7] S. Me. GmbH, Modern Web Design & Development. Smashing Media GmbH,
Freiburg, Germany: SMASAHING MAGAZINE, 2011.
[8] R. Schwartz, Adobe Photoshop CC for Visual Communication. United States of
America: Peachpit Press, 2016.
[9] D. N. Meghanathan, “Developing a Web Application using XAMPP and PHP in a
Linux Virtual Machine Environment,” vol. project #, pp. 1–18, 2013.

45
Sardar bahadur khan women’s university sub-campus khuzdar