Pengembangan Evangs Mailoa Tes Tengah Semester WEB.

Presentasi berjudul: "Pengembangan Evangs Mailoa Tes Tengah Semester WEB."— Transcript presentasi:

1 Pengembangan Evangs Mailoa Tes Tengah Semester WEB

2 Buatlah web dengan tema berikut: 1.LuarAngkasa (khusus untuk jumlah angka 2 terakhir NIM = 1 atau 2) 2.HewanDarat (khusus untuk jumlah angka 2 terakhir NIM = 3 atau 4) 3.HewanLaut (khusus untuk jumlah angka 2 terakhir NIM = 5 atau 6) 4.Serangga (khusus untuk jumlah angka 2 terakhir NIM = 7 atau 8) 5.Burung (khusus untuk jumlah angka 2 terakhir NIM = 9 atau 0) Ketentuan: Tema yang dikerjakan HANYA SATU dan disesuaikan dengan JUMLAH DUA ANGKA TERAKHIR NIM. Contoh: Mahasiswa dengan NIM 672015001 (0+1=1) hanya mengerjakan website dengan tema Luar Angkasa. Mahasiswa dengan NIM 672015251 (5+1=6) hanya mengerjakan website dengan tema Hewan Laut. Apabila TEMA dan JUMLAH DUA ANGKA TERAKHIR NIMnya tidak sesuai akan dikurangi nilainya sebanyak 50%!

3 1. Terdapat 4 file html yang dibagi menjadi: a)File main.html digunakan untuk halaman utama website dan di dalamnya terdapat link untuk mengakses tiga halaman lainnya. Di halaman ini hanya terdiri dari satu gambar saja. Gambar tersebut diberi fungsi image maps agar pada bagian tertentu dapat dijadikan link untuk mengakses halaman lainnya. Area yang dibuat terdapat 3 buah (untuk akses tiga halaman lainnya). Contoh tampilan halaman utama dapat dilihat pada slide selanjutnya!

4 Pada gambar ini, area map digunakan pada lingkaran gelembung. Gelembung pertama untuk mengakses menu1.html, gelembung kedua untuk mengakses menu2.html dan gelembung ketiga untuk akses menu3.html.

5 b)File menu1.html digunakan untuk halaman yang berisi data tentang tema yang ditampilkan dalam bentuk tabel. Tabel dibuat dengan menggunakan table header. Banyaknya baris dan kolom disesuaikan dengan data yang ingin ditampilkan. Data yang disajikan merupakan data yang sesungguhnya (bukan karangan) dan harus sesuai dengan tema. Jumlah tabel yang dibuat harus lebih dari satu. Contoh tampilan halaman menu1.html dapat dilihat pada slide selanjutnya!

6 Pada halaman ini, terdapat tabel ukuran saja. Syarat untuk TTS harus lebih dari satu tabel! Jangan lupa harus ada link untuk kembali ke halaman utama!

7 b)File menu2.html berisi data-data tentang tema yang ditampilkan dalam bentuk list dengan jenis unordered list dan ordered list. Terdiri dari minimal 2 (dua) list. List pertama menggunakan unordered list dan list kedua menggunakan ordered list atau sebaliknya. Boleh menambahkan list ketiga berupa description list. Data yang disajikan merupakan data yang sesungguhnya (bukan karangan) dan harus sesuai dengan tema. Contoh tampilan halaman menu2.html dapat dilihat pada slide selanjutnya!

8 Pada halaman ini, terdapat jenis-jenis hewan laut dan ditampilkan dalam bentuk list. Syarat untuk TTS harus ada minimal dua LIST! Jangan lupa harus ada link untuk kembali ke halaman utama!

9 b)File menu3.html berisi gambar-gambar tentang tema yang ditampilkan menggunakan description list. Pada halaman ini berisikan list yang memuat gambar, dan informasi gambar harus sesuai dengan tema. Harus menggunakan Description List Pada Description Term (dt) berisikan informasi judul gambar, sedangkan pada Description Data (dd) berisikan informasi gambar. Gambar yang ditampilkan minimal 7 dan maksimal 10 gambar dengan ukuran tiap gambar disesuaikan agar file yang dikirim tidak berukuran besar. Contoh tampilan halaman menu3.html dapat dilihat pada slide selanjutnya!

10 Pada halaman ini, terdapat gambar- gambar hewan laut dan ditampilkan dalam bentuk description list. Syarat untuk TTS minimal 7 dan maksimal 10 gambar! Jangan lupa harus ada link untuk kembali ke halaman utama!

11 Setelah website berhasil dibuat dengan isi halaman utama, menu1, menu2, dan menu3, selanjutnya buatlah sebuah file CSS eksternal untuk mempercantik web tersebut! Elemen yang wajib diberikan style adalah: o  tiap halaman harus memiliki kesamaan style pada bagian ini. o  style yang digunakan boleh dari jenis font, besar tabel, ukuran font, warna tabel, dsb. o  style yang digunakan harus mampu memanipulasi teks atau mengubah gambar bullet dan atau numbering yang digunakan. Lihat halaman yang dikenakan CSS pada slide selanjutnya!

12

13

14

15 1. Tugas dibuat dalam satu folder dengan format nama: TTS_NIM LENGKAP Contoh: TTS_672015001 2. Folder tersebut dikompresi menjadi file.rar atau.zip dengan nama yang sama. 3. Isi folder tersebut adalah 4 file html, 1 file CSS eksternal yang sudah disebutkan di atas dan 1 folder bernama gambar untuk menampung semua gambar yang digunakan.

16 4. Contoh isi folder: 5. Semua gambar dalam folder gambar!

17 6. Dikumpulkan melalui email dalam bentuk file.rar atau.zip dengan subyek sama seperti format nama di atas yaitu TTS_NIMLENGKAP. 7. Kirimkan ke evmailoa@gmail.comevmailoa@gmail.com 8. Paling lambat tanggal 24 Februari 2015 pukul 08.00AM. Selamat Mengerjakan Ada pertanyaan silahkan bertanya lewat bbm (51FA53DF) atau sms (085747478772)