UNIVERSITY OF MAKATI

College of Computer Science

Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
Course Code:
WEBTOOL

Course Title: WEB DEVELOPMENT

TOOL

Credit Units
:4

Contact Hours : 6
Hrs. X 18 Weeks =
108 Hrs.

Prerequisites
NONE

Course Description:
This course provides students with an introductory look at photo editing and website development Basic Adobe Photoshop and Basic HTML
with CSS.
PEOs
PLOs
PEO1: Generates analysis, design, and systems
appropriate for the computing specialization or
Information Technology from a well-defined problems
and requirements in the most favorable provisions.
PEO2: Demonstrates conformity to high moral rectitude
and system of rules.
PEO3: Provides and communicates applicable solutions
and services that include strategic planning, technology
evaluation and planning, and complex business
information synthesis that enable the organization to
achieve its goals.

PLO 1: Apply knowledge for solving computing problems

PLO 2: Analyze a problem to come up with the appropriate solution
PLO 3: Design and develop computer based-system to meet
desired needs
PLO 4: Work effectively individually or on teams to accomplish a
common goal
PLO 5: Understand professional, ethical, legal, security and social
issues and responsibilities
PLO 6: Analyze the local and global impact of computing on
individuals, organizations, and society
PLO 7: Recognize the need for an ability to engage in independent
learning for continual professional development
PLO 8: Communicate (written or oral) effectively with a range of
audiences
PLO 9: Utilizes current techniques, skills, and tools needed

Course Learning Outcomes:

CL
Description
O
#
At the end of the course, the student should be able to:
1
Identify and describe the major functions of Photoshop CS4, Work

Links to PLOs/GSA/BCG
PLOs
GSA

BCG

1 2 3 4 5 6 7 8 9 1 2 3 4 5 6 7 8 9 1 2 3

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
and manipulate images, Resize and Crop images, Work with basic
selections, Create, edit, delete and manage Layers, Paint, Retouch
photos, Correct Colors, Use Masks and the Quick Mask Mode, Use the
Pen Tool, Create Special Effects, Export Your Work, and Demonstrate
mastery of lesson content at levels of 70% or higher.
2
Design, create, and use the client side technologies of the World
wide web: HTML and CSS
3
Combine Photoshop and Client side technologies: HTML and CSS to
build an overall professional looking static website.
4
Identify, compare and evaluate different static websites.
5
Apply professional commitment to ethical practice.
Course Content:

Learning Outcomes

Topics

Link
to
CLO

No. of
Meetin
gs

1. To discuss and
explain the Mission
and Vision of UMak
and CCS.
2. To discuss and
explain the computer
guidelines, laboratory
and classroom
policies.
3. To elaborate the
grading system and
syllabus.

Orientation

Mission and Vision of the University

Mission and Vision of CCS

Classroom and laboratory Policies

CLO5

Computer Guidelines

Review Computer Safety

Guidelines

Review of Netiquette
Grading System / Syllabus

Grading
Period

Midterm

Teaching
and
Learning
Activities
(TLAs)
Lecture/PPT
Presentation

Assessment
Tools
(ATs)

Quiz, Recitation

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
1. To discuss and
explain the color
theory.
2. To discuss and
explain the primary
color, secondary
color, photographic
filters, neutral, color
bias and color vision.
1. To discuss and
explain the
environment of
Adobe Photoshop
2. To discuss and
illustrate the basic
use of Adobe
Photoshop

Introduction to Color Theory

Primary colors

Secondary colors

Photographic filters

Neutral and color biased photo

Color vision test

CLO1

Midterm

Lecture / PPT
Presentation
/ Video
Presentation

Assignments
Seatwork
,Quizzes,
Recitations

Introduction to Adobe Photoshop

Palettes

Tools

Keyboard shortcuts

Work area

Color Balancing

Hue and Saturation

Brightness and Contrast

Opening, closing copying and

pasting Images

CLO1

Midterm

Lecture / PPT
Presentation

Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations

1. Use, discuss and

explain the crop,
patch, healing brush,
stamp tool, pen,
lasso, patch, marque,
gradient, paint
bucket, text, burn
and dodge tool.

Using Adobe Photoshop Tools Palette

Cropping images for ID sets and

picture sizes

Using Patch and Healing Brush tool

Editing Old image.jpg

Using Stamp tool (cloning image in

another canvass)

Using selection tool Pen, lasso,

patch, marquee tools

Gradient tool and Paint Bucket and

CLO1

Midterm

Lecture / PPT
Presentation

Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL

1. Use, discuss and

explain the different
tools in creating post
card, calling card,
collage and banner
for website.

Text tool
Burn and Dodge Tool

Image layering of Photoshop

cropping images and pasting it to a

new canvass

Creating post card

Creating Calling card

Collage

Banner for website

CLO1

Midterm

Lecture / PPT
Presentation

1. Use, discuss and

explain the basic
terminologies of
Web, website and
webpage
2. Use, discuss and
explain the HTML,
tags, elements,
attributes and
basic structures
1. Use, discuss and
explain the HTML
Page title,
paragraph and
headings

Introduction to HTML

What is HTML?

HTML Tags

HTML Elements and Attributes

Web Browsers

HTML Page Structures

CLO2

Final
term

Lecture / PPT
Presentation

HTML Page Title and Paragraph

HTML Headings

CLO2

Final
term

Lecture / PPT
Presentation

1. Use, discuss and

HTML Lists

CLO2

Final

Lecture / PPT

Hands on by
creating print
out materials,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations

Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
explain the HTML
Lists

term

Presentation

1. Use, discuss and

explain the HTML
Links and Images

HTML Links
HTML Images

CLO2

Final
term

Lecture / PPT
Presentation

1. Use, discuss and

explain the HTML
Tables

HTML Tables

CLO2

Final
term

Lecture / PPT
Presentation

1. Use, discuss and

explain the basic
CSS

Basic CSS

CLO2

Final
term

Lecture / PPT
Presentation

1. Use, discuss and

explain the HTML
Layout, forms and

HTML Layout
HTML Forms
HTML iframes

CLO2

Final
term

Lecture / PPT
Presentation

Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,
Board
Exercises,
Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,
Board
Exercises,

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
iframes

1. Apply the concept

of creating
website using
Adobe Photoshop
in creating
designs and HTML
in creating the
website.

Website Development

Teaching Learning Activities (TLAs)

OBTL
Description
1
Lecture presentation / Video Presentation
2
Hands on
3
Board Exercises
Assessment Tools (ATs)
OBAT
Description
1
Assignments and Seatwork
2
Examinations
3
Recitation and Quizzes

CLO3
CLO4
CLO5

Final
term

Lecture / PPT
Presentation

Assignments,
Seatwork
,Quizzes,
Recitations
Hands on,
quizzes

CLO1
50%
30%
10%

CLO2
50%
30%
10%

CLO3
50%
30%
10%

CLO4
50%
50%
0%

CLO5
30%
70%
0%

CLO1
10%
50%
40%

CLO2
10%
50%
40%

CLO3
10%
50%
40%

CLO4
10%
50%
40%

CLO5
0%
50%
50%

Computation of Scores:
Midterms:
Midterm Grade = Midterm Exam (Written 20% + Hands On 20%) + Quizzes (Written 20% + Hands on 20%) + Attendance /

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
Recitation (10%) + Assignment (10%)
Final Term:
Final term Grade = Final term Exam (Written 20% + Hands On 20%) + Quizzes (Written 20% + Hands on 20%) + Attendance /
Recitation (10%) + Assignment (10%)
Final Grade:
Final Grade = Midterm Grade (40%) + Final Term (60%)
References
A. Textbooks:
B. Books:
Adobe Photoshop Classroom in a book
HTML and Web Design by Junard Lebajan and Eleazar Esporlas

C. Online References:
www.w3schools.com
www.Lynda .com (training CD)
Kodak training CD
Adobe Photoshop Help (F1)
CLASS POLICIES
1
2

Admission
Attendanc
e

YOU WILL BE DROPPED FROM THIS CLASS FOR EXCESSIVE ABSENCE. It is the policy of the
school to drop a student from class at absence number 9, or 1 week of classes. This includes both
excused and unexcused absences. You are strongly advised to save these absences for illness or
family emergency. Absences that are due to illness or family emergency will be included in this

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
calculation. There is no such thing as a medical excuses for an absence. Thus, a student who cuts
the class two times, and then has a documented illness, will be treated as though all two absences
were cuts.
TWO late arrivals to class are equivalent to one absent.
Attendance may be taken either verbally or non-verbally by the instructor. If attendance is being taken
by the instructor consider yourself absent unless the instructor is made aware of your presence when
he/she calls your name.
If a student has been absent because of an illness or family emergency, the student should inform the
instructor of this fact on the day s/he returns to class. If a class is missed for any reason, the student is
required to get lecture and discussion notes from another student (do not ask the instructor).

Classroom
Decorum

Examinati
ons

Consultati
on Hours

A student who misses an examination will not be permitted to take a make-up exam until s/he
provides the professor with a written description of the illness or family emergency. False writings will
be treated as fraud, resulting in disciplinary actions.
Talking in class or any related distraction deemed inappropriate by the Instructor will not
be tolerated. If the student is conducting this activity, he/she will be asked to leave and marked
absent for the class.
Cell phones and any digital devices: Please turn these to the silent or vibrating setting when you
enter the classroom. It is not appropriate to take calls during class hours (even by leaving the room)
unless there is a serious emergency. Please inform the Instructor if you have an Emergency call.
There will be no special quizzes, tests, and exams. If you missed a quiz, test, or exam, your grade
will be ZERO, and you will NOT be able to make up the missed examination.

UNIVERSITY OF MAKATI
College of Computer Science
Bachelor of Science in Information Technology Service Management
Bachelor of Science in Computer Science Major in Application Development
OBE Course Syllabus in WEB DEVELOPMENT TOOL
Prepared by:
Noted by:
Alexander B. Pahayahay
___________________________

Evaluated by:
______________________

Approved by:
________________________