sap mi2402 desain web

8/19/2019 SAP MI2402 Desain Web

http://slidepdf.com/reader/full/sap-mi2402-desain-web 1/4

Tahun Ajaran: /

MI2402 Desain Web (IND)

2

Materi Bahasan

3Web

Design (ENG)

Metode Media

SATUAN ACARA

PENGAJARAN

Semester: Ganjil 2014 2015

Kode/Code Nama Mata Kuliah / Subject Name SKS/Credit Semester

Pustaka

1 1

Minggu Pert ke‐ Kajian Kompetensi Dasar Pokok Bahasan Sub Pokok Bahasan

‐ Kontrak perkuliahan

‐Pengenalan

website

‐ Pengantar desain web

‐ Peran HTML dan CSS dalam desain web

‐ Aplikasi‐aplikasi pendukung

Ceramah

Projector,

papan tulis,

komputer

1,2

Jenis

Teori

1 2Pemberian tugas dari materi pengantar website

Tu as Kom uterPrakte

‐ Perkembangan website

‐ Jenis‐ jenis websitePengantar website

Memahami dan memiliki

wawasan tentang

pengantar website dan

desain web

5

Tag HTML lanjut :

‐Komentar

dalam

HTML

‐ Karakter khusus dalam HTML

‐ List

‐ Fontasi

‐ Image

‐ Hyperlink

‐ Form

Praktikum

2 3

Tag HTML dasar :

‐ Body

‐ Heading

‐Paragraf

‐ Breaking Now

‐ Horizontal Ruler

‐ Preformat

‐ Bold, Italic, Underline

‐ Subscript, Superscript

Praktikum

Projector,

papan tulis,

komputer

1,2

(pertemuan 1)

Praktik

um

Dasar‐dasar tag, atribut,

element, value dalam

HTML guna membuat

website

HTML

(Hypertext Markup

Language)

Tugas KomputerPrakte

Praktik

Tag‐tag HTML lanjutan

dalam membangun

website

1,2

3Projector,

papan tulis,

komputer

1,2

2 4 Pemberian tugas dari materi tag dasar HTML

(pertemuan 3) Tugas KomputerPrakte

Praktik

um

Tag HTML dasar

Memahami pengertian

HTML beserta

fungsi

tag

‐

tag di dalamnya dalam

membuat desain web

Tag HTML lanjut

1,2

4 7Tag

HTML

layout

:

‐ Tabel PraktikumProjector,

papan tulis, 1,2

3 6 Pemberian tugas dari materi tag HTML (pertemuan

5)



Materi Bahasan Metode Media PustakaMinggu Pert ke‐ Kajian Kompetensi Dasar Pokok Bahasan Sub Pokok BahasanJenis

1,2

5 9 Praktikum

Projector,

papan tulis,

komputer

1,2

4 8 Pemberian tugas dari materi tag HTML (pertemuan

7)Tugas KomputerPrakte

Praktik

um

1,2

6 11

Pengenalan CSS :

‐ Cara kerja CSS

‐ Keuntungan CSS

‐ Jenis CSS

‐ Struktur CSS

Praktikum

Projector,

papan tulis,

komputer

1,2

5 10 Tugas KomputerPrakte

Praktik

umMahasiswa memahami

dan memiliki wawasan

tentang desain web

menggunakan

CSS1,26 12

Pemberian tugas

dari

materi

pengenalan

CSS


kStruktur CSS :

‐ Selector

‐ Class selectorProjector,

Assessment Kajian 1 (HTML)

Review hasil assessment kajian 1 (HTML)

‐ Sejarah CSS

‐ Kegunaan CSSPengenalan CSS

Praktikum

Projector,

papan tulis,

komputer

1,2

7 14 Pemberian tugas dari materi struktur CSS


Praktik

um

Selector, declarator,

classStruktur CSS

7 13 ‐ ID Se ector

‐ Inheritance

‐ Pseudo Classes

‐ Nesting CSS

‐Shorthand

CSS

Praktikum papan tulis,

komputer

1,2

1,2

9 17‐ Setting warna

‐ Property warna

‐Latar

belakang

Praktikum

Projector,

papan tulis,

komputer

1,2

8 16 Pemberian tugas dari materi font dan text dalam

CSS (pertemuan 15) Tugas Komputer

Prakte

k

Praktik

um

um

1,2

8 15

Font :

‐ Font‐family

‐ Font‐size

‐ Font‐color

Teks :

‐ Line‐height

‐Text

‐decoration

‐ Text‐transform

‐ Text‐align

‐ Text‐ Indent

‐ White‐space

CSS

(Cascading Style

Sheets)

Ma asiswa mampu

memahami struktur CSS

dalam membangun

sebuah website

Font dan

text

dalam

CSSFont

dan

text

dalam

CSS

Warna dan

latar

dalam

Warna

dalam

CSS

Mahasiswa mampu

memahami dan

membuat tampilan web

menggunakan tag‐tag

dalam CSS




Tugas KomputerPrakte

k

Praktikum

1,2

11 21 Praktikum

Projector,

papan tulis,

komputer

1,2

10 20 Pemberian tugas dari materi warna dalam CSS

(pertemuan 19) Tugas Komputer

Prakte

k

Praktik

um

1,2

10 19

Layer :

‐ Dasar dan kegunaan layer

Hyperlink :

‐ Property dan style halaman

Kursor :

‐ Property dan customized cursor

Praktikum

Projector,

papan tulis,

komputer

1,2

9 18 Pemberian tugas dari materi warna dalam CSS

(pertemuan 17)

1,2

Layout :

‐ Margin

‐ Border

11 22 Tugas KomputerPrakte

Assessment Kajian 2 (CSS)

Review hasil assessment kajian 2 (CSS)

‐ Layer

‐ Hyperlink

‐ Kursor

Layering dalam CSS

Prakte

k

Praktik

um

Tugas Komputer

12 23

‐ Padding

‐ Floating

Display :

‐Atribut

display

‐ Tampilan dalam tabel

Praktikum

Projector,

papan tulis,

komputer

1,2Praktik

um

13 25 Praktikum membuat website sederhana berbasis

HTML dan CSS Praktikum

Projector,

papan tulis,

komputer

1,2

12 24 Pemberian tugas dari materi layout dan display

dalam CSS (pertemuan 23) Tugas Komputer

Prakte

k

Praktik

um

Layout dan display

dalam CSS

26

Pemberian tugas dari materi web sederhana

berbasis HTML

dan

CSS

(pertemuan

25) Tugas Komputer

Prakte

k

Praktik

um

Mahasiswa dapat

mengetahui pembuatan

layout desain web

menggunakan CSS

Layout dan display dalam

CSS

1,2

1,2

15 29 Praktikum membuat website statis berbasis HTML

dan CSS

Praktikum

Projector,

papan tulis,

komputer

1,2

14 28 Pemberian tugas dari materi website lengkap

berbasis HTML dan CSS (pertemuan 27)

CSS Layout

Mahasiswa mampu

membuat desain web

menggunakan tag HTML

dan CSS serta

memasukkan elemen‐

elemen website ke

dalam desain

yang

telah

Layout website

sederhana menggunakan

hyperlink dan konten di

setiap halaman web

Layout website

sederhana

Website statis HTML dan

CSSWebsite statis

1,2

14 27 Praktikum membuat website statis berbasis HTML

dan CSS Praktikum

Projector,

papan tulis,

komputer

1,2

13

Website statis

HTML

dan

CSSWebsite statis




Prakte

k

Praktik

um

Praktik

Pemberian tugas dari materi website statis HTML

dan CSS (pertemuan 29) Tugas Komputer 1,215 30

1,2

Praktikum

Projector,

papan tulis,

komputer

1,2

16 32

16 31

Tugas Komputer

Assessment Kajian 3 (CSS layout)

Review hasil assessment kajian 3 (CSS layout)

sap mi2402 desain web

Documents