RENCANA PEMBELAJARAN SEMESTER

IS2132 WEB DESIGN

Program Studi Sistem Informasi

Fakultas Ilmu Komputer
Universitas Klabat

2020
 UNIVERSITAS KLABAT DOCUMENT NO:
FACULTY OF COMPUTER SCIENCE 001/UK/FIK/SI/RPS/VII/2020
INFORMATION SYSTEM PROGRAM
COURSE
CODE / COURSE NAME CREDIT (sks) SEMESTER DATE
DOMAIN
Algorithm
IS2132 Web Design and In Class=2 Practice=1 3 July, 7th 2020
Programming
APPROVED Lecturer Course Domain Chief Head of Information System Program
BY

LEARNING 1. Build simple applications in a Web-based environment

OUTCOMES
COURSE After completing this course, students are able to design website pages by writing HTML and CSS code. Students are
DESCRIPTIO equipped with basic knowledge about Web technology, the development of Web technology, creating Web documents
N using HTML, and using CSS to adjust the appearance of Web pages to be attractive. Learning activities use project-based
methods, so students can directly practice creating Websites based on real projects.
LEARNING 1. Introduction to Web Technology
MATERIALS 2. HyperText Markup Language (HTML)
3. Cascading Style Sheets (CSS)
REFERENCES Main:
1. Jennifer Niederst Robbins, Learning Web Design: A Beginner’s Guide to HTML, CSS, JavaScript, and Web Graphics 5 th Edition,
O’Reilly, 2018.
2. Jon Duckett, HTML & CSS: Design and Build Websites, John Wiley & Sons, 2011.
Supplementary:
3. MDN Web Docs, HTML: Hypertext Markup Language, https://developer.mozilla.org/en-US/docs/Web/HTML.
4. MDN Web Docs, CSS: Cascading Style Sheets, https://developer.mozilla.org/en-US/docs/Web/CSS
LECTURER Reymon Rotikan, S.Kom, M.S.
PRE-  IS1113 – Computer Programming
REQUISITE
 Form of Learning; Learning
Grading Methods; Assignment
Week Course Learning Outcomes (as the Learning Materials Assessment
[Estimated Time]
# final ability expected) [Reference] Weight (%)
Indicato Criteri
Offline Online
r a
(1) (2) (3) (4) (5) (6) (7) (8)
1-2 Build simple applications in a Web- Google Classroom Introduction to Web 5
based environment Technology
Google Meet
[1]
Quizziz
3-5 Build simple applications in a Web- Google Classroom HTML: 15
based environment  Text
Google Meet  Link
 Image
Quizziz  Table
 Form
 Video & Audio
[1, 2]

6-7 Build simple applications in a Web- freecodecamp HTML – Project 30

based environment
[case study]

8 Mid Term Exam

9-12 Build simple applications in a Web- Google Classroom CSS: 20
based environment  Introduction
Google Meet  Text
 Colors & Backgrounds
Quizziz  Box
 Floating & Positioning
 Flexbox & Grid
 Responsive Web Design
 Transitions, Transforms,
 Form of Learning; Learning
Grading Methods; Assignment
Week Course Learning Outcomes (as the Learning Materials Assessment
[Estimated Time]
# final ability expected) [Reference] Weight (%)
Indicato Criteri
Offline Online
r a
(1) (2) (3) (4) (5) (6) (7) (8)
& Animation
[1, 2]

13-15 Build simple applications in a Web- freecodecamp CSS – Project 30

based environment
[case study]

16 Final Exam
 UNIVERSITAS KLABAT
FACULTY OF COMPUTER SCIENCE
INFORMATION SYSTEM PROGRAM
SYLLABUS
Course Name Web Design
Code IS2132
COURSE
Credit 3
Semester 3
COURSE DESCRIPTION
After completing this course, students are able to design website pages by writing HTML
and CSS code. Students are equipped with basic knowledge about Web technology, the
development of Web technology, creating Web documents using HTML, and using CSS to
adjust the appearance of Web pages to be attractive. Learning activities use project-based
methods, so students can directly practice creating Websites based on real projects.
COURSE LEARNING OUTCOMES
1. Build a simple applications in a Web-based environment
LEARNING MATERIALS
1. Introduction to Web Technology
2. HyperText Markup Language (HTML)
3. Cascading Style Sheets (CSS)
REFERENCES
1. Jennifer Niederst Robbins, Learning Web Design: A Beginner’s Guide to HTML, CSS, JavaScript,
and Web Graphics 5th Edition, O’Reilly, 2018.
2. Jon Duckett, HTML & CSS: Design and Build Websites, John Wiley & Sons, 2011.
3. MDN Web Docs, HTML: Hypertext Markup Language, https://developer.mozilla.org/en-
US/docs/Web/HTML.
4. MDN Web Docs, CSS: Cascading Style Sheets, https://developer.mozilla.org/en-
US/docs/Web/CSS

PRE-REQUISITE
 IS1113 – Computer Programming
 UNIVERSITAS KLABAT
FACULTY OF COMPUTER SCIENCE
INFORMATION SYSTEM PROGRAM
STUDENT ASSIGNMENT PLAN
COURSE
Web Design
NAME
CODE IS2132 CREDIT(s) 3 SEMESTER 3
LECTURER Reymon Rotikan, S.Kom, M.S.
TYPE WORKING TIME
HTML Project 14 days
TITLE
Project 1 – Create Basic Website Using HTML
COURSE LEARNING OUTCOME
Students can create Website pages using HTML.
DESCRIPTION
Students will create a Website for the Academic Guidance program at the Faculty of
Computer Science, Klabat University. The website that will be created consists of several
pages, namely:
 Home
 About
 Contact Us
 Login
 Profile
 Consultation
 Study Plan
 Study Result
WORKING METHOD
1. Identify the required components for each web page
2. Create an HTML file for each Web pages
FORMAT AND OUTPUT
a. Format:
1. Student working individually
2. Student collect the required information needed for each Web pages
3. Student write the HTML code to create the required Web page
4. Student identify and understand the requirements needed by users
5. All the created pages are saved in a project folder
b. Output:
1. Report submitted in zip format (HTMLProject-student_full_name.zip) of their project
folder and upload it to Google Classroom
INDICATOR, CRITERIA AND GRADING
HTML Document (100%)
1. Home (5%)
2. About (5%)
3. Contact Us (5%)
 4. Login (5%)
5. Profile (20%)
6. Consultation (20%)
7. Study Plan (20%)
8. Study Result (20%)
SCHEDULE
1. Create the required Web pages August – September 2020
OTHER INFORMATION
The results made on this project will be continued in the next project, namely CSS Project.
REFERENCES
1. Jennifer Niederst Robbins, Learning Web Design: A Beginner’s Guide to HTML, CSS,
JavaScript, and Web Graphics 5th Edition, O’Reilly, 2018.
2. Jon Duckett, HTML & CSS: Design and Build Websites, John Wiley & Sons, 2011.
3. MDN Web Docs, HTML: Hypertext Markup Language, https://developer.mozilla.org/en-
US/docs/Web/HTML.
4. MDN Web Docs, CSS: Cascading Style Sheets, https://developer.mozilla.org/en-
US/docs/Web/CSS
 UNIVERSITAS KLABAT
FACULTY OF COMPUTER SCIENCE
INFORMATION SYSTEM PROGRAM
STUDENT ASSIGNMENT PLAN
COURSE
Web Design
NAME
CODE IS2132 CREDIT(s) 3 SEMESTER 3
LECTURER Reymon Rotikan, S.Kom, M.S.
TYPE WORKING TIME
CSS Project 14 days
TITLE
Project 2 – Create Stylesheet for the Academic Guidance Website Using CSS
COURSE LEARNING OUTCOME
Students can apply styling using CSS for a created HTML Website.
DESCRIPTION
Students will create a the styling for the Academic Guidance Website at the Faculty of
Computer Science, Universitas Klabat.
WORKING METHOD
1. Identify the styling guideline you want to use
2. Create the styling rules using CSS and apply it to all the HTML Web pages
FORMAT AND OUTPUT
a. Format:
1. Student working individually
2. Student choose their styling preferences
3. Student write the CSS styling rules
4. Apply the CSS rules to all the Web pages
6. All the created pages are saved in a project folder
b. Output:
1. Report submitted in zip format (HTMLProject-student_full_name.zip) of their project
folder and upload it to Google Classroom
INDICATOR, CRITERIA AND GRADING
CSS Styling Rules Document (100%)
SCHEDULE
Write the CSS styling rules November – December 2020
OTHER INFORMATION

REFERENCES
1. Jennifer Niederst Robbins, Learning Web Design: A Beginner’s Guide to HTML, CSS, JavaScript,
and Web Graphics 5th Edition, O’Reilly, 2018.
2. Jon Duckett, HTML & CSS: Design and Build Websites, John Wiley & Sons, 2011.
3. MDN Web Docs, HTML: Hypertext Markup Language, https://developer.mozilla.org/en-
US/docs/Web/HTML.
4. MDN Web Docs, CSS: Cascading Style Sheets, https://developer.mozilla.org/en-
US/docs/Web/CSS