VERSION A, REVISION 0 MSU-F-QA-011
MASENO UNIVERSITY
COURSE OUTLINE
COURSE CODE: CCS 215 ACADEMIC YEAR: 2024/2025
COURSE TITLE: WEB DESIGN AND DEVELOPMENT
PROGRAMME: BSC. COMPUTER SCIENCE
DEPARTMENT: COMPUTER SCIENCE
FACULTY / SCHOOL: COMPUTING AND ONFORMATICS
Lecturer’s Name: Michael Ondeja Adongo
Lecturer’s Contacts:
Telephone No. 0716194067
No. of Units / Contact Hours: 42 Hours
Signed by Course Lecturer: …………………………………………………..
Confirmed by Head of Department: …………………………………………
1
VERSION A, REVISION 0 MSU-F-QA-011
COURSE CODE: CCS 215 COURSE TITLE: WEB DESIGN AND DEVELOPMENT
Pre-requisite: Contact Hours: 42
Year of Study: 2024/2025 Semester: 1
Purpose of the course:
The course is meant to enable a student to develop a simple website and know how a website can be hosted.
Expected Learning Outcomes:
By the end of the course, the student should be able to:
1. Understand how data is transmitted over the internet
2. The importance of internet as a research tool
3. Know the guidelines and the process used to design and develop a website
4. Develop a simple website and know how it can be hosted
Week Topics: Sub-Topics
1 Introduction and definitions Internet, Packets and Routing,
TCP/IP and Domain Names.
The World Web (WWW): URLs and Client-Server Model
2 Browsing browsers and types, searching techniques;
Search engines: functions, how they work, examples of search engines;
The internet as a research tool;
3 Web design and development web design guidelines, web design and development process;
Web hosting: web server, web host, features of a web hosting plan
4 Introduction to Hypertext Creating a basic web page with HTML
Markup Language (HTML) Defining and explaining the basic elements of a basic web page
Tags, Elements & Attributes,
HEAD & BODY, Title & Paragraphs, Heading Tags & Whitespace,
5 Formatting web a page unordered & Ordered Lists, Definition list Tags attributes, Bold & Italics,
document Images: Image Formats & Production Considerations, Optimizing Images for
the Web, The IMG Tag, Relative vs. Absolute URLs, Fine-Tuning with Alt,
Width & Height Attributes.
Anchors & Hyperlinks (Hyperlinks, Linking to Emails, Linking to a Specific
Part of a Webpage, Linking Images)
CAT 1
6 Adding tables to a web page Tables & Table Attributes
Adding & Formatting Rows & Columns
Spanning Rows & Columns
7 Adding forms to a web page Forms and Form attributes
Elements of a form
8 Cascading style sheets (CSS) Definition, Internal Style Sheets, Selectors, Properties & Values
Building & Applying Class Selectors, Grouping Selectors
Creating Comments in Your Code,
Using Div Tags & IDs to Format Layout,
Understanding the Cascade & Avoiding Conflicts
9 More CSS External Style Sheets; Hyperlinks with Pseudo-Classes
CSS Box Model: Padding, Borders & Margins; Styling UL and OL with CSS
Overriding the Inheritance of Attributes
10 Creating Layouts Side Content Div, Absolute & Relative Positioning
Float & Clear Properties
Overflow, Auto-Centering Content; Using Fixed Positioning
11 Intro to JavaScript Client-Side JavaScript, Advantages and Limitations of JavaScript
JavaScript Code placement, Comments in JavaScript
2
CAT 2
12 JavaScript Language Elements Variables, Operators, Expressions, Statements,
Data types and Control structures
Arrays, Functions, methods, Objects
13 JavaScript Events Form validation: text fields, drop-downs, radio buttons,
14 FINAL EXAMINATION
15 FINAL EXAMINATION
16 FINAL EXAMINATION
Mode of Delivery:
Lectures, lecture notes, Lab Manual, Lab Practice, class discussions and group discussions
Instructional Materials and Equipment:
Audio visual equipment, white board and white board markers Web development Tools
Course Assessment:
Continuous Assessment Tests – 30%
End of Semester Examination – 70%
Core References:
Jon Duckett, HTML &CSS , Design and Build Websites
Chris Minnick and Eva Holland, Coding for JavaScript for Dummies
Recommended Reference Materials:
Thomas A. Powel, HTML and CSS: The Complete Reference, Fifth Edition, McGraww Hill
Duckett, Jon(2005), Accessible XHTML and CSS Web Sites Problem Design Solution, Wrox
David Flanagan, JavaScript: The Definitive Guide, 6th Edition
D.Goodman, JavaScript & DHTML Cookbook Solutions and Example for Web Programmers, O’Reilly and Associates
Inc
3
2.0 LECTURE SCHEDULE (HRS)
WEEK ONE TOPIC: Introduction and definitions
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Internet, 3 Jon Duckett, HTML Introduction Group Project
Packets and &CSS , Design and
Routing, Build Websites
TCP/IP and
Domain
Names.
The World
Web
(WWW):
URLs and
Client-Server
Model
WEEK TWO TOPIC: Browsing
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
browsers 3 Jon Duckett, HTML Chapter 19 Group Project
and types, &CSS , Design and Build
searching Websites
techniques;
Search
engines:
functions,
how they
work,
examples of
search
engines;
The internet
as a research
tool
4
WEEK THREE TOPIC: Web design and development
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
web design 3 Jon Duckett, HTML &CSS , Chapter 18, LAB 1A Group Project
guidelines, Design and Build Websites 19
web design
and
development
process;
Web
hosting: web
server, web
host,
features of a
web hosting
plan
WEEK FOUR TOPIC: Introduction to Hypertext Markup Language (HTML)
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Creating a 3 Jon Duckett, HTML &CSS Chapters 1, 2, LAB 1B, 1C Group Project
basic web , Design and Build 15, 17
page with Websites
HTML
Defining and
explaining
the basic
elements of a
basic web
page
Tags,
Elements &
Attributes,
HEAD &
BODY, Title
&
Paragraphs,
Heading Tags
&
Whitespace,
5
WEEK FIVE TOPIC: Formatting web a page document
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
unordered & 3 Jon Duckett, HTML &CSS Chapters 3, 4, LAB 2A Group Project
Ordered , Design and Build 5, 14
Lists, Websites
Definition list
Tags
attributes,
Bold &
Italics,
Images:
Image
Formats &
Production
Consideration
s, Optimizing
Images for
the Web, The
IMG Tag,
Relative vs.
Absolute
URLs, Fine-
Tuning with
Alt, Width &
Height
Attributes.
Anchors &
Hyperlinks
(Hyperlinks,
Linking to
Emails,
Linking to a
Specific Part
of a
Webpage,
Linking
Images)
6
WEEK SIX TOPIC: Adding tables to a web page
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Tables & 3 Jon Duckett, HTML Chapter 6, 14 LAB 2B CAT 1
Table &CSS , Design and Build
Attributes Websites
Adding &
Formatting
Rows &
Columns
Spanning
Rows &
Columns
WEEK SEVEN TOPIC: Adding forms to a web page
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Forms and 3 Jon Duckett, HTML &CSS Chapter 7, 14 LAB 3A Group Project
Form , Design and Build
attributes Websites
Elements
of a form
7
WEEK EIGHT TOPIC: Cascading style sheets (CSS)
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Definition, 3 Jon Duckett, HTML Chapter 10, LAB 3B Group Project
Internal &CSS , Design and 11,12, 13
Style Build Websites
Sheets,
Selectors,
Properties
& Values
Building &
Applying
Class
Selectors,
Grouping
Selectors
Creating
Comments
in Your
Code,
Using Div
Tags & IDs
to Format
Layout,
Understand
ing the
Cascade &
Avoiding
Conflicts
WEEK NINE TOPIC: More CSS
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
External Style 3 Jon Duckett, HTML Chapter 13 LAB 3C Group Project
Sheets; &CSS , Design and Build
Hyperlinks with Websites
Pseudo-Classes
CSS Box
Model:
Padding,
Borders &
Margins;
Styling UL and
OL with CSS
Overriding the
Inheritance of
Attributes
8
WEEK TEN TOPIC: Creating Layouts
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Side Content 3 Jon Duckett, HTML Chapters 15, LAB 4 Group Project
Div, Absolute & &CSS , Design and 16, 17
Relative Build Websites
Positioning
Float & Clear
Properties
Overflow, Auto-
Centering
Content; Using
Fixed
Positioning
WEEK ELEVEN TOPIC: Introduction to JavaScript
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Client-Side 3 Chris Minnick and Eva Chapter 1, 2 LAB 5 Group Project
JavaScript, Holland, Coding for
Advantages JavaScript for Dummies
and
Limitations of
JavaScript
JavaScript
Code
placement,
Comments in
JavaScript
WEEK TWELVE TOPIC: JavaScript Language Elements
9
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Variables, 3 Chris Minnick and Eva Chapter 3, 4, LAB 6 CAT 2
Operators, Holland, Coding for 5, 7
Expressions, JavaScript for Dummies
Statements,
Data types and
Control
structures
Arrays,
Functions,
methods,
Objects
WEEK THIRTEEN TOPIC: JavaScript Events
Sub Topic Hrs Course Text Readings Practicum / Lab Assignment(s) Comments
Practicals (By Lecturer)
Form 3 Chris Minnick and Eva Chapter 8,
validation: Holland, Coding for 10, 11,12
text fields, JavaScript for Dummies
drop-downs,
radio buttons
End of Course Remarks / Signatures:
Course Lecturer: …………………………………………………………………………………………….
………………………………………………………………………………………………………………...
………………………………………………………………………………………………………………...
Head of Department: ……………………………………………………………………………………….
………………………………………………………………………………………………………………...
………………………………………………………………………………………………………………...
10