Pemrograman Web HTML, HTML5, CSS, CSS 3 DAN JAVASCRIPT
pemrograman webFull description
Pemrograman WebFull description
Pemrograman Web HTML, HTML5, CSS, CSS 3 DAN JAVASCRIPTFull description
Soal Uas Pemrograman webFull description
RENCANA PELAKSANAAN PEMBELAJARAN ( RPP ) Satuan Pendidikan Kelas/Semester Mata Pelajaran Materi pokok Waktu
: SMK MA’ARIF 1 TEMON : X/1 : Pemrograman Web : Format Tabel pada Halaman Web : 4 kali pertemuan @ 445 Menit
A. Kompetensi Kompetensi Inti 1. Menghayati dan mengamalkan ajaran agama yang dianutnya. 2. Mengembangkan perilaku (jujur, disiplin,tanggung jawab, peduli, santun, ramah lingkungan, gotong royong, kerjasama, cinta damai,responsif dan proaktif) dan menunjukan sikap sebagai bagian dari solusi atas berbagai permaslahan bangsa dalam berinteraksi secara efektif dengan lingkungan sosial dan alam serta dalam menempatkan diri sebagai cerminan bangsa dalam pergaulan dunia 3. Memahami, menerapkan,menganalisis pengetahuan faktual, konseptual, prosedural berdasarkan ingintahunya tentang ilmu pengetahuan, teknologi, seni, budaya dan humaniora dengan wawasan kemanusiaan, kebangsaan, kenegaraan dan peradaban terkait fenomena dan kejadian, serta menerapkan pengetahuan prosedural pada bidang kajian yang spesifik sesuai dengan bakat dan minatnya untuk memcahkan 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.2. Mendeskripsikan kebesaran Tuhan yang menciptakan berbagai sumber energi di alam Indikator 1.2.1.
ndeskr ipsikan kebes kebesaran Tu han yang menciptakan M endeskr menciptakan berbagai sumber energi di alam.
2.2. Menghargai kerja individu dan kelompok dalam aktivitas sehari-hari sebagai wujud implementasi melaksanakan percobaan dan melaporkan hasil percobaan Indikator 2.2.1.
dalam aktivitas sehari-hari sebagai dalam M enghargai kerj a individu dan kelompok kelompok wujud implementasi melaksanakan percobaan dan melaporkan hasil percobaan
3.3. Menerapkan format tabel pada halaman web Indikator 3.3.1 3.3.2.
Menjelaskan perintah-perintah perintah-perintah html untuk membuat tabel pada halaman web Menerapkan perintah-perintah html untuk untuk membuat membuat tabel tabel pada halaman web web
4.3. Menyajikan data tabel pada halaman web Indikator 4.3.1.
Menerapkan perintah-perintah perintah-perintah html untuk membuat membuat tabel sederhana sederhana pada halaman web 4.3.2. Menerapkan perintah-perintah html untuk untuk membuat membuat tabel dengan dengan spanning 4.3.3. Menerapkan perintah-perintah html untuk membuat tabel di dalam tabel tabel (tabel bersarang) 4.3.4. Menerapkan perintah-perintah html untuk membuat tampilan web sederhana sederhana dengan tabel
C. Tujuan Pembelajaran 1. Melalui berdoa, Peserta didik dapat merenungi kebesaran Tuhan yang menciptakan berbagai sumber energi di alam 2. Melalui diskusi dan presentasi, peserta didik dapat menghargai kerjasama dalam kelompok 3. Melalui membaca, diskusi dan presentasi, peserta didik dapa t menunjukkan perintah html untuk membuat tabel pada halaman web dengan bena r. 4. Melalui membaca, diskusi dan presentasi, peserta didik dapat menerapkan perintah html untuk membuat tabel pada halaman web dengan benar. 5. Melalui diskusi dan praktik, peserta didik dapat menerapkan perintah html untuk membuat sebuah tabel sederhana pada halaman web dengan benar. 6. Indikator 4.3.2. Melalui diskusi dan praktik, peserta didik dapat menerapkan perintah html untuk membuat sebuah tabel dengan spanning dengan benar. 7. Indikator 4.3.3. Melalui diskusi dan praktik, peserta didik dapat menerapkan perintah html untuk membuat sebuah tabel di dalam tabel dengan benar. 8. Indikator 4.3.4. Melalui diskusi dan praktik, peserta didik dapat menerapkan perintah html untuk membuat sebuah tampilan web sederhana menggunakan tabel dengan benar. D. Materi Pembelajaran Materi terdapat pada buku ... halaman ... Atau ditulis semuanya Anatomi tabel minimal Tabel dengan spanning Tabel di dalam tabel Desain halaman web dengan konsep tabel E. Metode 1. Pendekatan : Saintifik / ---> yg lain:discovery, projrct 2. Model : 3. Metode : Penugasan, Diskusi, Presentasi, Praktek Strategi: gabungan dari beberapa metode. F. Media Pembelajaran 1. Laptop dan LCD 2. Papan tulis, spidol dan penghapus. G. Alat dan Bahan 1. Lembar rangkuman materi pembelajaran. 2. Lembar penilaian 3. Laptop/PC yang sudah terinstal text editor dan browser web
H. Sumber Belajar 1. Lembar materi 2. Modul HTML / pemrograman web 3. Buku referensi dan artikel yang sesuai
4. Sumber bacaan dari Internet I. Kegiatan Pembelajaran 1. Alokasi Waktu (waktu: 1 pertemuan 4 x 45 menit)
2. Langkah – Langkah Pembelajaran a. Pertemuan 1 Kegiatan
Deskripsi Kegiatan
Pendahuluan
1. 2. 3. 4.
Peserta didik berdoa dan menjawab salam dari guru. Peserta didik dipresensi oleh guru. Guru bertanya tentang materi sebelumnya Peserta didik memperoleh apersepsi dari guru berkaitan dengan pengetahuan mengenai Format tabel pada halaman web. 5. Peserta didik memperoleh motivasi dari guru berkaitan dengan format tabel pada halaman web. 6. Peserta didik mendapatkan informasi dari guru tentang KD, tujuan, dan skenario pembelajaran. 7. Peserta didikmembentuk kelompok belajar yang beranggotakan 4-5 orang
Inti
Mengamati
1. Peserta didik membaca buku/modul atau mengamati video pembelajaran tentang cara membuat tabel pada halaman web 2. Peserta didik browsing internet dan mengamati tentang pelbagai contoh tabel dan tampilannya pada halaman web M engumpulkan infor masi
Peserta didik mengumpulkan informasi tentang contoh perintah/kode html untuk membuat tabel beserta hasilnya. Menanya
1. Siswa bertanya tentang materi yang belum dipahami 2. Siswa mendiskusikan perintah html dalam pembuatan tabel pada halaman web M engekspl orasi > M enalar
1. Siswa mendefinisikan perintah dasar html untuk membuat sebuah tabel pada halaman web 2. Siswa melakukan eksperimen dengan membuat beberapa bentuk tabel sederhana pada halaman web dengan html 3. Siswa mempraktekkan pembuatan tabel sesuai dengan soal yang diberikan oleh guru. M engasosi asi > menger jakan lati han
Siswa menganalisis, mendiskusikan serta membuat rangkuman tentang bagian-bagian tabel pada halaman web dan perintah
Alokasi Waktu
10 menit
140 menit
html unntuk membuatnya Mengkomunikasikan
Penutup
Siswa mempresentasikan perintah pembuatan tabel pada halaman web 1. Salah satu atau lebih peserta didik menyimpulkan tentang tabel pada halaman web dan perintah html-nya. 2. Tes tertulis bentuk uraian mengenai perintah html untuk membuat tabel pada halaman web 3. Peserta didik memperhatikan dengan cermat untuk mempelajari materi lebih lanjut.
30 menit
Tes ada di Inti. b. Pertemuan 2 Kegiatan
Deskripsi Kegiatan
Pendahuluan
1. Peserta didik berdoa dan menjawab salam dari guru. 2. Peserta didik dipresensi oleh guru. 3. Peserta didik memperoleh apersepsi dari guru berkaitan dengan pengetahuan mengenai tabel dengan spanning pada halaman web. 4. Peserta didik memperoleh motivasi dari guru berkaitan dengan tabel dengan spanning pada halaman web. 5. Peserta didik mendapatkan informasi dari guru tentang KD, tujuan, dan skenario pembelajaran. 6. Peserta didikmembentuk kelompok belajar yang beranggotakan 4-5 orang
Inti
Mengamati
1. Peserta didik membaca buku atau melihat video tentang tabel dengan spanning pada halaman web 2. Peserta didik browsing internet dan mengamati tentang pelbagai contoh tabel dengan spanning dan tampilannya pada halaman web M engumpulkan infor masi
Peserta didik mengumpulkan informasi tentang contoh tabel dengan spanning beserta perintah/kode html untuk membuatnya. Menanya
1. Siswa bertanya tentang materi yang belum dipahami 2. Siswa mendiskusikan perintah pembuatan tabel dengan spanning pada halaman web
M engeksplor asi
Alokasi Waktu
10 menit
140 menit
1. Siswa mendefinisikan perintah html untuk membuat sebuah tabel dengan spanning pada halaman web 2. Siswa melakukan eksperimen dengan membuat beberapa bentuk tabel dengan spanning pada halaman web dengan html M engasosi asi
Siswa menganalisis, mendiskusikan serta membuat rangkuman tentang bagian-bagian tabel dengan spanning pada halaman web dan perintah html untuk membuatnya Mengkomunikasikan
Penutup
Siswa mempresentasikan perintah dasar pembuatan tabel dengan spanning pada halaman web 1. Salah satu atau lebih peserta didik menyimpulkan tentang tabel dengan spanning dan perintah html-nya. 2. Tes tertulis bentuk uraian mengenai perintah html untuk membuat tabel dengan spanning pada halaman web. 3. Peserta didik memperhatikan dengan cermat untuk mempelajari materi lebih lanjut.
30 menit
3. Pertemuan 3 Kegiatan
Deskripsi Kegiatan
Pendahuluan
1. Peserta didik berdoa/menjawab salam guru bersama-sama. 2. Peserta didik dipresensi oleh guru. 3. Peserta didik memperoleh apersepsi dari guru berkaitan dengan pengetahuan mengenai tabel di dalam tabel. 4. Peserta didik memperoleh motivasi dari guru berkaitan dengan tabel di dalam tabel pada halaman web. 5. Peserta didik mendapatkan informasi dari guru tentang KD, tujuan, dan skenario pembelajaran. 6. Peserta didikmembentuk kelompok belajar yang beranggotakan 4-5 orang
Inti
Mengamati
1. Peserta didik membaca buku tentang tabel di dalam tabel pada halaman web 2. Peserta didik browsing internet dan mengamati tentang pelbagai contoh tabel di dalam tabel dan tampilannya pada halaman web M engumpulkan infor masi
Peserta didik mengumpulkan informasi tentang contoh tabel di dalam tabel beserta perintah/kode html untuk membuatnya.
Menanya
Alokasi Waktu
10 menit
140 menit
1. Siswa bertanya tentang materi yang belum dipahami 2. Siswa mendiskusikan perintah pembuatan tabel di dalam tabel pada halaman web M engeksplor asi
1. Siswa mendefinisikan perintah html untuk membuat sebuah tabel di dalam tabel pada halaman web 2. Siswa melakukan eksperimen dengan membuat beberapa bentuk tabel di dalam tabel pada halaman web dengan html M engasosi asi
Siswa menganalisis, mendiskusikan serta membuat rangkuman tentang bagian-bagian tabel di dalam tabel pada halaman web dan perintah html untuk membuatnya Mengkomunikasikan
Penutup
Siswa mempresentasikan perintah dasar pembuatan tabel di dalam tabel pada halaman web 1. Salah satu atau lebih peserta didik menyimpulkan tentang tabel di dalam tabel dan perintah html-nya. 2. Tes tertulis bentuk uraian mengenai perintah html untuk membuat tabel di dalam tabel pada halaman web. 3. Peserta didik memperhatikan dengan cermat untuk mempelajari materi lebih lanjut.
30 menit
4. Pertemuan 4 Kegiatan
Deskripsi Kegiatan
Pendahuluan
1. Peserta didik berdoa/menjawab salam guru bersama-sama. 2. Peserta didik dipresensi oleh guru. 3. Peserta didik memperoleh apersepsi dari guru berkaitan dengan pengetahuan mengenai tampilan halaman web sederhana dengan tabel. 4. Peserta didik memperoleh motivasi dari guru berkaitan dengan tampilan halaman web sederhana dengan tabel b. 5. Peserta didik mendapatkan informasi dari guru tentang KD, tujuan, dan skenario pembelajaran. 6. Peserta didikmembentuk kelompok belajar yang beranggotakan 4-5 orang
Inti
Mengamati
1. Peserta didik membaca buku tentang tampilan halaman web sederhana dengan tabel. 2. Peserta didik browsing internet dan mengamati tentang pelbagai contoh tampilan halaman web sederhana dengan tabel pada halaman web
M engumpulkan infor masi
Alokasi Waktu
10 menit
140 menit
Peserta didik mengumpulkan informasi tentang contoh tampilan halaman web sederhana dengan tabel beserta perintah/kode HTML untuk membuatnya. Menanya
1. Siswa bertanya tentang materi yang belum dipahami 2. Siswa mendiskusikan perintah untuk membuat tampilan halaman web sederhana dengan tabel. M engeksplor asi
1. Siswa mendefinisikan perintah HTML untuk membuat sebuah tampilan halaman web sederhana dengan tabel 2. Siswa melakukan eksperimen dengan membuat beberapa bentuk tampilan halaman web sederhana dengan tabel M engasosi asi
Siswa menganalisis, mendiskusikan serta membuat rangkuman tentang tampilan halaman web sederhana dengan tabel dan perintah HTML unntuk membuatnya Mengkomunikasikan
Penutup
Siswa mempresentasikan perintah dasar pembuatan tampilan halaman web sederhana dengan table 1. Salah satu atau lebih peserta didik menyimpulkan tentang tampilan halaman web sederhana dengan tabel dan perintah html-nya. 2. Tes tertulis bentuk uraian mengenai tampilan halaman web sederhana dengan tabel. 3. Peserta didik memperhatikan dengan cermat untuk mempelajari materi lebih lanjut.
30 menit
E. Penilaian Hasil Belajar
1. Jenis / Teknik Penilaian : a. Penilaian Sikap : Observasi b. Penilaian Pengetahuan: Tes Tulis c. Penilaian Keterampilan: Tes Praktik 2. Aspek Penilaian
1.
Aspek yang dinilai Sikap
2.
Pengetahuan
3.
Keterampilan
No
Teknik Penilaian
Waktu Penilaian
Dalam pembelajaran Observasi 1. Menghayati dan mengamalkan ajaran dan saat diskusi agama diamati selama proses KBM (selama kegiatan 2. Bekerjasama diamati dalam kegiatan inti) kelompok. 3. Toleransi diamati dalam diskusi ketika terjadi proses pemecahan masalah yang berbeda. 4. Menjaga dan memelihara kebersihan lingkungan selama pelaksnaan pembelajaran Tes tertulis bentuk uraian mengenai pengertian, perintah Penyelesaian tugas html untuk membuat tabel dan tahapan essay individu, pada dalam pengaturan dan pembuatan sebuah akhir KD tabel Praktik Keterampilan dalam melaksanakan dan Penyelesaian tugas meyelesaikan Lembar Kerja Praktik. praktik (baik individu maupun kelompok)
3. Bentuk Instrumen dan Instrumen Penilaian a. Penilaian Sikap Instrumen penilaian sikap dengan observasi Berilah tanda cek pada kolom pilihan berikut: Aspek Pengamatan No Nama Siswa A B C 1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4 5 6 7 8 Pedoman skor:: 4 = selalu, 3 = sering, 2 = jarang 1 = tidak pernah
1
D 2 3
4
Keterangan Aspek Pengamatan Kode
A B C D
Aspek Pengamatan
Berdoa sebelum dan sesudah melakukan sesuatu Aktif dan berkontribusi positif dalam diskusi kelompok Santun dalam mengungkapkan pendapat selama diskusi Menjaga kebersihan selama pembelajaran
b. Penilaian Pengetahuan dan Keterampilan 1) PERTEMUAN 1 Instrumen Tes Tulis (uraian) Jawablah pertanyaan di bawah ini dengan jelas dan benar! 1. Apakah kegunaan tabel pada halaman web? 2. Sebut dan jelaskan tag utama untuk membuat tabel! 3. Sebut dan jelaskan atribut pada tag table! 4. Tuliskan contoh perintah html untuk membuatan sebuah tabel sederhana! Kunci jawaban : 1. Tabel digunakan untuk menampilkan informasi dalam bentuk sel yang terdiri atas baris dan kolom. 2. Tag utama untu membuat tabel dan fungsinya adalah Tag Fungsi
...
Mendefinisikan blok tabel
...
Mendefinisikan table row atau baris
...
Mendefinisikan table data atau sel sebagai tempat untuk menuliskan/meletakkan data pada tabel
...
Mendefinisikan table heading atau sel yang merupakan judul tiap kolom
3. Atribut dan nilainya pada tag Table = bilangan bulat (lebar table, pixel atau persen) Width Height = bilangan bulat (tinggi table, pixel atau persen) = bilangan bulat (tebal garis tepi) Border Cellspacing = bilangan bulat (spasi antar sel) Cellpadding = bilangan bulat (spasi di dalam sel) = [left|center|right] (perataan table) Align Bgcolor = [warna|kode heksadesimal] (warna latar belakang) 4. Contoh perintah html untuk menampilkan tabel:
border=”1”>
Nama
Budi Setiawan
Umur
16 tahun
Pedoman Penilaian Tes Tulis Uraian (Pengetahuan) 1. Soal nomor 1 dijawab benar skor maksimal 25 2. Soal nomor 2 dijawab benar skor maksimal 25 3. Soal nomor 3 dijawab benar skor maksimal 25 4. Soal nomor 4 dijawab benar skor maksimal 25 Instrumen Praktik Soal Praktik: 1. Buatlah tabel sederhana berikut ini dengan perintah html
2) PERTEMUAN 2 Instrumen Tes Tulis (uraian) Jawablah pertanyaan di bawah ini dengan jelas dan benar! 1. Apa atribut untuk menggabungkan baris? 2. Apa atribut untuk menggabungkan kolom? 3. Tulislah tag jika ingin menggabungkan 3 baris ! 4. Tulislah tag jika ingin menggabungkan 3 kolom !
Kunci jawaban : 1. Atribut untuk menggabungkan baris adalah rowspan 2. Atribut untuk menggabungkan kolom adalah colspan 3. Tag untuk menggabugkan 3 baris adalah
4. Tag untuk menggabungkan 3 kolom adalah
Pedoman Penilaian Tes Tulis Uraian (Pengetahuan) 1. Soal nomor 1 dijawab benar skor maksimal 25 2. Soal nomor 2 dijawab benar skor maksimal 25 3. Soal nomor 3 dijawab benar skor maksimal 25 4. Soal nomor 4 dijawab benar skor maksimal 25 Instrumen Praktik Soal Praktik: Buatlah tabel dengan spanning berikut menggunakan html!
3) PERTEMUAN 3 Instrumen Tes Tulis (uraian) Jawablah pertanyaan di bawah ini dengan jelas dan benar! 1. Apa keuntungan teknik tabel di dalam tabel? 2. Jelaskan cara membuat tabel di dalam tabel?
Kunci Jawaban: 1. Keuntungan tabel di dalam tabel (tabel bersarang) adalah menghasilkan layout tabel yang kompleks tanpa membuat kode perintah tabel yang sangat kompleks 2. Untuk membuat tabel di dalam tabel adalah dengan membuat/menuliskan perintah table di dalam sebuah sel (
4) PERTEMUAN 4 Instrumen Tes Tulis (uraian) Jawablah pertanyaan di bawah ini dengan jelas dan benar! 1. Jelaskan tentang bagian dari anatomi sebuah halaman web!
Kunci Jawaban: 1. Anatomi halaman web: a. Containing Block. Containing block merupakan bagian dari halaman web yang membungkus semua komponen halaman web. b. Logo. Identitas perusahaan, organisasi, pemilik situs. c. Navigation. Navigasi atau menu merupakan bagian penting dari situs yang memudahkan pengunjung berpindah-pindah halaman. d. Content. Content atau isi adalah segalanya, karena disinilah sebagian besar informasi disajikan. e. Footer. Footer merupakan bagian bawah dan berisi informasi singkat pemilik situs (copyright) dan beberapa link. f. Whitespace. Whitespace merupakan area kosong yang membatasi antar-komponen. Whitespace menjadi penting agar pengunjung mempunyai ruang berhenti di antara bagian-bagian situs yang lain. Whitespace dapat juga diisi dengan banner atau animasi. Pedoman Penskoran Tes Tulis Uraian (Pengetahuan) 1. Soal Uraian nomor 1 dijawab benar skor maksimal 100
Instrumen Praktik Buatlah layout web dengan tabel berikut dengan html!
Instrumen Penilaian Praktik Berilah tanda cek pada kolom pilihan berikut dengan : No.
Tanggung Jawab
Nama Siswa 1
2
3
Integritas 4
1
2
3
Objektivitas 4
1
2
3
Kemahiran 4
1
2
3
4
1 2
Pedoman Penskoran (Keterampilan) NO.
ASPEK ETIKA PROFESI
1.
Tanggung jawab
2.
Integritas
3.
Objektivitas
4.
Kemahiran
KRITERIA PENILAIAN
Kurang bertanggung jawab Cukup bertanggung jawab Bertanggung jawab Sangat bertanggung jawab Kurang berintegritas Cukup berintegritas Berintegritas Sangat berintegritas Kurang objektif Cukup objektif Objektif Sangat objektif Kurang mahir Cukup mahir Mahir Sangat mahir Kulonprogo, 12 September 2014
Mengetahui Kepala Sekolah
Dra. Kasminah NIP.19550110 198403 2 001
GuruMapel
Yudwi Antoro Wibowo
SKOR
1 2 3 4 1 2 3 4 1 2 3 4 1 2 3 4
LAMPIRAN A. RINGKASAN MATERI PERTEMUAN KE-1
Tabel merupakan cara untuk menampilkan informasi dalam bentuk sel yang terdiri atas baris dan kolom. Untuk menampilkan data dalam bentuk table pada HTML, digunakan Tag
. Elemen table berisi property
untuk menentukan baris (table row) yang di dalamnya terdapat properti
untuk menampilkan data pada setiap sel table(table data). Struktur elemen table adalah sebagai berikut:
data baris 1 kolom 1
data baris 1 kolom 2
Untuk mendifinisikan table heading atau judul tiap kolom menggunakan tag
…..
Tag Utama untuk tabel adalah Tag
Fungsi
…..
Mendifinisikan Tabel
…
Mendifinisikan table row atau baris
…
Data pada tabel/sel
…
Mendifinisikan table heading atau judul tiap kolom
Atribut Elemen Table
Width
= panjang(lebar table, pixel atau persen)
Height
= panjang(tinggi table, pixel atau persen)
Border
= pixel(tebal garis tepi)
Cellspacing = pixel(spasi antar sel) Cellpadding = pixel(spasi di dalam sel) Align
= [left|center|right](perataan table)
Bgcolor
= warna(warna latar belakang table)
Atribut Table Row
Align
= [left|center|right](perataan sebaris sel secara horizontal)
Valign
= [top|middle|bottom](perataaan sebaris sel secara vertical)
Bgcolor
= warna(warna latar belakang baris)
Atribut Tabel Data
Align
= [left|center|right](perataan horizontal)
Width
= [top|middle|bottom](perataan vertical)
Height
= pixel(tinggi sel, pixel atau persen)
Bgcolor
= warna(warna latar belakang sel)
B. RINGKASAN MATERI PERTEMUAN KE-2
Tabel dengan Spanning Ada kalanya kita membuat table dengan menggabungkan baris, ataupun kolom. Berikut ini contoh tabel yang menggabungkan baris Benua
Negara
ASIA
Arab Saudi India Indonesia Singapura
Berikut ini contoh tabel yang menggabungkan kolom : Benua
EROPA
Negara
Belanda
Italia
Inggris
Jerman
Untuk membuat table seperti di atas, maka Tabel Atribut Data yang digunakan adalah sebagai berikut Rowspan = angka (baris yang di span oleh sel) Colspan
= angka (kolom yang di span oleh sel)
Jadi untuk menggabungkan 4 baris seperti table di atas adalah :
…….
Sedangkan untuk menggabungkan 4 kolom seperti table di atas adalah :
…….
Jadi untuk menggabungkan baris ataupun kolom pada tabel, digunakan atribut : Rowspan : untuk baris Colspan
: untuk kolom
C. RINGKASAN MATERI PERTEMUAN KE-3
Tabel Bersarang (Tabel di Dalam tabel)
Dapat kita lihat bahwa di kolom “Email account note” ada table berisi tentang catatan jenis email. Jadi ada tabel di dalam tabel atau istilahnya “nested table” atau tabel bersarang. Dalam penulisan HTML “tabel bersarang” ini adalah dengan menuliskan HTML Tabel di dalam sebuah sel dari tabel, letaknya adalah pada
….
, seperti berikut ini
data baris 1 kolom 1
cell tabel ke 2
cell tabel ke 2
Teknik tabel bersarang adalah salah satu cara untuk menghasilkan layout tabel yang kompleks tanpa membuat tabel yang sangat kompleks. Sehingga ketika harus membuat tabel yang kompleks, maka cara sederhananya adalah membuat tabel di dalam sebuah sel (
).
D. RINGKASAN MATERI PERTEMUAN KE-4 Layout Web dengan Tabel
Secara garis besar anatomi atau susunan dari suatu halaman web terdiri dari containing block, Logo, navigation, content, white space dapat digambarkan sebagai berikut
1. Containing Block. Containing block merupakan bagian dari halaman web yang membungkus semua komponen halaman web. Umumnya dibuat dengan tag ,
atau
. 2. Logo. Identitas perusahaan, organisasi, pemilik situs. 3. Navigation. Navigasi atau menu merupakan bagian penting dari situs yang memudahkan pengunjung berpindah-pindah halaman.
4. Content. Content atau isi adalah segalanya, karena disinilah sebagian besar informasi disajikan. 5. Footer. Footer merupakan bagian bawah dan berisi informasi singkat pemilik situs (copyright) dan beberapa link. 6. Whitespace. Whitespace merupakan area kosong yang membatasi antar-komponen. Whitespace menjadi penting agar pengunjung mempunyai ruang berhenti di antara bagian-bagian situs yang lain. Whitespace dapat juga diisi dengan banner atau animasi. Gambar brikut ini adalah contoh sebuah tabel yang digunakan sebagai layout format tampilan halaman web.
Dengan menggunakan html, maka dapat dibuat layout web seperti berikut:
