AKADEMI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIK ROYAL KISARAN
PROGRAM STUDI MANAJEMEN INFORMATIKA
SATUAN ACARA PERKULIAHAN
PERTEMUAN - 14 :
MENDESAIN MENU DENGAN SPRY MENUBAR
1
. Identitas
Matakuliah : Pemrograman Web 1
Kode Mata Kuliah :
Semester : 3 ( Tiga )
SKS Dan Jumlah Jam : 2 (Dua), 2 x 45 menit (90 Menit) Matakuliah
Pendukung : - Pemrograman Terstruktur - Basis Data
- Design Grafis Pendukung
Matakuliah : - Pemrograman Web 2
Dosen : Andri Nata, ST, M.Kom
Minggu Ke : 14 ( Dua belas )
2
. Kompetensi
1. Unit Kompetensi : - Desain Web
2. Elemen Kompetensi : - Merancang daftar menu di website menggunakan spry menubar.
3. Kriteria Kinerja : Mahasiswa Mampu :
- Mendesain daftar menu website dengan adobe dreaweaver cs3.
- Memahami teknik sprymenubar dalam perancangan daftar menu di website.
3. Proses Pembelajaran
No. ALO-KASI WAKTU
KEGIATAN MEDIA/
ALAT/ BAHAN
HASIL
(Kriteria Unjuk Kerja)
1 10’ Penciptaan ketertiban suasana belajar
Berdoa bersama
Mengabsensi siswa Penjelasan
mengenai tujuan pembuatan
sprymenubar dengan
dreamweaver.
Menyimak dan memahami
Whiteboard, Laptop & Projektor
-2 65’ Mempersiapkan
daftar menu untuk perancangan website. Memberikan
pemahaman untuk pembuatan menu dengan srpymenubar.
Memahami dan mempraktekkan
Whiteboard, Laptop & Projektor
Merancang daftar menu di website menggunaka n spry
menubar.
3 10’ Menutup
proses perkuliahan Berdoa Bersama
Memahami -
-4. Materi Pembelajaran :
-5. Metode Pembelajaran : Ceramah, tanya jawab, dan latihan.
6. Materi latihan :
2. Lalu aktifkan cursor di daerah div menu supaya menu yang akan dibuat sesuai dengan layout yang sudah dirancang sebelumnya. Perhatikan gambar berikut :
3. Setelah itu aktifkan dalam keadaan design view untuk perancangan menu. 4. Selanjutnya klik insert – spry – spry menubar
5. Setelah itu akan tampilan pilihan perancangan menu yaitu perancangan secara vertikal atau horizontal. Berhubungan dari awal layout yang dirancang adalah mendatar, maka yang harus dipilih adalah horizontal.
6. Maka akan tampil seprti berikut :
Posisi kursor
Klik disini
7. Secara default akan tampil seperti item1,item2 dan seterusnya. Untuk melakukan perancangannya maka harus diaktifkan sprymenubar dengan cara klik warna hijau tepa t diatas item 1.
8. Selanjutnya adalah menghapus terlebih dahulu nama item yang telah ada dengan cara klik tanda minus ( - ) untuk mengganti nama menu yang akan dirancang sebelumnya. Lalu ketikkan menu yang akan dibuat.
9. Setelah menu suda dibuat nama,lanjutkan dengan klik tanda “+” untuk Tampilan menubar yang Akan dirancang
Klik disini ( - ) untuk
mengganti item yang sudah ada.
Klik disini untuk mengaktifkan
Property sprymenubar
Klik disini ( + ) untuk menambah menu.
Klik disini untuk
10.Apabila menu yang dirancang telah selesai dibuat. Simpan file tersebut,kemudia reload kembali halaman browser anda. Maka akan tampil seperti tampilan dibawah ini.
7. Materi Tes : -
8. Kriteria Penilaian : 1 - 100
9. Pedoman Bukti :
-10. Kunci Jawaban :
1. http://en.wikipedia.org/wiki/World_Wide_Web
2. http://id.wikipedia.org/wiki/Web
3. http://mysql.com
4. http://w3c.org
5. Jayan. 2010. CSS untuk orang awam. Palembang. Maxikom. 6. Prijono Agus, dkk. 2005. Mudan dan Cepat Menguasai
Pemrograman WEB. Bandung. Informatika.
