DESIGN AND IMPLEMENTATION OF ELECTRICAL/ELECTRONICS DEPARTMENT WEBSITE

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 common data.

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.

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.