DESIGN AND IMPEMENTATION OF ELECTRICAL/ELECTRONICS DEPARTMENT WEBSITE
ABSTRACT
For a long time, the department of
Electrical/Electronic of this college has not had a website with
guaranteed continuity. Several students in past had made attempts to
achieve this but all to no avail. Eventually, with the implementation of
this project,the department now has a functional website.
The Website User Interface is designed
using the elements of HTML,CSS and Bootstrap, while the functionality is
done using PHP. The web application simply updates the database by
uploading a formatted CSV file through querying of MYSQL. The website
uses some special CSS features and jquery to achieve responsiveness. In
addition, the web application obtains useful information from the
commondata.
By the time it is fully implemented, it
would have solved several problems and created a brand new tool for the
Electrical department administration – Challenging student performance
and progress with the EEEtop-up in place, getting more enlightened in
the field through divers seminars presented in the past, seeing records
of alumni and those who had performances worthy of emulation, all at the
tap of a button.
CHAPTER ONE
INTRODUCTION
1.1 DEFINITION
Web design is the process of creating
websites. It encompasses several different aspects, including webpage
layout, content production and graphic design. While the terms web
design and web developments are often used interchangeably, web design
is technically a subset of the broader category of web development.
Websites are created using a markup language called HTML. Web designers
build webpages using HTML tags that define the content and metadata of
each page. The layout and appearance of the elements within a webpage
are typically defined using CSS, or cascading style sheets. Therefore,
most websites include a combination of HTML and CSS that defines how
each page will appear in a browser. Some web designers prefer to hand
code pages (typing HTML and CSS from scratch), while others use a
"WYSIWYG" editor like Adobe Dreamweaver. This type of editor provides a
visual interface for designing the webpage layout and the software
automatically generates the corresponding HTML and CSS code. Another
popular way to design websites is with a content management system like
WordPress or Joomla. These services provide different website templates
that can be used as a starting point for a new website. Webmasters can
then add content and customize the layout using a web-based interface.
While HTML and CSS are used to design the look and feel of a website,
images must be created separately. Therefore, graphic design may overlap
with web design, since graphic designers often create images for use on
the Web. Some graphics programs like Adobe Photoshop even include a
"Save for Web" option that provides an easy way to export images in a
format optimized for web publishing. [1]
1.2 TYPES OF WEBDESIGN
- Static website-small websites
- Basic Brochure website
- Advanced static website
- Dynamic website Design- large/complex websites
- Content Management System(CMS) websites
- eCommerce website
1.3 APPLICATION OF WEBDESIGN
1.3.1 Static Website Design - Small Websites
A static website is one without any
server-side functionality and has no database or interactive content.
Static web design is appropriate for smaller websites that don’t need
any complex features or content. Static websites can still be designed
to look really good with stylish graphics and content, they just can’t
do anything clever based upon any behind-the-scenes programming. The
advantage is that a static website is easier, faster and cheaper to
design and build but is still professional and stylish. [2]
1.3.2 Basic Brochure Website
For individuals and small businesses
with a low budget; a simple but professional website that acts as a
brochure or advert for you and your business. [2] Brochure websites can
have as few as one or two pages (usually five or six) and typically
follow a common format:
I. Home Page - an eye-catching introduction to your business with clear summary information about what you do
II. About / Philosophy - who you are, your credentials and your values
III. Your Services - one page for each different service you offer
IV. Contact - a contact form, address/telephone/email, location map
V. Links
1.3.3 Advanced Static Website
For small/medium businesses: static
websites can be enhanced with advanced web design features to make them
slick, stylish and interesting including: [2]
i. Drop-down navigation
ii. Animated jQuery (JavaScript) effects
iii. Flash content
iv. Multimedia (video/audio)
v. News page
vi. Social Network plugins
vii. Image gallery
1.3.4 Dynamic Website Design - Large/Complex Websites
Dynamic websites make use of server-side
programming and databases to store and deliver the content. This allows
web pages to perform more complex functions and display complex data
and interactive content. This is the standard way that larger websites
are designed as it makes adding large numbers of pages based upon the
same template very easy. The down side is that it requires more initial
work than a static website so it isn’t economical for small sites. [2]
1.3.5 Content Management System (CMS) Website
For a firm who want to make frequent
changes/updates or want full control over their website CMS is the ideal
design for them. A CMS can be part of just about any kind of website.
Depending on your needs this can be as simple as the ability to add new
items to a news page or image gallery, or full
what-you-see-is-what-you-get (WYSIWYG) control over the content of each
page. [2]
1.3.6 eCommerce Websites
For businesses that make money through
their website either by selling goods from an online shop or offering
premium (paid for) online services. This can range from simple
integration with PayPal to sell a small number of items in an online
shop where PayPal handles the entire checkout and stock-management
process to large, self-contained shops which securely process credit
card payments for hundreds of items. eCommerce websites are (almost)
always dynamic and database driven and usually have the provision for
the client to add new items and update prices, descriptions, images and
stock levels from a dedicated admin system. [2] Sometimes some of the
features of an eCommerce website will be integrated into a different
kind of website e.g. a
Band/Musician might have a website with
images, news and information about their music but also has the ability
to sell that music as a digital download.
1.4 SCOPE OF PROJECT
The software environment in which the application will be deployed will comprises of
i. Web server to host application
ii. Web browser (independent of OS) to access application
iii. Mobile application for android devices
The application will be hosted on a web
server. This is necessary because the administrative backend and the
detailed application will be based on PHP. The administrative end will
be accessed via a web browser on the PC. This will not be dependent on
the OS since it is web based. The student end will run on Android OS.
The hardware environment in which the application will be deployed will consists
- PC
- Mobile devices and Tablets
The human environment on which it will be deployed will comprises of
- Student
- Returning students
- Alumni
- Staff
- Lecturers
- HOD
- Admin
- Maintenance and application manager
- Developer
The updating and upload of data will be
done on PCs. The administrative end is intended to be assessed from a
PC. However, students who would like to see their information will be
able to do that on their phones or other mobile devices compatible.
1.5 AIM AND OBJECTIVES
1.5.1 AIM:
To design and implement a website for Electrical-Electronic Engineering Department.
1.5.2 OBJECTIVES:
1. To design a responsive Website that will be active and durable, unlike the previous sites.
2. To create and link Database of students both past and present.
3. To connect the department to the World Wide Web, hence giving room for ample development yet to be conceived.
4. To create a site where students can
have access to seminar materials, information from lecturers and past
questions of courses.
To host the Site with the domain name “EEEOOUIBOGUN”
1.6 JUSTIFICATION
Ease of accessibility as far as
technology is concerned, this in connection with stress-free
dissemination of information and notification between students of the
department and the staffs, and also a means of keeping the profile of
the alumni for reference and recognition. In addition to the
aforementioned points, the site is design to meet responsive
specification at this it stands a chance of continuity as it can be
accessed with all forms of gprs enabled devices without shrinking.
1.7 SPECIFICATION
To design and implement a Responsive
Website for the department of Electrical Electronics Engineering, with a
hosting of one years
The Website will be able to perform the following functions;
- Download of Lecture notes by students.
- View best performance student in each course.
- Profile of Alumni and Current Student.
- News alert and current trends of information accessible by the department to the student.
- Upload and Download of seminars by lecturers and Students for reference and learning purpose by the Lecturers and Administrator.