Anda di halaman 1dari 15

Rencana Pelaksanaan Pembalajaran

Satuan Pendidikan : SMK


Mata Pelajaran : Pemrograman Web
Bidang Keahlian : Teknologi Informasi dan Komunikasi
Program Keahlian : Teknik Komputer dan Informatika
Paket Keahlian : Rekayasa Perangkat Lunak
Kelas/Semester :X/1
Materi Pokok : Menyajikan Format Teks dalam Dokumen Web
Pertemuan ke- :3
Alokasi Waktu : 3 x 45 menit

A. Kompetensi Inti

1. Menghayati dan mengamalkan ajaran agama yang dianutnya.


2. Menghayati dan mengamalkan perilaku jujur, disiplin, tanggung jawab, peduli (gotong
royong, kerjasama, toleran, damai), santun, responsif dan proaktif dan 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. Mendeskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam.
1.3. Mengamalkan nilai-nilai keimanan 
 sesuai dengan ajaran agama 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
3.2.1 Memahami dasar-dasar HTML.
3.2.2 Mengetahui penjelasan struktur HTML.
3.2.3 Membuat file HTML pertama.
4.2.1 Mampu menyajikan file HTML pertama.

D. Tujuan Pembelajaran
1. Setelah melalui proses menggali informasi dan berdiskusi, peserta didik dapat
memahami dasar-dasar HTML.
2. Setelah melalui proses menggali informasi dan berdiskusi, peserta didik dapat
mengetahui penjelasan struktur HTML.
3. Setelah melalui proses menggali informasi dan mencoba, peserta didik dapat membuat
file HTML pertama.
4. Setelah melalui proses mencoba, peserta didik dapat menyajikan file HTML pertama.

E. Materi Pembelajaran
Dasar-dasar HTML
HTTP (Hypertext transfer protocol) merupakan protokol yang digunakan untuk mentransfer
data antara web server ke web browser. Protocol ini mentransfer dokumen-dokumen web
yang ditulis atau berformat HTML (Hypertext Markup Language). Dikatakan markup
language karena HTML berfungsi untuk ‘memperindah’ file teks biasa untuk ditampilkan
pada program web browser hal ini dilakukan dengan menambahkan elemen atu sering
disebut sebagai tag-tag pada file teks biasa tersebut.

HTML merupakan singkatan dari HyperText Markup Language adalah sebuah bahasa
pemrograman yang digunakan untuk membuat sebuah halaman web, yang kemudian
dapat diakses untuk menampilkan berbagai informasi di dalam sebuah penjelajah web
internet (browser)

Fungsi HTML:
1. Membuat halaman web.
2. Menampilkan berbagai informasi di dalam sebuah browser Internet.
3. Membuat link menuju halaman web lain dengan kode tertentu (hypertext).

Aplikasi yang dibutuhkan


Dalam memulai HTML Dasar, ada dua aplikasi yang diperlukan, yaitu:
Text Editor
Terdapat Text Editor bawaan yang langsung terdapat di software masing-masing, seperti
TextEdit pada Mac atau Notepad pada Windows. Text Editor digunakan untuk menuliskan
kode HTML.
Browser
Browser sendiri terdapat berbagai macam, seperti Safari, Chrome, Mozilla Firefox, Internet
Explorer dll. Fungsi dari browser adalah untuk menampilkan hasil kode HTML yang sudah
ditulis.

Penjelasan Struktur Dasar HTML


Tag
Tag adalah kata kunci yang berada diantara kurung sudut “<” dan “>”, sebagai contoh
<head> adalah tag dengan nama head.
Secara umum tag ditulis berpasangan, yang terdiri atas tag pembuka dan tag penutup (yang
ditambahkan karakter backslash “/” setelah karakter “<”.
Contoh:
<p>Ini adalah sebuah paragraf</p>
Keterangan:
Tag <p> adalah tag pembuka, dan tag </p> adalah tag penutup dari “paragraph”.
Tag dimulai dengan <html> dan diakhiri dengan </html>.
Element harus ditulis diantara tag pembuka <html> dan tag penutup </html>

Tag <head> berisi informasi-informasi tentang website, seperti judul website.

Element
Element adalah isi dari tag yang berada di antara tag pembuka dan tag penutup.
Contoh:
<p>Ini adalah sebuah paragraf</p>
Keterangan:
“Ini adalah sebuah paragraf” adalah element dari tag <p>.

Attribute
Attribute merupakan informasi tambahan yang diberikan kepada tag. Informasi ini bisa
berupa instruksi untuk warna dari text, besar huruf dari text, dll.
syntax:
nama-attribute=’nilai-atribut”
Setiap atribut memiliki pasangan nama/name dan nilai/value dan ditulis dengan
name=”value”. Value diapit tanda kutip, boleh tanda kutip satu (‘) atau dua (“).
Contoh:
<p align=”centre”>Arkademy</p>
Penjelasan:
a. <p align=”centre”>
adalah tag pembuka yang telah diberi attribute.
b. </p>
adalah tag penutup.
c. Arkademy
merupakan konten atau element
d. align=”centre”
merupakan suatu attribute.
e. align
merupakan nama attribute.
f. “centre”
merupakan nilai attribute.
Struktur Dasar Dokumen HTML
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
berisi tentang text, gambar atau apapun yang tampil pada dokumen web.
</body>
</html>

F. Pendekatan, Model, Metode Pembelajaran


Pendekatan : Saintifik
Model : Problem-based learning
Metode : Diskusi, tanya-jawab dan studi pustaka.

G. Media, Alat dan Sumber Belajar


Media : Video dari arkademy.com
Alat : Laptop dan LCD Proyektor
Sumber : Buku Sekolah Elektronik Pemrograman Web Kurikulum 2013

H. Langkah-Langkah Pembelajaran
Kegiatan Alokasi
Saintifik Deskripsi Kegiatan
Pembelajaran Waktu
Pendahuluan Pembuka 15 menit
1. Guru memberikan salam.
2. Guru menyiapkan peserta
didik untuk mengikuti
proses pembelajaran.

Stimulasi
1. Guru memusatkan
perhatian peserta didik
dengan menunjukkan
berbagai tampilan web,
seperti facebook,
Instagram, path, twitter,
dll.
2. Guru memberikan
kesempatan bagi peserta
didik untuk mengamati
tampilan web tersebut.
3. Guru menanyakan
perbedaan dalam tampilan
beberapa web tersebut.

Memotivasi
1. Guru memotivasi peserta
didik bahwa mereka juga
bisa membuat web juga.
2. Guru memotivasi peserta
didik tentang pentingnya
belajar pemrograman web.
3. Guru mengingatkan
peserta didik pelajaran
pada materi sebelumnya
mengenai alur dan
perangkat pengembangan
aplikasi web.
4. Guru menjelaskan tujuan,
manfaat dan langkah
pembelajaran serta metode
yang akan dilaksanakan.
5. Guru menampilkan video
arkademy tentang HTML
untuk pemula bagian
berkenalan dengan tag
HTML dan Heading dan
Paragraf.
Inti Mengamati Orientasi Masalah 10 menit
1. Peserta didik mengamati
dan mencermati struktur
dasar HTML yang
didemonstrasikan melalui
video di arkademy.com.
Menanya 2. Melalui video, peserta
didik diarahkan untuk
bertanya mengenai
struktur dasar HTML.

Mengorganisasi Peserta 5 menit


Didik
1. Guru membagi peserta
didik menjadi beberapa
kelompok. Masing-masih
kelompok terdiri dari 5
orang.
2. Guru meminta peserta
didik untuk mencoba kode
HTML pada video
Arkademy. Selanjutnya
mengupload Code yang
sudah dibuat ke GIT di
Arkademy.
3. Guru meminta peserta 15 menit
didik mendiskusikan
tentang struktur dasar
HTML dan mengerjakan
tugas pada buku BSE
Pemrograman Web
halaman 50-52.

Membimbing Penyelidikan
Mengumpulkan 1. Guru membimbing peserta
informasi didik untuk
mengumpulkan informasi 45 menit
struktur dasar HTML.
2. Guru mengawasi dan apa
Mengasosiasi yang sudah diketahui
peserta didik dan apa yang
belum diketahui peserta
didik.
Mengembangkan dan
menyajikan hasil karya
1. Peserta didik per individu
membuat file HTML
pertama mereka sesuai 30 menit
dari hasil diskusi mereka.
2. Peserta didik per individu
membuat tugas untuk
membuat dokumen
HTML heading,
paragraph, link dan image.
Menganalisa dan
Mengkomunikasikan mengevaluasi
1. Peserta didik
menampilkan file HTML
pertama mereka sambil
menjelaskan secara runut
proses pembuatan file
tersebut.
2. Guru melakukan penilaian
verbal kepada kelompok
terbaik.
3. Guru merefleksikan
tentang file HTML
pertama mereka.
Penutup 1. Guru bersama peserta 10 menit
didik merangkum materi
hari ini.
2. Guru memberi tahu
peserta didik materi
selanjutnya, yaitu
pemformatan teks dan
paragraf.
3. Guru menutup pelajaran.

I. Penilaian (Sikap, Pengetahuan dan Keterampilan)


Prosedur penilaian : Proses dan Hasil Belajar
Jenis/Teknik penilaian : Observasi, Tes Formatif dan Keterampilan
Bentuk Instrumen : Lembar penilaian observasi, tes tertulis, lembar pengamatan
penilaian keterampilan, Student’s Skills Dashboard Arkademy

__________,______________
Mengetahui,
Kepala Sekolah Guru

___________________ ___________________
NIP. NIP.
LAMPIRAN
Instrumen Penilaian Sikap dalam Diskusi
Materi : Menyajikan Format Teks dalam Dokumen Web
Hari/Tgl :
Kelas :

Menyampaikan

Menanggapi
Komunikasi

Kerjasama
Tanggung

Pendapat

pendapat
Jawab
No. Nama ∑Skor Nilai

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
Rubrik Penilaian Sikap dalam Diskusi
No. Aspek Rubrik
yang dinilai
1. Komunikasi 1. Aktif dalam tanya jawab, tidak ikuti mengemukakan gagasan
atau ide, dan tidak menghargai pendapat peserta didik lain.
2. Aktif dalam tanya jawab, dapat mengemukakan gagasan atau
ide, dan tidak menghargai pendapat peserta didik lain.
3. Aktif dalam tanya jawab, dapat mengemukakan gagasan atau
ide, dan menghargai pendapat siswa lain.
2. Tanggung 1. Tidak berupaya sungguh-sungguh dalam menyelesaikan tugas
jawab dan tugasnya tidak selesai.
2. Berupaya tepat waktu dalam menyelesaikan tugas namun belum
mengupayakan sebaiknya.
3. Tekun dalam menyelesaikan tugas dengan hasil terbaik yang bisa
dilakukan dan tepat waktu.
3. Kerjasama 1. Tidak bekerjasama dalam kelompok diskusi.
2. Ada kerjasama dalam kelompok, namun ada yang tidak ikut
serta.
3. Kerjasama dalam kelompok diskusi sangat terjaga.
4. Menyampaikan 1. Tidak sesuai masalah.
pendapat 2. Sesuai dengan masalah, tapi belum benar.
3. Sesuai dengan masalah dan benar.
5. Menanggapi 1. Langsung setuju atau menyanggah tanpa alasan.
pendapat 2. Setuju atau menyanggah dengan alasan yang benar.
3. Setuju atau menyanggah dengan alasan yang benar dengan
referensi.

Pedoman penskoran:
𝐽𝑢𝑚𝑙𝑎ℎ 𝑠𝑘𝑜𝑟 𝑦𝑎𝑛𝑔 𝑑𝑖𝑑𝑎𝑝𝑎𝑡
Nilai = 𝑥 100
𝐽𝑢𝑚𝑙𝑎ℎ 𝑠𝑘𝑜𝑟 𝑚𝑎𝑘𝑠𝑖𝑚𝑢𝑚

Skor maksimum yang dapat diperoleh peserta didik adalah 15.


Instrumen Penilaian Pengetahuan
Soal
1. HTML adalah kepanjangan dari…
a. Hyperlinks and Text Markup Language
b. Hyper Text Markup Language
c. Home Tool Markup Language
d. Homepage Text Markup Language
2. Pilih tag HTML yang benar untuk ukuran huruf Heading terbesar
a. <head>
b. <h6>
c. <heading>
d. <h1>
3. Attribute NAME digunakan sebagai…
a. menamai kotak
b. menandai teks
c. mengatur ukuran
d. memasukkan teks
4. Apa perintah yang paling pertama dalam mengawali pembuatan HTML?
a. <body>
b. </body>
c. </html>
d. <html>
5. Tuliskan struktur dasar HTML!
<html>
<head>
<title>Judul Halaman</title>
</head>
<body>
berisi tentang text, gambar atau apapun yang tampil pada dokumen web.
</body>
</html>
Rubrik Penilaian Pengetahuan

No Kriteria Skor
a. Jawaban Benar 20
1
b. Jawaban Salah 0
a. Jawaban Benar 20
2
b. Jawaban Salah 0
a. Jawaban Benar 20
3
b. Jawaban Salah 0
a. Jawaban Benar 20
4
b. Jawaban Salah 0
a. Jawaban tepat atau benar semua 20
b. Jawaban sebagian besar benar 15
5 c. Jawaban sebagian kecil benar 10
d. Jawaban salah 5
e. Tidak menjawab 0
Skor Maksimal 100
Instrumen Penilaian Keterampilan
Materi : Menyajikan Format Teks dalam Dokumen Web
Hari/Tgl :
Kelas :

Indikator terampil menerapkan konsep/prinsip dan strategi pemecahan masalah yang


relevan yang berkaitan dengan format teks dalam dokumen web.
Kurang Terampil : Sama sekali tidak dapat menerapkan konsep/prinsip dan strategi
pemecahan masalah yang relevan yang berkaitan dengan
penyajian format teks dalam dokumen web.
Terampil : menunjukkan sudah ada usaha untuk menerapkan
konsep/prinsip dan strategi pemecahan masalah yang relevan
yang berkaitan dengan penyajian format teks dalam dokumen
web tetapi belum tepat.
Sangat Terampil : menunjukkan adanya usaha untuk menerapkan konsep/prinsip
dan strategi pemecahan masalah yang relevan yang berkaitan
dengan konsep penyajian format teks dalam dokumen web dan
sudah tepat.

Bubuhkan tanda √pada kolom-kolom sesuai hasil pengamatan.


Keterampilan
No. Nama Kurang Sangat
Terampil
Terampil Terampil
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.