Tantangan Website UKM IK

Tantangan ini meliputi penyelesaian tugas pembuatan website dasar organisasi UKM Informatika & Komputer. File HTML yang disediakan mencakup placeholder yang ditandai dengan komentar TODO. Tugas Anda adalah mengisi placeholder ini dan menyelesaikan tugas berikut:

Tugas HTML

Tugas 1: Import CSS

Impor file CSS yang disediakan di folder ini menggunakan tag <link> di bagian <head>.

Tugas 2: Title

Isi bagian <header> dengan logo organisasi, nama, dan navbar.
- Tambahkan logo UKMIK menggunakan tag <img>. (Petunjuk: File gambarnya adalah "logo_ukmik.png" di folder ini).
- Tambahkan nama organisasi dalam tag <h1> dengan teks "UKM Informatika & Komputer".
- Buat navbar menggunakan tag <nav> dengan daftar item menu menggunakan <ul> dan <li>.
- Setiap item menu harus menggunakan tag <a> dengan atribut href yang menunjuk ke id bagian terkait.

Tugas 3: About Us

Isi <section id="about"> dengan informasi tentang organisasi.
- Tambahkan tag <h2> dengan teks "Tentang Kami".
- Sertakan satu atau lebih tag <p> dengan deskripsi organisasi.

Tugas 4: Our Departement

Isi <section id="departement"> dengan informasi tentang masing-masing departemen.
- Tambahkan tag <h2> dengan teks "Departemen Kami".
- Buat <div> terpisah atau tag lain untuk setiap departemen menggunakan kelas "departemen".
- <div> setiap departemen harus memiliki dua anak:
  1. Tag <h1> untuk nama departemen.
  2. Tag <p> dengan penjelasan singkat tentang departemen.

Tugas 5: Contact Us

Isi <section id="contact"> dengan formulir kontak sederhana.
- Tambahkan tag <h2> dengan teks "Hubungi Kami".
- Buat formulir kontak menggunakan tag <form>, termasuk kolom input untuk nama, email, pesan, dan tombol kirim.

Tugas 6: Footer

Tambahkan tag <footer> dengan informasi hak cipta dan organisasi.
- Sertakan informasi hak cipta dan rincian kontak yang relevan atau informasi lainnya.

Tugas CSS

Tugas 1: Responsif Styles

Tambahkan aturan media query untuk layar dengan lebar kurang dari 768px.
Sesuaikan gaya elemen-elemen berikut agar tampilan website tetap baik pada layar kecil:
- Body
- Header dan logo
- Daftar menu
- Bagian-bagian section
- Departemen
- Formulir kontak
- Tombol dan elemen-elemen lainnya

Contoh aturan media query sudah disediakan di dalam File CSS. Silakan sesuaikan nilai-nilai sesuai dengan desain responsif yang diinginkan.

Jangan ragu untuk menyesuaikan konten dan gaya sesuai kebutuhan. Setelah selesai, Anda harus memiliki struktur website dasar untuk organisasi UKM Informatika & Komputer.

Jika mengalami kesulitan & kendala jangan ragu untuk bertanya ke mentor.

Good Luck!

yandiaan / challange-studyclub-1