1
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/1
Alokasi Waktu : 8 x 45 menit
Aspek/materi pokok : Teknologi Aplikasi Web
A. Kompetensi Inti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayatidan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.1 Memahami konsep teknologi aplikasi web
4.1 Menyajikan pelbagai teknologi pengembangan aplikasi web
C. Indikator Pencapain Kompetensi
Memahami profesi dalam pengembangan aplikasi web
Memahami sejarah dan cara kerja web
Memahami alur pengembangan aplikasi web
SMK NEGERI 1 TRENGGALEK
2
Memahami perangkat pengembangan aplikasi web
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami profesi dalam
pengembangan aplikasi web
Selama dan setelah proses pembelajaran, siswa memahami sejarah dan cara kerja web
Selama dan setelah proses pembelajaran, siswa memahami alur pengembangan
aplikasi web
Selama dan setelah proses pembelajaran, siswa memahami perangkat pengembangan
aplikasi web
E. Materi Pembelajaran
Profesi dalam pengembangan aplikasi web
Sejarah dan cara kerja web
Alur pengembangan aplikasi web
Perangkat pengembangan aplikasi web
Pada tahun 1969, DoD memberi tugas kepada ARPA untuk membangun sebuah mata rantai
komunikasi antara DoD dengan militer yang tidak dapat disabot oleh musuh mereka. Jaringan
komunikasi yang diciptakan ini disebut ARPAnet. Pada awalnya, ARPAnet hanya
menghubungkan empat buah situs saja, yaitu :
y of Utah
Pada tahun 1970, penelitian yang dilakukan di Stanford University menghasilkan sebuah
protokol yang disebut TCP/IP. Protokol TCP/IP inilah yang berkembang terus hingga sekarang
dan menjadi protokol standar dalam Internet.
Istilah-istilah dalam internet
WWW
World Wide Web merupakan suatu bentuk layanan Internet yang
TCP/IP
TCP/IP singkatan dari Transfer Control Protocol/Internet Protocol
merupakan jenis protocol yang memungkinkan komputer
berkomunikasi dengan komputer lain melalui suatu jaringan yang di
sebut dengan internet.
URL
URL (Uniform Resource Locator) digunakan sebagai penunjuk lokasi
pada internet. URL dapat dimisalkan dengan alamat yang menunjuk
pada suatu lokasi.
Homepage
Tampilan awal (halaman utama) suatu website yang memuat informasi
singkat tentang apa isi dari website tersebut
Situs
Suatu alamat di dalam sebuah web
Browser
Software yang digunakan untuk surfing atau browsing Internet, seperti
Internet Explorer, Opera, Netscape dll
ISP
Internet Service Provider, penyedia jasa layanan Internet, seperti
Indosatnet, Wasantara, Meganet dll
SMK NEGERI 1 TRENGGALEK
3
E-mail
Electronic Mail, suatu layanan/fasilitas yang disediakan untuk saling
berkirim surat lewat internet
Search Engine
Mesin pencari, suatu layanan/fasilitas untuk melakukan pencarian di
Internet
Nama domain
Nama domain (domain name) adalah nama unik yang diberikan untuk mengidentifikasi nama
server komputer seperti web server atau email server di jaringan komputer ataupun internet.
Nama domain berfungsi untuk mempermudah pengguna di internet pada saat melakukan akses
ke server, selain juga dipakai untuk mengingat nama server yang dikunjungi tanpa harus
mengenal deretan angka yang rumit yang dikenal sebagai alamat IP (192.168.1.1). Nama
domain ini juga dikenal sebagai sebuah kesatuan dari sebuah situs web seperti contohnya
"wikipedia.org". Nama domain kadang-kadang disebut pula dengan istilah URL, atau alamat
website. Daftar nama-nama domain di bawah ini;
Com Commerce, komersial
net Jaringan (Network)
co Company, perusahaan
org Organization, organisasi
gov;go Government, pemerintah
ac Academic, akademik
edu Education, pendidikan
mil
Military, militer
Teknologi web
Web berdasarkan teknologinya terbagi menjadi dua, yaitu Web Statis dan Web Dinamis.
Sebelum menuju ke perbedaan web statis dan web dinamis, mari kita bahas persamaannya
terlebih dahulu. Persamaan web statis dan web dinamis yaitu sama-sama keduanya
merupakan suatu website yang menampilkan halaman yang ditampilkan di internet yang
memuat informasi tertentu (khusus).
Perbedaan Web Statis dan Web Dinamis
1. Interaksi antara pengunjung dan pemilik web
Dalam web statis tidak dimungkinkan terjadinya interaksi antara pengunjung dengan
pemilik web. Sementara dalam web dinamis terdapat interaksi antara pengunjung
dengan pemilik web seperti memberikan komentar, transaksi online, forum, dll.
2. Bahasa Script yang digunakan
Web statis hanya menggunakan HTML saja, atau paling tidak bisa ditambah dengan
CSS. Sedangkan web dinamis menggunakan bahasa pemrograman web yang lebih
kompleks seperti PHP, ASP dan JavaScript.
3. Penggunaan Database
Web statis tidak menggunakan database karena tidak ada data yang perlu disimpan dan
diproses. Sedangkan web dinamis menggunakan database seperti MySQL, Oracle, dll
untuk menyimpan dan memroses data.
4. Konten
Konten dalam web statis hanya diberikan oleh pemilik web dan jarang di-update,
sementara konten dalam web dinamis bisa berasal dari pengunjung dan lebih sering di-
update. Konten dalam web dinamis bisa diambil dari database sehingga isinya pun bisa
berbeda-beda walaupun kita membuka web yang sama.
SMK NEGERI 1 TRENGGALEK
4
Pengertian HTML
HTML atau Hypertext Marksup Language merupakan salah satu format yang digunakan dalam
pembuatan dokumen dan aplikasi yang berjalan dihalaman web. Sebenarnya, dokumen HTML
hanyalah sebuah dokumen teks biasa dan disebut sebagai Markup Language yakni bahasa
yang mengandung tanda (tag) tertentu yang digunakan untuk mengatur format tampilan suatu
dokumen. Simbol markup yang digunakan oleh HTML ditandai dengan tanda lebih kecil ( < )
dan tanda lebih besar ( > ). HTTP atau Hypertext Transfer Protokol merupakan protokol yang
digunakan untuk mentransfer data atau document yang berformat HTML dari web server ke
browser (Internet Explorer, Netscape Navigator, NeoPlanet, dll). Dengan HTTP inilah yang
memungkinkan Anda menjelajah internet dan melihat halaman web
Pengertian Tag pada HTML
Sebagai sebuah bahasa markup, HTML membutuhkan cara untuk memberitahu web browser
bagaimana suatu text ditampilkan. Apakah text itu ditulis sebagai sebuah paragraf, list, atau
sebagai link? Dalam HTML, tanda ini dikenal dengan istilah tag. Hampir semua tag dalam
HTML ditulis secara berpasangan, tag pembuka dan tag penutup, dimana objek yang dikenai
perintah tag berada di antara tag pembuka dan tag penutup. Objek disini dapat berupa text,
gambar, maupun video. Penulisan tag berada di antara dua kurung siku. Format penulisan tag:
<tag_pembuka>objek yang dikenai perintah tag </tag_penutup>
Struktur penulisan pada html:
<html>
<head>
<title> </title>
</head>
<body>
</body>
</html>
Contohnya jika kita ingin membuat suatu text dalam sebuah paragraf di tulis tebal atau miring,
dalam HTML dapat ditulis sebagai berikut: Ini adalah sebuah paragraf.
<i>Hanya kumpulan beberapa kalimat</i>. Paragraf ini terdiri dari <b>3 kalimat</b>.
Hasil dari sebagian kode HTML diatas, diterjemahkan oleh browser menjadi: Ini adalah sebuah
paragraf.
Hanya kumpulan beberapa kalimat.Paragraf ini terdiri dari 3 kalimat.
Tag <i> pada kode HTML diatas memberikan perintah kepada browser untuk menampilkan text
secara garis miring (i, singkatan dari italic), dan tag <b> untuk menebalkan tulisan (b, singkatan
dari bold).
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
SMK NEGERI 1 TRENGGALEK
5
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
30 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
tentang prosedur cara kerja web dan penawaran layanan
hosting
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
terkait tentang
cara kerja web
hosting aplikasi web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
Membandingkan berbagai penawaran hosting
Aplikasi-aplikasi untuk pengembangan aplikasi web
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang cara kerja web, hosting dan aplikasi
pengembangan aplikasi web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah cara kerja web
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah hosting aplikasi web
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah Aplikasi-aplikasi untuk
pengembangan aplikasi web
300 Menit
SMK NEGERI 1 TRENGGALEK
6
o Siswa mencoba membuat laporan hasil observasi tentang
prosedur cara kerja web, perbandingan pelbagai layanan
hosting dan penggunaan aplikasi pengembangan web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang pencarian dan penyelesaian
prosedur cara kerja web, perbandingan pelbagai layanan
hosting dan penggunaan aplikasi pengembangan web
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
30 Menit
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b.Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami profesi
dalam
pengembangan
aplikasi web
Tes
tertulis
Isian Jelaskan mengenai pengembangan
aplikasi web
SMK NEGERI 1 TRENGGALEK
7
Memahami sejarah
dan cara kerja web
Tes
tertulis
Isian Jelaskan tentang cara kerja web
Memahami alur
pengembangan
aplikasi web
Tes
tertulis
Isian Jelaskan alur pengembangan aplikasi
web
Memahami
perangkat
pengembangan
aplikasi web
Tes
tertulis
Isian Jelaskan perangkat pengembangan
aplikasi web
Soal;
LEMBAR KERJA SISWA 1
( Tugas Perorangan )
I. Pilihan Ganda
1. Apa sebutan halaman Web yang ditempatkan di depan situs web?
a.Web Page b. Body c. Home Page d. Link e. Banner
2. Perangkat lunak berikut dapat digunakan untuk membuat Web page, kecuali.....
a.HTML b. Ms Word c. Notepad d. Ms FrontPage e.Adope Photoshop
3. Apa format dokumen sebuah halaman Web...
a.HTML b.PDF c.DOC d.Text e.GIF
4. Pilihan Page pada View Bar di MS Frontpage digunakan untuk menampilkan.....
a. Struktur Web site
b. Lembar kerja
c. Hyperlink
d. Menampilkan laporan-laporan tentang kinerja halaman
e. Semua file di folder tempat kerja
5. Pilihan Folders pada View Bar di MS Frontpage digunakan untuk menampilkan....
a. Struktur Web site
b. Lembar kerja
c. Hyperlink
d. Menampilkan laporan-laporan tentang kinerja halaman
e. Semua file di folder tempat kerja
6. Pilihan Reports pada View Bar di MS Frontpage digunakan untuk menampilkan.....
a. Struktur Web site
b. Lembar kerja
c. Hyperlink
d. Menampilkan laporan-laporan tentang kinerja halaman
e. Semua file di folder tempat kerja
7. Pilihan Navigators pada View Bar di MS Frontpage digunakan untuk menampilkan.....
a. Struktur Web site
b. Lembar kerja
c. Hyperlink
d. Menampilkan laporan-laporan tentang kinerja halaman
e. Semua file di folder tempat kerja
8. Pilihan Hyperlinks pada View Bar di MS Frontpage digunakan untuk menampilkan.....
a. Struktur Web site
b. Lembar kerja
SMK NEGERI 1 TRENGGALEK
8
c. Hyperlink
d. Menampilkan laporan-laporan tentang kinerja halaman
e. Semua file di folder tempat kerja
9. Pilihan Format gambar yang biasa terdapat dalam situs web adalah ....
a.JPEG b.RM c.MP3 d.MPEG e.Ogg
10. Apa nama tombol di MS FrontPage yang digunakan untuk melihat tampilan halaman
Web dari kode HTML yang sudah jadi?
a. Tombol Normal
b. Tombol HTML
c. Tombol Preview
d. Tombol Folder List
e. Tombol Navigation
II. Essay
1. World Wide Web ( WWW ) atau WEB mempunyai pengertian .
2. Universal Resource Locators ( URL ) adalah
3. TAG adalah ..
4. TAG digunakan untuk .
5. Untuk membuat dokumen HTML diperlukan program editors teks apa dan
bagaimana cara menyimpannya supaya dokumen HTML yang kita buat dapat dibuka
oleh web browser ! ( beri contoh sebuah nama file HTML dan ekstensinya )
Pedoman Penskoran
1.Soal diatas
No Uraian Skor
1. Jawaban Soal Pilihan Ganda :
1. A 2. A 3. A 4. B 5. E 6. D 7. A 8. C 9. A 10. C
20
Skor Maximal untuk soal pilihan ganda : 2 x 10 = 20
2. Kunci Jawaban Soal Uraian
Kunci Jawaban Soal No. 01
Sebuah system yang dapat menampilkan informasi berbentuk teks,
gambar, suara dan film yang menjadi bentuk hypertext dan dapat
diakses oleh perangkat lunak yang disebut browser.
10
Kunci Jawaban Soal No. 02
URL merupakan suatu pathname untuk mengidentifikasi sebuah
dokumen di web.
10
Kunci Jawaban Soal No. 03
TAG adalah kode yang digunakan untuk memformat teks yang terdiri
dari TAG pembuka dan TAG penutup, dan TAG pembuka saja tanpa
penutup.
10
Kunci Jawaban Soal No. 04
10
SMK NEGERI 1 TRENGGALEK
9
Menandai berbagai elemen dalam suatu dokumen HTML
Kunci Jawaban Soal No. 05
Editor : notepad
Simpan file dalam bentuk HTM / HTML
Contoh : webku.htm atau webku. Html
10
Skor maksimal untuk soal uraian : 5 x 10 = 70
Nilai = X 100
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkom
unikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
Skor perolehan
Skor Maksimal (20)
Skor perolehan
Skor Maksimal (70)
SMK NEGERI 1 TRENGGALEK
10
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai prosedur cara
kerja web, perbandingan pelbagai layanan
hosting dan penggunaan aplikasi
pengembangan web
3. Struktur/logika penulisan disusun dengan
jelas sesuai metode yang dipakai
4. Bahasa yang digunakan sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang ditetapkan (Kertas,
Spasi, Font)
8. Kerapihan ketikan sesuai dengan SOP
Jumlah
Skor perolehan
Skor Maksimal (24)
SMK NEGERI 1 TRENGGALEK
11
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai dengan
unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu penyelesaian
tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (32)
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
12
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
13
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
14
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
15
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/1
Alokasi Waktu : 12 x 45 menit
Aspek/mater pokok : Format Teks Halaman Web
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.2 Memahami format teks pada halaman web
4.2 Menyajikan teks dalam format tertentu pada halaman web
C. Indikator Pencapain Kompetensi
Memahami anatomi dokumen web
Memahami pemformatan teks dan paragraph
Memahami pembuatan list minimal
Memahami pembuatan list kombinasi
SMK NEGERI 1 TRENGGALEK
16
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami anatomi dokumen web
Selama dan setelah proses pembelajaran, siswa memahami pemformatan teks dan
paragraph
Selama dan setelah proses pembelajaran, siswa memahami pembuatan list minimal
Selama dan setelah proses pembelajaran, siswa memahami pembuatan list kombinasi
E. Materi Pembelajaran
Anatomi dokumen web
Pemformatan teks dan paragraph
Pembuatan list minimal
Pembuatan list kombinasi
Daftar tag pada html adalah sbb:
<html> Dokumen
<head> Header
<title> Judul dokumen
<body> Isi dokumen
<h1><h6> Judul paragraf
<p> Paragraf
<b>,<i>,<u>,<sup>,<sub> Atribut
<br> Ganti baris
<font> Font
<li>,<ol>,<ul> Enumerasi
<hr> Garis mendatar
<img> Gambar
<a> Link (kaitan/rujukan)
<table> Tabel
<!-- --> Komentar
<frame>,<frameset>,<iframe> Frame (bingkai)
<form> Formulir isian
<input>,<textarea>,<select> Komponen isian pada formulir
<map> Link berdasar area pada gambar
<span>,<div> Pengelompokan elemen dokumen
Pengaturan paragraph
Tag <p>, Digunakan untuk pindah alinea atau membuat paragraf baru. Tag ini bisa diberi
akhiran </P> tapi juga bisa tidak diberi. Dalam tag ini juga bisa digunakan untuk mengatur
perataan kiri, tengah, kanan dan kiri-kanan, yaitu dengan attribut ALIGN. Attribut align
mempunyai nilai: LEFT, RIGHT, CENTER dan JUSTIFY
ATRIBUT FUNGSI
align Merupakan posisi vertikal garis pemisah. Nilainya adalah LEFT, RIGHT,
atau CENTER
width Digunakan untuk menentukan ketebalan garis.
size Digunakan untuk menentukan panjang garis dalam satuan pixel.
noshade Menonaktifkan efek tiga dimensi.
color Menentukan warna garis batas.
SMK NEGERI 1 TRENGGALEK
17
Contoh (Save dengan nama horisontal.html) :
<html> <head> <title>Membuat Garis Horisontal</title> </head>
<body bgcolor=#fffccc>
<font size=1 Face=Tahoma color=blue>Ahlan Wa Sahlan</font> <hr size=1 width=150
align=left>
<h1><center>www.smk-mediainformatika.sch.id</h1>
<hr size=5 align=center noshade>
</body>
</html>
Tag <hn>. <Hn>..</Hn>
Digunakan untuk mengatur ukuran huruf pada header. "n" mempunyai nilai antara 1 - 6 atau
antara <H1> sampai <H6>, dengan <H1> merupakan ukuran terbesar dan <H6> merupakan
ukuran terkecil.
Contoh (Save dengan nama hn.html) :
<html>
<head> <title>Membuat Heading Dokumen HTML</title> </head>
<body bgcolor=#000000 text=#FFFFFF>
<h1>Headng Tingkat 1 </h1>
<h2>Headng Tingkat 2 </h2>
<h3>Headng Tingkat 3 </h3>
<h4>Headng Tingkat 4 </h4>
<h5>Headng Tingkat 5 </h5>
<h6>Headng Tingkat 6 </h6>
</body>
</html>
Tag <pre>, membuat tampilan dokumen HTML pada browser sama dengan tampilan pada teks
editor. Dengan tag <pre>, maka tag <p> dan tag <br> jadi tidak diperlukan lagi.
Contoh (Save dengan nama free.html):
<html>
<head> <title> Web Sederhana </title> </head>
<body>
<pre>
Tampilan ini sma dengan tampilan di teks editor. klasemen
Team Main Menang Seri Kalah
==============================================
Team A 3 2 1 0
Team B 3 2 0 1
Team C 3 1 1 1
==============================================
kode program : for i = 1 to 10
For j = 1 to 5
A(i,j)=i*j
next
next
</pre>
</body>
</html>
SMK NEGERI 1 TRENGGALEK
18
LIST
Daftar/list adalah merupakan kumpulan teks yang disusun sedemikian rupa sehingga item-item
yang ada memiliki nomor urut atau bisa juga berupa tanda-tanda khusus/symbol. Ada dua
macam daftar, yaitu UNORDERED lists (ul) dan ORDERED lists (ol).
tag untuk membuat daftar item tidak berurut
Disc : Bulatan hitam ()
Square : Kotak ()
Circle : Bulatan kosong ()
Contoh (Save dengan nama unordered.html):
<html>
<head>
<title>Order List (numbering)</title>
<head>
<body>
<ol type=" I ">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ol>
<br>
<ol type="1">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ol>
<br>
<ol type="A">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ol>
<br>
<ol type="a">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ol>
<br>
<ol type="i">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ol>
</body>
</html>
SMK NEGERI 1 TRENGGALEK
19
1 : Angka latin
A : Huruf A
a : Huruf a
I : Angka romawi
Contoh (Save dengan nama ordered.html):
<html>
<head>
<title>Unorder (bullet)</title>
<head>
<body>
<ul type="disc">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ul>
<br>
<ul type="square">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ul>
<br>
<ul type="circle">
<li>Urutan 1</li>
<li>Urutan 2</li>
<li>Urutan 3</li>
</ul>
</body>
</html>
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
SMK NEGERI 1 TRENGGALEK
20
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
45 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai jenis format teks dan hasilnya terhadap halaman
web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang tanyangan atau paparan
Berbagai tampilan format teks pada halaman web
penerapan format teks yang sesuai dari suatu halaman
web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
Berbagai tampilan format teks pada halaman web
penerapan format teks yang sesuai dari suatu halaman
web
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang hubungan antara format teks dengan halaman
web yang dihasilkan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang kemiripan hasil penerapan format teks dengan
halaman web aslinya
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang penerapan format teks pada halaman web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
450 Menit
SMK NEGERI 1 TRENGGALEK
21
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah penerapan prosedur hubungan
antara format tabel dengan tampilannya pada halaman
web
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah dalam penerapan prosedur
format tabel untuk mendapatkan desain layout halaman
web yang sesuai
o Siswa mencoba membuat laporan hasil observasi tentang
penerapan format tabel pada halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang, pemecahan masalah
menggunakan percobaan berbagai format tabel pada
halaman web kelompok lain merespon atau menanggapi
dengan responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
45 Menit
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
SMK NEGERI 1 TRENGGALEK
22
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami anatomi
dokumen web
Tes
tertulis
Isian Buatlah anatomi dokumen web
Memahami
pemformatan teks dan
paragraph
Tes
tertulis
Isian Jelaskan pemformatan teks dan
paragraph dalam halaman web
Memahami pembuatan
list minimal
Tes
tertulis
Isian Buatlah list minimal halaman web
Memahami pembuatan
list kombinasi
Tes
tertulis
Isian Buatlah list kombinasi halaman web
Soal Tulis
1. Jelaskan fungsi tag <p>
2. Ada 3 macam pengaturan paragraf, sebutkan dan tuliskan tag nya
3. Uraian tentang fungsi heading
4. Jelaskan fungsi tag <pre>
Jawaban
1. Tag <p>, Digunakan untuk pindah alinea atau membuat paragraf baru. Tag ini bisa
diberi akhiran </P> tapi juga bisa tidak diberi. Dalam tag ini juga bisa digunakan untuk
mengatur perataan kiri, tengah, kanan dan kiri-kanan, yaitu dengan attribut ALIGN
2. Rata tengah , tag nya adalah : <p align=center>
Rata kanan, tag nya adalah : <p align=right>
Rata kiri, tag nya adalah : < p align =left>
3. Tag <hn>. <Hn>..</Hn>
Digunakan untuk mengatur ukuran huruf pada header. "n" mempunyai nilai antara 1 - 6
atau antara <H1> sampai <H6>, dengan <H1> merupakan ukuran terbesar dan <H6>
merupakan ukuran terkecil.
4. Tag <pre>, membuat tampilan dokumen HTML pada browser sama dengan tampilan
pada teks editor. Dengan tag <pre>, maka tag <p> dan tag <br> jadi tidak diperlukan
lagi.
SMK NEGERI 1 TRENGGALEK
23
Tes Praktek
Jawab
<html>
<head>
<title>tugas 3 </title>
</head>
<body>
<p align=center>mengatur paragraf <br>
<p align=left> pengaturan paragraf adalah <br>
salah satu hal yang perlu dilakukan agar paragraf tersusun rapi <br>
<p align=center> ada beberapa pilihan pengaturan, yaitu:<br>
<p align=right> rata kanan </p>
</body>
</html>
Pedoman Penskoran
1.Soal nomor 1 sampai 4
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
SMK NEGERI 1 TRENGGALEK
24
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkomu
nikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
25
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai
pemecahan masalah
menggunakan berbagai format teks
3. Struktur/logika penulisan disusun
dengan jelas sesuai metode yang
dipakai
4. Bahasa yang digunakan sesuai
EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang
ditetapkan(Kertas,Spasi, Font)
8. Kerapihan ketikan sesuai dengan
SOP
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (24)
Skor perolehan
Skor Maksimal (32)
SMK NEGERI 1 TRENGGALEK
26
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai
dengan unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu
penyelesaian tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
27
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
28
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
29
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
30
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/1
Alokasi Waktu : 16 x 45 menit
Aspek/mater pokok : Format Tabel Halaman Web
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.3 Memahami format tabel pada halaman web
4.3 Menyajikan tabel pada halaman web
C. Indikator Pencapain Kompetensi
Memahami anatomi tabel minimal
Memahami tabel dengan spanning
Memahami tabel di dalam table
Memahami desain halaman web dengan konsep tabel
SMK NEGERI 1 TRENGGALEK
31
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami anatomi tabel minimal
Selama dan setelah proses pembelajaran, siswa memahami tabel dengan spanning
Selama dan setelah proses pembelajaran, siswa memahami tabel di dalam table
Selama dan setelah proses pembelajaran, siswa memahami desain halaman web
dengan konsep tabel
E. Materi Pembelajaran
Anatomi tabel minimal
Tabel dengan spanning
Tabel di dalam table
Desain halaman web dengan konsep tabel
Menggunakan Table
Table merupakan cara untuk menampilkan informasi dalam halaman web dengan bentuk kolom
dan baris.
Terdapat tiga tag atau elemen utama yang digunakan dalam pembuatan table, yaitu:
<table>, <tr>, dan <td>.
Yang perlu diingat adalah bahwa tag <tr> dan <td> harus terletak di antara tag <table> dan
</table>.
1. <table>
Digunakan untuk mendefinisikan pembuatan tabel. Memiliki attribut:
- perataan: rata kiri (left), tengah (center) atau kanan (right).
mengatur bentuk perataan secara vertikal
mengatur warna latar belakang (background) dari tabel.
menentukan gambar yang digunakan sebagai background tabel
Untuk mengatur warna suatu sel dalam tabel
menentukan ukuran border tabel (dalam pixel).
menggabungkan beberapa baris
menggabungkan beberapa kolom
- jarak antara isi cell dengan batas cell (dalam pixel).
mengatur spasi/jarak antar cell (dalam pixel).
menentukan lebar tabel dalam pixel atau percent.
Menentukan tinggi tabel
2. <tr>
Tag ini digunakan untuk membuat baris baru (pada tabel). Terdiri dari atribut:
- perataan: rata kiri (left), tengah (center) atau kanan (right).
- warna latar belakang dari baris.
- perataan vertikal: top, middle atau bottom.
3. <td>
Tag ini digunakan untuk membuat kolom baru pada tabel. Attributnya adalah:
untuk menentukan perataan kolom
untuk menentukan image yang digunakan sebagai latar belakang dari
kolom.
untuk menentukan warna latar belakang
SMK NEGERI 1 TRENGGALEK
32
- lihat gambar contoh
untuk mengatur ukuran tinggi cell dalam pixels.
untuk membuat supaya isi dari kolom tetap berada pada satu baris.
- lihat gambar contoh
untuk mengatur perataan vertikal: top, middle atau bottom.
untuk menentukan lebar kolom dalam pixel atau percen.
Contoh (save dengan nama tabel1.html ):
<html>
<head> <title>Pembuatan Table</title>
</head>
<body>
<font face=arial size=2 color=tahoma">
<table>
<tr>
<td>Ini contoh tabel sederhana tanpa border</td>
</tr>
</table>
<p>
<table border=1>
<tr>
<td>Ini contoh tabel sederhana dengan border</td>
</tr>
</table>
<p>
<table border=1>
<tr>
<td>No.</td>
<td>Nama</td>
<td>Alamat</td>
</tr>
<tr>
<td>1.</td>
<td>Wahyu</td>
<td>Bekasi</td>
</tr>
<tr>
<td>2.</td>
<td>Lesmono</td>
<td>Kranji</td>
</tr>
</table>
</body>
</html>
Menambahkan Judul Tabel
Judul dalam tabel dibedakan menjadi tiga macam, yaitu
judul tabel,
judul kolom table dan
SMK NEGERI 1 TRENGGALEK
33
judul baris tabel.
Judul tabel atau biasa disebut CAPTION terletak dibagian luar tabel yang bisa berada dibawah
atau diatas tabel. Secara default caption diletakkan dibagian atas suatu tabel, tetapi juga dapat
diletakkan dibawah suatu tabel dengan menambahkan atribut ALIGN=BOTTOM pada elemen
caption tersebut.
Judul kolom atau judul baris dibuat dengan elemen yang sama yaitu elemen TABLE HEADER
<TH>.
Judul kolom terletak pada sel disebelah kiri atau kolom pertama suatu tabel, sedangkan judul
baris terletak pada baris pertama suatu tabel. Judul baris atau judul kolom akan tercetak tebal.
Contoh:
<html>
<head> <title>Pembuatan Table</title>
</head>
<body>
<font face=arial size=2 color=maroon>
<table border=1>
<caption align=top><b><u>Daftar Alamat</u></b></caption>
<p>
<table border=1>
<tr>
<td>Ini contoh tabel sederhana dengan border</td>
</tr>
</table>
<p>
<table border=1>
<tr>
<td>No.</td>
<td>Nama</td>
<td>Alamat</td>
</tr>
<tr>
<td>1.</td>
<td>Wahyu</td>
<td>Bekasi</td>
</tr>
<tr>
<td>2.</td>
<td>Lesmono</td>
<td>Kranji</td>
</tr>
</table>
</body>
</html>
Mengatur Lebar dan Tinggi Suatu Tabel
Lebar tabel diatur dengan menggunakan atribut WIDTH dan untuk mengatur tinggi table
dengan atribut HEIGHT.
Jika atribut WIDTH dan HEIGHT digunakan dalam elemen TABLE nilainya menunjukkan
lebar dan tinggi tabel terhadap BROWSER sedangkan
SMK NEGERI 1 TRENGGALEK
34
jika digunakan pada elemen TH dan TD, nilainya merupakan lebar dan tinggi dari suatu
tabel.
Nilai atribut mengunakan ukuran % (max 100%) dan ukuran pixel.
Contoh:
<html>
<head> <title>Mengatur Lebar dan Tinggi Tabel</title>
</head>
<body>
<font face=arial size=2 color=tahoma>
<table border=1 width=100%>
<caption align=top><b><u>Daftar Alamat</u></b></caption>
<tr>
<th width=40>No.</td>
<th width=150>Nama</td>
<th width=200>Alamat</td>
</tr>
<tr>
<td align=center>1.</td>
<td height=50>Wahyu</td>
<td height=50>Bekasi</td>
</tr>
</table>
</body>
</html>
Perataan dalam Tabel
Perataan dalam tabel dikenal dua macam, yaitu perataan secara horizontal dengan
atribut ALIGN dan perataan vertikal dengan atribut VALIGN, serta untuk membuat suatu tabel
posisinya menjadi ditengah-tengah layar browser.
Contoh:
<html>
<head> <title>Mengatur Lebar dan Tinggi Tabel</title>
</head>
<body>
<font face=arial size=2 color=tahoma>
<table border=1 width=100%>
<caption align=top><b><u>Daftar Alamat</u></b></caption>
<tr>
<th width=40>No.</td>
<th width=150>Nama</td>
<th width=200>Alamat</td>
</tr>
<tr>
<td align=center>1.</td>
<td height=50 align="center">Wahyu</td>
<td height=50>Bekasi</td>
SMK NEGERI 1 TRENGGALEK
35
</tr>
</table>
</body>
</html>
Membuat Warna Pada Tabel
Didalam pewarnaan tabel kita dapat mengatur warna latar belakang dan teks serta warna
bordernya.
Untuk menentukan warna latar belakang pada suatu tabel, gunakan atribut BGCOLOR
sedangkan untuk warna border dapat menggunakan beberapa atribut sbb:
Contoh:
<html>
<head> <title>Mengatur Lebar dan Tinggi Tabel</title>
</head>
<body>
<font face=arial size=2 color=tahoma>
<table border=1 width=100%>
<caption align=top><b><u>Daftar Alamat</u></b></caption>
<tr>
<th width=40 bgcolor="blue"> No.</td>
<th width=150>Nama</td>
<th width=200 bgcolor="yellow">Alamat</td>
</tr>
<tr>
<td align=center>1.</td>
<td height=50 align="center"> Wahyu</td>
<td height=50>Bekasi</td>
</tr>
</table>
</body>
</html>
SMK NEGERI 1 TRENGGALEK
36
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
60 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
Berbagai jenis format tabel dan hasilnya terhadap
halaman web
Desain layout dalam format tabel untuk suatu halaman
web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang tanyangan atau paparan berbagai
Berbagai jenis format tabel dan hasilnya terhadap
halaman web
Desain layout dalam format tabel untuk suatu halaman
web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai
600 Menit
SMK NEGERI 1 TRENGGALEK
37
Berbagai jenis format tabel dan hasilnya terhadap
halaman web
Desain layout dalam format tabel untuk suatu halaman
web
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang berbagai jenis format tabel dan hasilnya terhadap
halaman web
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang desain layout dalam format tabel untuk suatu
halaman web
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang penerapan menyimpulkan penerapan format tabel
pada halaman web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format tabel dan
hasilnya terhadap halaman web
o Siswa memperlihatkan sikap cermat dan teliti dalam
dalam menyelesaikan masalah desain layout dalam
format tabel untuk suatu halaman web
o Siswa mencoba membuat laporan hasil observasi tentang
penerapan format tabel pada halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan format tabel pada
halaman web, kelompok lain merespon atau menanggapi
dengan responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
60 Menit
SMK NEGERI 1 TRENGGALEK
38
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami anatomi
tabel minimal
Tes
tertulis
Isian Buatlah anatomi tabel minimal
Memahami tabel
dengan spanning
Tes
tertulis
Isian Jelaskan membuat langkah tabel
dengan spanning
Memahami tabel di
dalam table
Tes
tertulis
Isian Jelaskan membuat tabel di dalam
table
Memahami desain
halaman web dengan
konsep tabel
Tes
tertulis
Isian Rancanglah desain halaman web
dengan konsep tabel
Soal Tulis
1. Jelaskan fungsi tag<tr> dan tag <td> pada tabel.
2. Jelaskan perbedaan perintah Caption dan TH pada tabel.
3. Uraikan cara membuat background warna pada tabel
Jawaban
1. <tr>
Tag ini digunakan untuk membuat baris baru (pada tabel). Terdiri dari atribut:
- perataan: rata kiri (left), tengah (center) atau kanan (right).
- warna latar belakang dari baris.
- perataan vertikal: top, middle atau bottom.
<td>
Tag ini digunakan untuk membuat kolom baru pada tabel
2. Judul tabel atau biasa disebut CAPTION terletak dibagian luar tabel yang bisa berada
dibawah atau diatas tabel. Secara default caption diletakkan dibagian atas suatu tabel,
tetapi juga dapat diletakkan
SMK NEGERI 1 TRENGGALEK
39
Judul kolom atau judul baris dibuat dengan elemen yang sama yaitu elemen TABLE
HEADER <TH>.
3. Didalam pewarnaan tabel kita dapat mengatur warna latar belakang dan teks serta
warna bordernya.
Untuk menentukan warna latar belakang pada suatu tabel, gunakan atribut BGCOLOR
Contoh: <th width=40 bgcolor="blue"> No.</td>
Tes Praktek
Tulislah html dibawah ini
Jawab
<html>
<head> <title>Mengatur Lebar dan Tinggi Tabel</title>
</head>
<body>
<font face=arial size=2 color=tahoma>
<table border=1 width=100%>
<caption align=top><b><u>Daftar Alamat</u></b></caption>
<tr>
<th width=40 bgcolor="blue"> No.</td>
<th width=150>Nama</td>
<th width=200 bgcolor="yellow">Alamat</td>
</tr>
<tr>
<td align=center>1.</td>
<td height=50 align="center"> Wahyu</td>
<td height=50>Bekasi</td>
</tr>
</table>
</body>
</html>
SMK NEGERI 1 TRENGGALEK
40
Pedoman Penskoran
1.Soal nomor 1 sampai 4
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkom
unikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
41
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai penerapan
format tabel pada halaman web
3. Struktur/logika penulisan disusun dengan
jelas sesuai metode yang dipakai
4. Bahasa yang digunakan sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang ditetapkan (Kertas,
Spasi, Font)
8. Kerapihan ketikan sesuai dengan SOP
Jumlah
Skor perolehan
Skor Maksimal (24)
SMK NEGERI 1 TRENGGALEK
42
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai
dengan unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu
penyelesaian tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (32)
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
43
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
44
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
45
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
46
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/1
Alokasi Waktu : 16 x 45 menit
Aspek/mater pokok : Multimedia pada Halaman Web
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.4 Memahami tampilan format multimedia pada halaman web
4.4 Menyajikan tampilan format multimedia pada halaman web
C. Indikator Pencapain Kompetensi
Memahami format tampilan gambar
Memahami format tampilan file audio
SMK NEGERI 1 TRENGGALEK
47
Memahami format tampilan file video dan animasi
Memahami format tampilan gambar dengan map
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami format tampilan gambar
Selama dan setelah proses pembelajaran, siswa memahami format tampilan file audio
Selama dan setelah proses pembelajaran, siswa memahami format tampilan file video
dan animasi
Selama dan setelah proses pembelajaran, siswa memahami format tampilan gambar
dengan map
E. Materi Pembelajaran
Format tampilan gambar
Format tampilan file audio
Format tampilan file video dan animasi
Format tampilan gambar dengan map
Element gambar ( Element img)
Element IMG befungsi untuk menampilkan gambar. Element ini tidak mempunyai tag penutup
dan mempunyai
attribute yaitu:
align, alt (teks alternatif jika gambar tidak tampil),
border, height, width, hspace (jarak kosong posisi horizontal,
vspace (jarak kosong posisi vertikal), src (lokasi dari gambar itu disimpan beserta nama filenya).
Sintaks:
<img align="left"|"right"|"top"|"middle"|"bottom"
alt="text"
border="pixel"
width="pixel"|"%"
height="pixel"|"%"
hspace="pixel"
vspace="pixel"
src="uri">
Latihan 1:
Tampilkan gambar image027.jpg dengan ukuran width dan height 160pixel dan border 8pixel :
Nama file: latihan5_1.html
<html>
<head>
<title>Latihan5-1</title>
</head>
<body>
<font color=blue font face=arial><h1>kenangan
waktu dijtm park</h1></font> <br>
<img width="160" height="160" src="image027.jpg">
</body>
</html>
SMK NEGERI 1 TRENGGALEK
48
Tugas tambahan:
Letakkan gambar tersebut ke kanan, setelah itu ke kiri.
Latihan 2:
Dari Latihan 1 ubah gambar menjadi yang terdapat dalam direktori /images dengan nama
image050.jpg
Nama file: latihan5_2.html
<html>
<head>
<title>Latihan5-1</title>
</head>
<body>
<img width="160" height="160" src="./images/image050.jpg">
</body>
</html>
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
60 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai tampilan format multimedia pada halaman web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang tanyangan atau paparan berbagai berbagai
tampilan format multimedia pada halaman web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai
600 Menit
SMK NEGERI 1 TRENGGALEK
49
Format tampilan gambar
Format tampilan file audio
Format tampilan file video dan animasi
Format tampilan gambar dengan map
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang berbagai berbagai tampilan format multimedia
pada halaman web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format tampilan
gambar
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format tampilan
file audio
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format tampilan
file video dan animasi
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format tampilan
gambar dengan map
o Siswa mencoba membuat laporan hasil observasi tentang
berbagai tampilan format multimedia pada halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan berbagai
tampilan format multimedia pada halaman web ,
kelompok lain merespon atau menanggapi dengan
responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
60 Menit
SMK NEGERI 1 TRENGGALEK
50
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami format
tampilan gambar
Tes
tertulis
Isian Jelaskan langkah-langkah format
tampilan gambar
Memahami format
tampilan file audio
Tes
tertulis
Isian Jelaskan langkah-langkah format
tampilan file audio
Memahami format
tampilan file video
dan animasi
Tes
tertulis
Isian Jelaskan langkah-langkah format
tampilan file video dan animasi
Memahami format
tampilan gambar
dengan map
Tes
tertulis
Isian Jelaskan langkah-langkah format
tampilan gambar dengan map
Soal Tulis
1. Apa yang kamu ketahui tentang tag < img src=image1>
2. Sebutkan 3 atribut elemen image
3. Tuliskan sintag penulisan image pada html
Jawaban
1. Element IMG befungsi untuk menampilkan gambar. Element ini tidak mempunyai tag
penutup dan mempunyai
2. attribute yaitu:
align, alt (teks alternatif jika gambar tidak tampil),
border, height, width, hspace (jarak kosong posisi horizontal,
vspace (jarak kosong posisi vertikal), src (lokasi dari gambar itu disimpan beserta nama
filenya).
3. Sintaks:
<img align="left"|"right"|"top"|"middle"|"bottom"
SMK NEGERI 1 TRENGGALEK
51
alt="text"
border="pixel"
width="pixel"|"%"
height="pixel"|"%"
hspace="pixel"
vspace="pixel"
src="uri">
Tes Praktek
Jawaban
<html>
<head>
<title>
latihan gambar
</title>
</head>
<body>
<p align="right">
<font color="blue"><font size="28">Buat program berikut dlm waktu 1 jp </font></p>
<hr>
<center>
<font color="red"><h1>ULANGAN PRAKTEK MULTIMEDIA 2</h1>
<font color="green"><h2>ULANGAN PRAKTEK MULTIMEDIA 2</h2>
<font color="yellow"><h3>ULANGAN PRAKTEK MULTIMEDIA 2</h3>
<font color="red"><h4>ULANGAN PRAKTEK MULTIMEDIA 2</h4>
<br>
<p align="left">
<img src="DSC_1626.jpg" width="300" height="200">
<img src="DSCN1692.JPG" width="300" height="200"> </p>
<p align="left">nama file gambar 1.jpg ********************************nama file gambar 2.jpg
</body>
</html>
SMK NEGERI 1 TRENGGALEK
52
Pedoman Penskoran
1.Soal nomor 1 sampai 4
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkom
unikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
53
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai penerapan
berbagai tampilan format multimedia
pada halaman web
3. Struktur/logika penulisan disusun
dengan jelas sesuai metode yang
dipakai
4. Bahasa yang digunakan sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang ditetapkan (Kertas,
Spasi, Font)
8. Kerapihan ketikan sesuai dengan SOP
Jumlah
Skor perolehan
Skor Maksimal (24)
SMK NEGERI 1 TRENGGALEK
54
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai dengan
unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu penyelesaian
tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (32)
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
55
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
56
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
57
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
58
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/1
Alokasi Waktu : 16 x 45 menit
Aspek/mater pokok : Hyperlink Halaman Web
A. Kompetensi Inti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.5 Memahami format kaitan pada halaman web
4.5 Menyajikan format kaitan pada halaman web
C. Indikator Pencapain Kompetensi
Memahami anatomi link
Memahami format link antar isi pada satu halaman web
Memahami format link antar halaman web untuk membentuk sitemap
Memahami format target link, email dan telepon
SMK NEGERI 1 TRENGGALEK
59
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami anatomi link
Selama dan setelah proses pembelajaran, siswa memahami format link antar isi pada
satu halaman web
Selama dan setelah proses pembelajaran, siswa memahami format link antar halaman
web untuk membentuk sitemap
Selama dan setelah proses pembelajaran, siswa memahami format target link, email
dan telepon
E. Materi Pembelajaran
Anatomi link
Format link antar isi pada satu halaman web
Format link antar halaman web untuk membentuk sitemap
Format target link, email dan telepon
Menggunakan Link
Link merupakan suatu gambar atau teks yang terkait dengan suatu alamat tertentu. Jika Link
diklik maka dokumen HTML akan menuju ke alamat tersebut. Ditandai dengan Anchor, yaitu tag
<a>.
Tag <a> mempunyai dua atribut, yaitu href dan name.
Atribut href digunakan jika sebuah anchor akan digunakan sebagai link,
sedangkan atribut name digunakan jika anchor akan digunakan sebagai tujuan.
Link ke dokumen lain
Untuk membuat link/penghubung dengan target ke dokumen/halaman yang berbeda, anda
harus membuat dokumen yang dituju/target dan disimpan dalam direktori tertentu, baik pada
direktori yang sama atau berbeda dengan dokumen yang aktif sekarang. Untuk mencoba kita
akan membuat 3 file yang saling berhubungan. Sebelumnya supaya file-file yang dibuat terlihat
rapi kita buat folder tabel terlebih.
dahulu jadi nanti file link yang kita buat tersimpan di dalam folder tabel.
Contoh link-utama.html
<html>
<head> <title> Halaman Utama </title>
</head>
<body>
<h2> Ini adalah halaman utama.</h2>
<ul>
<li><a href=link-utama.html>Klik, ke halaman utama.</a></li>
<li><a href=link-satu.html>Klik, ke halaman satu.</a></li>
<ul>
</body>
</html>
Contoh link.hal1.html
<html>
<head> <title> Halaman Satu </title>
</head>
<body>
<h2> Ini adalah halaman utama.</h2>
<ul>
SMK NEGERI 1 TRENGGALEK
60
<li><a href=link-utama.html>Klik, ke halaman utama.</a></li>
<li><a href=link-satu.html>Klik, ke halaman satu.</a></li>
<ul>
</body>
</html>
Link ke bagian tertentu dalam dokumen yang sama
Untuk membuat link ke bagian tertentu dalam dokumen yang sama, harus diberikan nama
anchor. Perbedaan dengan link yang berbeda dokumen adalah tujuan/target link, jika dalam
dokumen yang sama yang dituju adalah nama anchor tetapi kalau dokumen yang beda yang
dituju adalah nama file/dokumen yang bersangkutan. Untuk memberi nama anchor, atribut yang
dipakai adalah NAME pada tag anchor <A> dan untuk membuat link cukup memberikan tanda #
setelah nama file dalam URL. Misal: <a href=#php> Bab 1 </a> atau dapat ditulis lengkap: <a
href=belajar_php.html#php> Bab 1 </a> dan untuk nama anchornya: <a name=php>Ada apa
dengan PHP?</a>
Link ke alamat URL atau Website
Contoh: buatlah link sehingga hasil nya sbb:
Untuk membuat link ke alamat URL adalah dengan menambahkan: http://nama_URL.
Contoh:
<a href=http://www.dikti.org>www.dikti.org</a>
<a href=http://www.smkn1-kbks.com>www.smkn1-kbks.com</a>
Jawab:
<html>
<head>
<title>Latihan6-1</title>
</head>
<body>
Link:
<ol>
<li><a href="http://www.yahoo.com">yahoo</a></li>
<li><a href="http://www.google.com">google</a></li>
<li><a href="http://www.tienythea.wordpress.com">materi</a></li>
</ol>
</body>
</html>
Link ke Alamat Email
Link email adalah membuat link pada teks, jika teks tersebut diklik maka akan menampilkan
program pengiriman email yang terdapat pada komputer yang dipakai untuk mengakses data
atau teks tersebut secara otomatis. Untuk membuat link ke alamat email hanya menambahkan
atribut mailto:alamat_email ke dalam tag <a href> Misalnya: <a href="mailto:smkn1-
kbks.yahoo.com">Kirim email</a>
SMK NEGERI 1 TRENGGALEK
61
Link File yang akan didownload
Link file dalam hal ini adalah apabila dikik pada teks tersebut maka proses selanjutnya adalah
mendownload file yang tercantum pada dokumen tersebut. Format penulisannya adalah <a
href=nama_file> Misal: <a href=antivirus.zip>Download anti virus</a> <a
href=latihan.doc>Download latihan Html</a> <a href=mysql.exe>Download MYSQL</a>
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
60 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai tampilan jenis link dan hasilnya terhadap
halaman web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang tanyangan atau paparan berbagai tampilan jenis
link dan hasilnya terhadap halaman web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai
Anatomi link
Format link antar isi pada satu halaman web
Format link antar halaman web untuk membentuk
sitemap
Format target link, email dan telepon
600 Menit
SMK NEGERI 1 TRENGGALEK
62
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang berbagai jenis link dan hasilnya terhadap
halaman web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai anatomi link
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai format link antar isi
pada satu halaman web
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format link antar
halaman web untuk membentuk sitemap
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai jenis format target link,
email dan telepon
o Siswa mencoba membuat laporan hasil observasi tentang
berbagai jenis link dan hasilnya terhadap halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan berbagai jenis
link dan hasilnya terhadap halaman web, kelompok lain
merespon atau menanggapi dengan responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
60 Menit
SMK NEGERI 1 TRENGGALEK
63
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami anatomi
link
Tes
tertulis
Isian Jelaskan tentang anatomi link
Memahami format
link antar isi pada
satu halaman web
Tes
tertulis
Isian Jelaskan langkah-langkah format link
antar isi pada satu halaman web
Memahami format
link antar halaman
web untuk
membentuk sitemap
Tes
tertulis
Isian Jelaskan langkah-langkah format link
antar halaman web untuk membentuk
sitemap
Memahami format
target link, email dan
telepon
Tes
tertulis
Isian Jelaskan langkah-langkah format
target link, email dan telepon
SMK NEGERI 1 TRENGGALEK
64
Tes Praktek
Jawaban
<html>
<head>
<title>Latihan6-2</title>
</head>
<body>
Link internal dan anchor adalah link yang menunjuk ketempat yang ada
dalam dokument ini.<br>
<a href="#akhir">kebagian akhir</a>
<a name="pertama"></a>
<p>Ini adalah teks bagian pertama dalam dokumen ini.<br>
Ini adalah teks bagian pertama dalam dokumen ini.<br>
Ini adalah teks bagian pertama dalam dokumen ini.<br>
Ini adalah teks bagian pertama dalam dokumen ini.<br>
Ini adalah teks bagian pertama dalam dokumen ini.<br>
Ini adalah teks bagian pertama dalam dokumen ini.<br>
Ini adalah teks bagian pertama dalam dokumen ini. </p>
<p>Ini adalah teks bagian kedua dalam dokumen ini.<br>
Ini adalah teks bagian kedua dalam dokumen ini.<br>
Ini adalah teks bagian kedua dalam dokumen ini.<br>
Ini adalah teks bagian kedua dalam dokumen ini.<br>
SMK NEGERI 1 TRENGGALEK
65
Ini adalah teks bagian kedua dalam dokumen ini.<br>
Ini adalah teks bagian kedua dalam dokumen ini.<br>
Ini adalah teks bagian kedua dalam dokumen ini.</p>
<p>Ini adalah teks bagian ketiga dalam dokumen ini.<br>
Ini adalah teks bagian ketiga dalam dokumen ini.<br>
Ini adalah teks bagian ketiga dalam dokumen ini.<br>
Ini adalah teks bagian ketiga dalam dokumen ini.<br>
Ini adalah teks bagian ketiga dalam dokumen ini.<br>
Ini adalah teks bagian ketiga dalam dokumen ini.<br>
Ini adalah teks bagian ketiga dalam dokumen ini.</p>
<p>Ini adalah teks bagian keempat dalam dokumen ini.
Ini adalah teks bagian keempat dalam dokumen ini.<br>
Ini adalah teks bagian keempat dalam dokumen ini.<br>
Ini adalah teks bagian keempat dalam dokumen ini.<br>
Ini adalah teks bagian keempat dalam dokumen ini.<br>
Ini adalah teks bagian keempat dalam dokumen ini.<br>
Ini adalah teks bagian keempat dalam dokumen ini.</p>
<p>Ini adalah teks bagian kelima dalam dokumen ini.<br>
Ini adalah teks bagian kelima dalam dokumen ini.<br>
Ini adalah teks bagian kelima dalam dokumen ini.<br>
Ini adalah teks bagian kelima dalam dokumen ini.<br>
Ini adalah teks bagian kelima dalam dokumen ini.<br>
Ini adalah teks bagian kelima dalam dokumen ini.<br>
Ini adalah teks bagian kelima dalam dokumen ini.</p>
<a name="akhir"></a>
<p>Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.
Ini adalah teks bagian keenam dalam dokumen ini.</p>
<a href="#pertama">kebagian pertama</a>
</body>
</html>
Pedoman Penskoran
1.Soal nomor 1 sampai 4
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
SMK NEGERI 1 TRENGGALEK
66
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkom
unikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
67
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai
penerapan berbagai jenis
link dan hasilnya terhadap
halaman we
3. Struktur/logika penulisan
disusun dengan jelas
sesuai metode yang dipakai
4. Bahasa yang digunakan
sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang
ditetapkan (Kertas, Spasi,
Font)
8. Kerapihan ketikan sesuai
dengan SOP
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (24)
Skor perolehan
Skor Maksimal (32)
SMK NEGERI 1 TRENGGALEK
68
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai dengan
unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu penyelesaian
tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
69
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
70
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
71
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
72
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/2
Alokasi Waktu : 16 x 45 menit
Aspek/mater pokok : Formulir Halaman Web
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.6 Memahami format formulir pada halaman web
4.6 Menyajikan formulir pada halaman web
C. Indikator Pencapain Kompetensi
Memahami anatomi dan cara kerja form
Memahami format formulir
SMK NEGERI 1 TRENGGALEK
73
Memahami komponen entri teks (input teks password, dan input multiline) pada formulir
halaman web
Memahami komponen entri pilihan (input file, radio, checkbox, select dan datalist) pada
formulir halaman web
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami anatomi dan cara kerja
form
Selama dan setelah proses pembelajaran, siswa memahami format formulir
Selama dan setelah proses pembelajaran, siswa memahami komponen entri teks (input
teks password, dan input multiline) pada formulir halaman web
Selama dan setelah proses pembelajaran, siswa memahami komponen entri pilihan
(input file, radio, checkbox, select dan datalist) pada formulir halaman web
E. Materi Pembelajaran
Anatomi dan cara kerja form
Format formulir
Komponen entri teks (input teks password, dan input multiline) pada formulir halaman
web
Komponen entri pilihan (input file, radio, checkbox, select dan datalist) pada formulir
halaman web
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
60 Menit
SMK NEGERI 1 TRENGGALEK
74
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai jenis format formulir dan tampilannya terhadap
halaman web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang berbagai tampilan format formulir dan komponen-
komponennya pada halaman web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai
Jenis format formulir
Komponen-komponen pada formulir
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang berbagai tampilan format formulir dan
komponen-komponennya pada halaman web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai Jenis format formulir
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah berbagai Komponen-komponen
pada formulir
o Siswa mencoba membuat laporan hasil observasi tentang
berbagai jenis tampilan format formulir dan komponen-
komponennya pada halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan berbagai jenis
tampilan format formulir dan komponen-komponennya
pada halaman web kelompok lain merespon atau
menanggapi dengan responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
600 Menit
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
60 Menit
SMK NEGERI 1 TRENGGALEK
75
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami anatomi
dan cara kerja form
Tes
tertulis
Isian Jelaskan anatomi dan cara kerja form
Memahami format
formulir
Tes
tertulis
Isian Jelaskan langkah-langkah memformat
formulir
Memahami
komponen entri teks
(input teks
password, dan input
multiline) pada
formulir halaman
web
Tes
tertulis
Isian Sebutkan komponen entri teks (input
teks password, dan input multiline)
pada formulir halaman web
Memahami
komponen entri
pilihan (input file,
radio, checkbox,
select dan datalist)
pada formulir
halaman web
Tes
tertulis
Isian Sebutkan komponen entri pilihan
(input file, radio, checkbox, select dan
datalist) pada formulir halaman web
SMK NEGERI 1 TRENGGALEK
76
Pedoman Penskoran
1.Soal nomor 1 sampai 4
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkomu
nikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
77
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
Skor perolehan
Skor Maksimal (24)
SMK NEGERI 1 TRENGGALEK
78
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai
penerapan format formulir
dan komponen-
komponennya pada
halaman web
3. Struktur/logika penulisan
disusun dengan jelas
sesuai metode yang dipakai
4. Bahasa yang digunakan
sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang
ditetapkan (Kertas, Spasi,
Font)
8. Kerapihan ketikan sesuai
dengan SOP
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (32)
SMK NEGERI 1 TRENGGALEK
79
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai dengan
unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu penyelesaian
tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
80
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
81
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
82
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
83
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/2
Alokasi Waktu : 20 x 45 menit
Aspek/mater pokok : Style Halaman Web
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.7 Memahami style pada halaman web
4.7 Menyajikan style tertentu pada halaman web
C. Indikator Pencapain Kompetensi
Memahami cara kerja dan anatomi cascading style sheet
Memahami style pada teks
Memahami style pada multimedia
SMK NEGERI 1 TRENGGALEK
84
Memahami style pada tabel
Memahami style pada formulir
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami cara kerja dan anatomi
cascading style sheet
Selama dan setelah proses pembelajaran, siswa memahami style pada teks
Selama dan setelah proses pembelajaran, siswa memahami style pada multimedia
Selama dan setelah proses pembelajaran, siswa memahami style pada tabel
Selama dan setelah proses pembelajaran, siswa memahami style pada formulir
E. Materi Pembelajaran
Cara kerja dan anatomi Cascading Style Sheet
Style pada teks
Style pada multimedia
Style pada tabel
Style pada formulir
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
75 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai jenis jenis style dan tampilannya pada halaman
web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
750 Menit
SMK NEGERI 1 TRENGGALEK
85
tentang berbagai tampilan style pada halaman web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai
Jenis style
Penerapan style yang sesuai dari suatu halaman web
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang
Hubungan antara style dengan halaman web yang
dihasilkan
Kemiripan hasil penerapan style dengan halaman web
aslinya
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah penerapan style dengan halaman
web aslinya
o Siswa mencoba membuat laporan hasil observasi tentang
penerapan style pada halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan berbagai jenis
tampilan penerapan style pada halaman web, kelompok
lain merespon atau menanggapi dengan responsif dan
santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
750 Menit
SMK NEGERI 1 TRENGGALEK
86
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami cara
kerja dan anatomi
cascading style
sheet
Tes
tertulis
Isian Jelaskan cara kerja dan anatomi
cascading style sheet
Memahami style
pada teks
Tes
tertulis
Isian Jelaskan mengenai style pada teks
Memahami style
pada multimedia
Tes
tertulis
Isian Jelaskan mengenai style pada
multimedia
Memahami style
pada tabel
Tes
tertulis
Isian Jelaskan mengenai style pada tabel
Memahami style
pada formulir
Jelaskan mengenai style pada
formulir
Soal;
Kunci jawaban
Pedoman Penskoran
1.Soal nomor 1 sampai 5
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawab benar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
SMK NEGERI 1 TRENGGALEK
87
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkomu
nikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
88
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai
penerapan style pada
halaman web
3. Struktur/logika penulisan
disusun dengan jelas
sesuai metode yang dipakai
4. Bahasa yang digunakan
sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang
ditetapkan (Kertas, Spasi,
Font)
8. Kerapihan ketikan sesuai
dengan SOP
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (24)
Skor perolehan
Skor Maksimal (32)
SMK NEGERI 1 TRENGGALEK
89
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai dengan
unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu penyelesaian
tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
90
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
91
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
92
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
93
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/2
Alokasi Waktu : 20 x 45 menit
Aspek/mater pokok : Teknik Pemrograman Halaman Web
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.8 Memahami teknik pemrograman pada halaman web
4.8 Menyajikan teknik-teknik dalam pemrograman web
C. Indikator Pencapain Kompetensi
Memahami anatomi dan cara kerja kode javascript
Memahami dasar pemrograman client (variabel, tipe data, operator)
SMK NEGERI 1 TRENGGALEK
94
Memahami array dimensi 1 dan multidimensi
Memahami struktur kontrol percabangan pada program client
Memahami struktur kontrol perulangan pada program client
Memahami fungsi bawaan dan buatan user pada program client
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami anatomi dan cara kerja
kode javascript
Selama dan setelah proses pembelajaran, siswa memahami dasar pemrograman client
(variabel, tipe data, operator)
Selama dan setelah proses pembelajaran, siswa memahami array dimensi 1 dan
multidimensi
Selama dan setelah proses pembelajaran, siswa memahami struktur kontrol
percabangan pada program client
Selama dan setelah proses pembelajaran, siswa memahami struktur kontrol perulangan
pada program client
Selama dan setelah proses pembelajaran, siswa memahami fungsi bawaan dan buatan
user pada program client
E. Materi Pembelajaran
Anatomi dan cara kerja kode javascript
Dasar pemrograman client (variabel, tipe data, operator)
Array dimensi 1 dan multidimensi
Struktur kontrol percabangan pada program client
Struktur kontrol perulangan pada program client
Fungsi bawaan dan buatan user pada program client
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
75 Menit
SMK NEGERI 1 TRENGGALEK
95
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai
Teknologi pemrograman client pada halaman web
Teknik dasar pemrograman client pada halaman web
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang berbagai teknik dasar pemrograman client pada
halaman web
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai eksperimen pelbagai teknik dasar pemrograman
client pada halaman web
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menganalisa hal-hal terpenting
tentang hubungan antara program client dengan halaman
web
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang penerapan pemrograman pada halaman web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah tentang penerapan pemrograman
pada halaman web
o Siswa mencoba membuat laporan hasil observasi tentang
penerapan pemrograman pada halaman web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan berbagai jenis
tampilan penerapan pemrograman pada halaman web,
kelompok lain merespon atau menanggapi dengan
responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
750 Menit
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
75 Menit
SMK NEGERI 1 TRENGGALEK
96
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami anatomi
dan cara kerja kode
javascript
Tes
tertulis
Isian Jelaskan mengenai anatomi dan cara
kerja kode javascript
Memahami dasar
pemrograman client
(variabel, tipe data,
operator)
Tes
tertulis
Isian Jelaskan mengenai dasar
pemrograman client (variabel, tipe
data, operator)
Memahami array
dimensi 1 dan
multidimensi
Tes
tertulis
Isian Jelaskan mengenai array dimensi 1
dan multidimensi
Memahami struktur
kontrol percabangan
pada program client
Tes
tertulis
Isian Jelaskan mengenai struktur kontrol
percabangan pada program client
Memahami struktur
kontrol perulangan
pada program client
Tes
tertulis
Isian Jelaskan mengenai struktur kontrol
perulangan pada program client
Memahami fungsi
bawaan dan buatan
user pada program
client
Tes
tertulis
Isian Jelaskan mengenai fungsi bawaan
dan buatan user pada program client
SMK NEGERI 1 TRENGGALEK
97
Pedoman Penskoran
1.Soal nomor 1 sampai 6
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkomu
nikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
98
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan mengenai penerapan
pemrograman pada halaman web
3. Struktur/logika penulisan disusun dengan
jelas sesuai metode yang dipakai
4. Bahasa yang digunakan sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang ditetapkan (Kertas,
Spasi, Font)
8. Kerapihan ketikan sesuai dengan SOP
Jumlah
Skor perolehan
Skor Maksimal (24)
SMK NEGERI 1 TRENGGALEK
99
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai
dengan unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu
penyelesaian tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (32)
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
100
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
101
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
102
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total
SMK NEGERI 1 TRENGGALEK
103
RENCANA PELAKSANAAN PEMBELAJARAN
Nama Sekolah : SMK NEGERI 1 TRENGGALEK
Mata Pelajaran : Pemrograman Web
Kelas/Semester : X/2
Alokasi Waktu : 12 x 45 menit
Aspek/mater pokok : Pengolahan Input User
A. KompetensiInti
1. Menghayati dan mengamalkan ajaran agama yang dianutnya
2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggungjawab, peduli (gotong
royong, kerjasama, toleran, damai) santun, responsif dan pro-aktifdan menunjukan sikap
sebagai bagian dari solusi atas berbagai permasalahan dalam berinteraksi secara efektif
dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan
bangsa dalam pergaulan dunia.
3. Memahami, menerapkan, dan menganalisis pengetahuan faktual, konseptual, dan
prosedural berdasarkan rasa ingin tahunya tentang ilmu pengetahuan, teknologi, seni,
budaya, dan humaniora dalam wawasan kemanusiaan, kebangsaan, kenegaraan, dan
peradaban terkait penyebab fenomena dan kejadian dalam bidang kerja yang spesifik
untuk memecahkan masalah.
4. Mengolah, menalar, dan menyaji dalam ranah konkret dan ranah abstrak terkait dengan
pengembangan dari yang dipelajarinya di sekolah secara mandiri, dan mampu
melaksanakan tugas spesifik di bawah pengawasan langsung.
B. Kompetensi Dasar
1.1 Memahami nilai-nilai keimanan dengan menyadari hubungan keteraturan dan
kompleksitas alam dan jagad raya terhadap kebesaran Tuhan yang menciptakannya
1.2 Mendiskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam
1.3 Mengamalkan nilai-nilai keimanan sesuai dengan ajaran agamanya dalam kehidupan
sehari-hari.
2.1 Menunjukkan perilaku ilmiah (memiliki rasa ingin tahu; objektif; jujur; teliti; cermat; tekun;
hati-hati; bertanggung jawab; terbuka; kritis; kreatif; inovatif dan peduli lingkungan) dalam
aktivitas sehari-hari sebagai wujud implementasi sikap dalam melakukan percobaan dan
berdiskusi
2.2 Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud
implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.9 Memahami pengelolaan halaman web menggunakan kode program
4.9 Menyajikan hasil pengelolaan halaman web menggunakan kode program
C. Indikator Pencapain Kompetensi
Memahami akses komponen form (proses dan validasi input)
Memahami navigasi halaman melalui kode program client
Memahami perubahan format style melalui kode progarm client
SMK NEGERI 1 TRENGGALEK
104
D. Tujuan Pembelajaran
Selama dan setelah proses pembelajaran, siswa memahami akses komponen form
(proses dan validasi input)
Selama dan setelah proses pembelajaran, siswa memahami navigasi halaman melalui
kode program client
Selama dan setelah proses pembelajaran, siswa memahami perubahan format style
melalui kode progarm client
E. Materi Pembelajaran
Akses komponen form (proses dan validasi input)
Navigasi halaman melalui kode program client
Perubahan format style melalui kode progarm client
F. Metode Pembelajaran
Pendekatan : Scientific dan PBL
Strategi : Penggalian informasi (Project based learning)
Presentasi
Model pembelajaran : Kooperatif
Metode : Penugasan,tanya jawab,diskusi,demonstrasi,proyek.
G. Kegiatan Pembelajaran
No Aktivitas Alokasi
waktu
Kegiatan Pendahuluan
o Berdoa sebelum pembelajaran
o Mengaitkan materi pembelajaran sekarang dengan
pengalaman peserta didik
o Mengajukan pertanyaan yang ada keterkaitan dengan tema
yang akan dibelajarkan
o Siswa menerima informasi kompetensi, meteri, tujuan,
manfaat, dan langkah pembelajaran yang akan dilaksanakan
o Mengajar peserta didik melakukan kegiatan yang berkaitan
dengan materi
45 Menit
Kegiatan Inti
Eksplorasi
Observing /mengamati
o Siswa mengamati tayangan atau paparan disertai gambar
berbagai pengolahan input user pada formulir melalui
program
Questioning/menanya
o Siswa dengan dibimbing guru diminta untuk bertanya
tentang pengolahan input user pada formulir melalui
program
Mengeksplorasi
o Siswa dibagi beberapa kelompok dan berdiskusi tentang
berbagai eksperimen pengolahan input user pada formulir
450 Menit
SMK NEGERI 1 TRENGGALEK
105
halaman web
o Selama kegiatan diskusi berlangsung guru melakukan
pengamatan sikap dan mencatat semua hal yang terjadi
di kelas
Elaborasi
Mengolah data /Mengasosiasikan
o Dengan diskusi siswa menganalisa hal-hal terpenting
tentang pengolahan input user pada formulir disesuaikan
dengan output yang diharapkan
o Dengan diskusi siswa menyimpulkan hal-hal terpenting
tentang penerapan pengolahan input user dalam
membuat aplikasi web
Mengumpulkan informasi /Experimenting
o Siswa melaksanakan Keamanan dan Keselamatan Kerja
(K3) dalam pengoperasian peralatan
o Siswa memperlihatkan sikap cermat dan teliti dalam
menyelesaikan masalah tentang penerapan pengolahan
input user dalam membuat aplikasi web
o Siswa mencoba membuat laporan hasil observasi tentang
penerapan pengolahan input user dalam membuat
aplikasi web
o Dengan sikap tanggung jawab, peduli, responsif, dan
santun siswa berkelompok membaca dan berdiskusi
Konfirmasi
Mengkomunikasikan
o Menyampaikan hasil tentang penerapan pengolahan input
user dalam membuat aplikasi web, kelompok lain
merespon atau menanggapi dengan responsif dan santun
o Siswa mendengarkan umpan balik dan penguatan dari
guru
o Siswa mengumpulkan hasil kerja kelompok.
Kegiatan Penutup
o Melakukan refleksi dan mencatat hal-hal penting dalam
bentuk rangkuman dengan melibatkan peserta didik
o Menindaklanjuti pembelajaran hari ini dengan melihat hasil
akhir pekerjaan siswa sesuai dengan materi belajar yang baru
saja di pelajari
o Siswa menyimak informasi mengenai rencana tindak lanjut
pembelajaran
45 Menit
SMK NEGERI 1 TRENGGALEK
106
H. Penilaian
a. Penilaian Proses
No Aspek yang dinilai
Teknik
Penilaian
Waktu
Penilaian
Instrumen
Penilaian
Keterangan
1. Religius Pengamatan Proses
Lembar
Pengamatan
Hasil
penilaian
nomor 1 dan
2 untuk
masukan
pembinaan
dan informasi
bagi Guru
Agama dan
Guru PKn
2. Tanggung jawab
3. Peduli
4. Responsif
5. Santun
b. Penilaian Hasil
Indikator Pencapaian
Kompetensi
Teknik
Penilaian
Bentuk
Penilaian
Instrumen
Memahami akses
komponen form
(proses dan validasi
input)
Tes
tertulis
Isian Jelaskan mengenai akses komponen
form (proses dan validasi input)
Memahami navigasi
halaman melalui kode
program client
Tes
tertulis
Isian Jelaskan mengenai navigasi halaman
melalui kode program client
Memahami
perubahan format
style melalui kode
progarm client
Tes
tertulis
Isian Jelaskan car merubah format style
melalui kode progarm client
Pedoman Penskoran
1.Soal nomor 1 sampai 3
Aspek Skor
Siswa menjawab dengan benar dan lengkap 4
Siswa menjawab benar sedikit tidak lengkap 3
Siswa menjawabb enar tetapi tidak lengkap 2
Siswa menjawab salah 1
SKOR MAKSIMAL
SMK NEGERI 1 TRENGGALEK
107
2.Test unjuk kerja
1.Rubrik Penilaian Diskusi
No.
Nama
Siswa
Aspek pengamatan
Jum
Skor
Nilai Ket
Kerjasama
Mengkomu
nikasikan
pendapat
Toleransi Keaktifan Kreatifitas
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
2.Rubrik Penilaian Presentasi
No.
Nama
Siswa
Aspek Penilaian
Jum
Skor
Nilai Ket.
Kerjasama
Sistematika
Penyampaian
Wawasan Keberanian Antusias
Gesture &
Penampilan
Skor perolehan
Skor Maksimal (20)
SMK NEGERI 1 TRENGGALEK
108
Keterangan Skor :
Masing-masing kolom diisi dengan kriteria
4 = Baik sekali
3 = Baik
2 = Cukup
1 = Kurang
Nilai = X 100
Kriteria Nilai
A = 90-100 : Baik sekali
B = 80-89 : Baik
C = 75-79 : Cukup
D = < 75 : Kurang
3.Format Penilaian Laporan
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Mendeskripsikan
mengenai penerapan
pengolahan input user
dalam membuat aplikasi
web
3. Struktur/logika penulisan
disusun dengan jelas
sesuai metode yang
dipakai
4. Bahasa yang digunakan
sesuai EYD
5. Gambar yang sesuai
6. Penemuan terbaru
Bentuk Tulisan
7. Sesuai kaidah yang
ditetapkan (Kertas,
Spasi, Font)
8. Kerapihan ketikan sesuai
dengan SOP
Jumlah
Skor perolehan
Skor Maksimal (24)
SMK NEGERI 1 TRENGGALEK
109
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
4.Format Jobsheet dan Rubrik penilaian
Kompetensi Dasar : .
Alat : .
Bahan : .
Langkah Kerja : .
Gambar kerja : .
Analisa : .
Struktur Makalah Indikator Nilai
Isi Laporan
1. Orisinalitas deskripsi
2. Alat bahan yang sesuai
dengan unjuk kerja
3. Langkah kerja sesuai SOP
4. Analisa sesuai
kerusakan/kesalahan yang
terjadi
5. Gambar yang sesuai
Bentuk Tulisan
6. Kerapihan tulisan
7. Ketepatan waktu
penyelesaian tugas
Jumlah
Kriteria Penilaian untuk masing-masing Indikator :
Sangat sesuai 4
Sesuai 3
Cukup 2
Kurang 1
Nilai = X 100
Skor perolehan
Skor Maksimal (32)
Skor perolehan
Skor Maksimal (28)
SMK NEGERI 1 TRENGGALEK
110
5.Rubrik penilaian Unjuk kerja/Praktek
Prosentase Bobot Komponen Penilaian
Nilai Praktik
(NP)
Persiapan Proses
Sikap
Kerja
Hasil Waktu NK
1 2 3 4 5 6
Bobot (%)
10 40 10 30 10
Skor
Komponen
NK
I. Sumber Belajar
o Buku Teks Pelajaran
o Buku Panduan Guru
o Pemrograman Web Dengan HTML Revisi Keempat, Betha sidik, Ir., Husni I. Pohan,
Ir., M.Eng., Penerbit Informatika Bandung, Juni 2012
o Learning Web Design 4th Edition, Jennifer Niederst Robbins, Penerbit O'Reilly
Media, Inc.: Kanada, 2012
o Buku-buku dan referensi lain yang relevan
o Media cetak/elektronik
o Lingkungan sekitar
Trenggalek , 14 Juli 2014
Guru Mata Pelajaran
Bambang Haryono, ST
NIP. 19780618 201101 1 006
SMK NEGERI 1 TRENGGALEK
111
Lampiran 1 Lembar Pengamatan
LEMBAR PENGAMATAN SIKAP
Mata Pelajaran :..................................................................................................
Kelas/Semester :....................................................................................................
Tahun Ajaran :....................................................................................................
Waktu Pengamatan : ............................................................................................
Indikator perkembangan sikapreligius,tanggung jawab,peduli,responsif, dansantun
1. BT (belum tampak) jika sama sekali tidak menunjukkan usaha sungguh-sungguh dalam
menyelesaikan tugas
2. MT (mulai tampak) jika menunjukkan sudah ada usaha sungguh-sungguh dalam
menyelesaikan tugas tetapi masih sedikit dan belum ajeg/konsisten
3. MB (mulai berkembang) jika menunjukkan ada usaha sungguh-sungguh dalam
menyelesaikan tugas yang cukup sering dan mulai ajeg/konsisten
4. MK (membudaya) jika menunjukkan adanya usaha sungguh-sungguh dalam
menyelesaikan tugas secara terus-menerus dan ajeg/konsisten
Bubuhkan tanda V pada kolom-kolom sesuai hasil pengamatan.
No
.
Nama
Siswa
Religius Tanggug jawab Peduli Responsif Santun
BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK BT MT MB MK
1.
2.
3.
4.
5.
...
Keterangan
1 = kurang
2 = sedang
3 = baik
4 = sangat baik
SMK NEGERI 1 TRENGGALEK
112
Rubrik penilaian laporan hasil observasi
Nama Kelompok :.........................
Tanggal :
No. Kunci/Kriteria jawaban/Aspek yang dinilai Tingkat Skor
1. Isi
2. Organisasi
3. Kosakata dan Diksi
4. Bahasa (Tata Bahasa dan Struktur)
5. Penulisan (Ejaan dan Tanda Baca)
6. Kerapian
Total