Apa fungsi dari CSS dalam pengembangan web?

Memberikan gaya dan tata letak pada elemen halaman web

Menghubungkan halaman web ke server

Apa kegunaan dari tag <form> dalam HTML?

Menampilkan formulir input data pengguna

Apa fungsi utama dari JavaScript dalam pengembangan web?

Menambahkan interaktivitas pada halaman web

Apa fungsi tag <head> dalam HTML?

Untuk menyimpan informasi meta dan link ke file CSS/JS

Apa fungsi dari display: none; di CSS?

Menyembunyikan elemen dari halaman tanpa menghapusnya

Menyusun elemen di tengah halaman

Seorang desainer web membuat sebuah halaman website yang memuat informasi tentang sebuah restoran. Elemen-elemen berikut digunakan dalam website tersebut: Header : Berisi logo restoran, navigasi utama, dan informasi kontak. Main Content : Berisi menu makanan, foto-foto, dan deskripsi singkat. Footer : Menyediakan tautan ke media sosial, alamat restoran, dan formulir kontak Jika elemen header dihapus dari halaman ini, apa dampak terbesar terhadap pengalaman pengguna?

Pengguna akan kehilangan akses ke informasi utama dan navigasi.

Pengguna akan kesulitan menemukan menu makanan.

Tidak ada perubahan signifikan pada pengalaman pengguna.

Footer akan menggantikan fungsi header secara otomatis.

Pengguna akan kesulitan mengakses tautan media sosial

Sebuah website e-commerce baru saja dirilis, tetapi pengunjung mengeluhkan bahwa mereka kesulitan menemukan produk yang diinginkan. Berikut adalah elemen-elemen yang digunakan di halaman produk: Sidebar Filter : Untuk menyaring kategori produk. Grid View : Untuk menampilkan produk dengan gambar kecil tanpa deskripsi lengkap. Search Bar : Untuk mencari produk secara langsung. Elemen apa yang perlu ditingkatkan untuk memperbaiki navigasi pengguna?

Tambahkan deskripsi lengkap pada Grid View.

Hapus Sidebar Filter agar halaman lebih bersih.

Tambahkan animasi pada Search Bar.

Perkecil ukuran gambar pada Grid View.

Gunakan menu dropdown untuk menggantikan Sidebar Filter.

Anda diminta membuat prototipe website edukasi dengan tema "Belajar HTML dan CSS". Elemen mana yang paling relevan untuk mendukung pembelajaran interaktif?

Video tutorial dan area latihan langsung (live editor).

Header dengan animasi berlebihan.

Tabel statis yang hanya menjelaskan definisi HTML.

Halaman penuh teks tanpa multimedia.

Menu dropdown yang rumit dan sulit dinavigasi.

Sebuah website berita menggunakan elemen-elemen berikut: Carousel : Untuk menampilkan berita utama secara bergulir. Sidebar : Untuk menampilkan berita populer dan kategori berita. Main Content Area : Menampilkan artikel berita lengkap. Jika target audiens website adalah pembaca dengan usia 50 tahun ke atas, elemen mana yang perlu dioptimalkan?

Menghapus Carousel karena dapat membingungkan.

Mengurangi ukuran teks pada Main Content Area.

Menambahkan efek transisi animasi di Sidebar.

Menghilangkan Sidebar sepenuhnya.

Menambah jumlah berita pada Carousel agar lebih informatif.

Sebuah perusahaan ingin meningkatkan performa website mereka di perangkat mobile. Namun, mereka menemukan bahwa elemen-elemen seperti tabel harga, galeri gambar, dan form pendaftaran sering kali menyebabkan waktu loading menjadi lambat. Apa langkah terbaik untuk mengoptimalkan elemen-elemen tersebut?

Mengompresi gambar di galeri dan mengurangi jumlah gambar.

Menghapus tabel harga dari versi mobile.

Menghapus semua elemen form pendaftaran.

Menggunakan animasi tambahan pada tabel harga untuk menarik perhatian.

Memperbesar ukuran form pendaftaran agar lebih mudah dilihat.

Sebuah developer membuat website dengan struktur berikut: <header> <nav> <ul> <li><a href="#">Beranda</a></li> <li><a href="#">Tentang Kami</a></li> <li><a href="#">Kontak</a></li> </ul> </nav> </header> <section> <h1>Judul Artikel</h1> <p>Ini adalah paragraf pertama artikel.</p> </section> <footer> <p>Hak Cipta © 2024</p> </footer> Namun, ketika diuji coba, tampilan navigasi tidak muncul di halaman website. Apa kemungkinan penyebab masalah tersebut?

Tidak ada CSS yang mengatur elemen navigasi tersebut.

Tag <header> tidak mendukung tag <nav>.

Tag <ul> tidak memiliki atribut class atau id.

Tag <footer> menyebabkan konflik dengan elemen <nav>.

Tag <section> tidak memiliki tag pembuka dan penutup yang lengkap.

Seorang siswa diminta membuat tampilan grid layout menggunakan CSS yang harus memenuhi kriteria berikut: 1. Memiliki 3 kolom yang masing-masing berukuran sama. 2. Memiliki jarak antar-kolom sebesar 20px. 3. Kolom harus responsif dan dapat menyesuaikan ukuran layar. Manakah properti CSS yang paling tepat untuk memenuhi kriteria tersebut?

display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;

display: flex; justify-content: center; gap: 20px;

display: table; width: 100%; border-spacing: 20px;

display: block; margin: auto; padding: 20px;

display: inline-block; width: 33%; margin-right: 20px;

Seorang developer membuat form login berikut: <form action="/login" method="post"> <label for="email">Email:</label> <input type="email" id="email" name="email"> <label for="password">Password:</label> <input type="password" id="password" name="password"> <button type="submit">Login</button> </form> Namun, pengguna melaporkan bahwa ketika mereka memasukkan data yang salah, tidak ada pesan kesalahan yang muncul. Apa langkah terbaik untuk meningkatkan form ini?

Menambahkan validasi menggunakan JavaScript untuk memberikan pesan kesalahan.

Menambahkan placeholder pada input untuk memandu pengguna.

Menggunakan atribut required pada kedua input.

Mengganti metode post menjadi get untuk melihat data input di URL.

Menambahkan lebih banyak label untuk memperjelas fungsi form.

HTML menggunakan elemen untuk membuat struktur sebuah dokumen web. Seorang siswa menulis kode berikut: <h1>Judul Website</h1> <p>Ini adalah paragraf pertama.</p> <div> <p>Ini adalah paragraf kedua.</p> </div> Apa kelebihan penggunaan elemen <div> dalam struktur HTML di atas?

Memberikan struktur yang lebih fleksibel untuk gaya menggunakan CSS.

Membantu meningkatkan aksesibilitas konten.

Membuat paragraf lebih menarik dengan desain otomatis.

Mengubah elemen menjadi responsif tanpa CSS tambahan.

Menghapus kebutuhan untuk menggunakan elemen lain seperti <p>.

CSS digunakan untuk memperindah tampilan HTML. Berikut adalah beberapa cara menghubungkan CSS dengan dokumen HTML: 1. Inline CSS 2. Internal CSS 3. External CSS Jika sebuah website besar memiliki lebih dari 100 halaman, metode mana yang paling efisien dan mengapa?

External CSS karena gaya dapat digunakan ulang di seluruh halaman.

Inline CSS karena perubahan dapat dilakukan langsung di setiap elemen.

Internal CSS karena lebih mudah diatur dalam satu file HTML.

Internal CSS karena tidak memerlukan file terpisah.

Inline CSS karena dapat dioptimalkan untuk setiap elemen unik.

Seorang siswa ingin membuat sebuah tabel menggunakan HTML untuk menampilkan data jadwal pelajaran sebagai berikut: Kode HTML mana yang paling tepat untuk membuat tabel tersebut?

<table> <tr><th>Hari</th><th>Mata Pelajaran</th><th>Jam</th></tr> <tr><td>Senin</td><td>Matematika</td><td>08:00</td></tr> <tr><td>Selasa</td><td>Bahasa Inggris</td><td>10:00</td></tr> </table>

<table> <tr><td>Hari</td><td>Mata Pelajaran</td><td>Jam</td></tr> <tr><td>Senin</td><td>Matematika</td><td>08:00</td></tr> </table>

<table> <td>Hari</td> <td>Senin</td> <td>Matematika</td> <td>08:00</td> </table>

<table> <tr><td>Hari</td><td>Mata Pelajaran</td></tr> <tr><td>Senin</td><td>08:00</td></tr> </table>

<table> <tr><th>Hari</th></tr> <tr><td>Senin</td></tr> </table>

Seorang siswa ingin membuat tautan yang, ketika diklik, membuka halaman baru. Bagaimana cara menuliskannya dalam HTML?

<a href=" Klik">https://example.com">Klik di sini</a>

Berikut adalah struktur HTML: <a href=" https://example.com " title="Contoh Tautan">Klik di sini</a> Apa fungsi atribut title dalam tag <a>?

Menampilkan teks tambahan ketika kursor diarahkan ke tautan.

Menentukan ukuran font teks tautan.

Menambahkan animasi pada teks tautan.

Mengganti teks "Klik di sini" secara otomatis.

Sebuah halaman HTML menggunakan elemen berikut: <table> <tr> <td>Nama</td> <td>Usia</td> </tr> <tr> <td>Ali</td> <td>25</td> </tr> </table> Developer ingin menambahkan judul kolom pada tabel ini agar lebih jelas. Elemen HTML apa yang harus digunakan?

Ganti <td> dengan <th> pada baris pertama.

Tambahkan atribut caption pada elemen <table>.

Tambahkan elemen <thead> sebelum baris pertama.

Tambahkan elemen <title> di dalam tabel.

Anda diminta untuk membuat daftar kategori produk yang akan ditampilkan pada halaman utama sebuah toko online. Setiap kategori terdiri dari nama kategori dan gambar ikon yang menggambarkan kategori tersebut. Tag HTML manakah yang paling tepat digunakan untuk membuat daftar kategori ini dengan format yang terstruktur dan dapat dipahami dengan mudah oleh pengguna dan mesin pencari?

Menggunakan elemen <ul> dengan elemen <li> untuk setiap kategori, dan menyertakan gambar di dalam setiap elemen <li>

Menggunakan elemen <ol> untuk membuat daftar terurut dengan nama kategori

Menggunakan elemen <dl> untuk mendefinisikan kategori dan deskripsi

Menggunakan elemen <table> untuk menata kategori dalam baris dan kolom

Menggunakan elemen <div> untuk setiap kategori dan menambahkan gambar sebagai latar belakang

Pada sebuah halaman web berita, Anda ingin membuat daftar topik-topik utama dengan setiap topik diikuti oleh beberapa artikel terkait. Bagaimana Anda sebaiknya menyusun struktur HTML untuk mencapai tujuan ini?

Menggunakan <ol> untuk daftar topik utama dan <ul> untuk daftar artikel di dalam setiap item topik

Menggunakan <ul> untuk daftar topik dan <ol> untuk daftar artikel terkait di dalam setiap item topik

Menggunakan <dl> untuk mendefinisikan topik dan artikel dalam format deskripsi

Menggunakan <nav> untuk mendefinisikan daftar topik dan artikel

Menggunakan <div> untuk membuat daftar dengan menambahkan tag <p> untuk setiap artikel terkait

Anda ingin menampilkan daftar menu navigasi horizontal di bagian atas halaman dengan menggunakan tag HTML. Menu harus ditata sedemikian rupa sehingga setiap item menu muncul secara horizontal. Tag HTML dan CSS yang tepat untuk ini adalah...

Gunakan <ul> untuk daftar menu, dan atur setiap <li> menjadi inline dengan CSS display: inline

Gunakan <ol> untuk daftar menu, dan atur setiap <li> menjadi inline dengan CSS display: block

Gunakan <nav> untuk daftar menu, dan atur setiap <a> menjadi inline dengan CSS display: inline-block

Gunakan <dl> untuk daftar menu, dengan <dt> untuk setiap item dan <dd> untuk deskripsi menu

Gunakan <ul> untuk daftar menu, dan setiap item menu dibuat menggunakan elemen <span>

Studi Kasus: Pada halaman produk e-commerce, Anda ingin menampilkan daftar produk beserta harga dan deskripsi singkatnya. Setiap produk harus terdiri dari nama produk, gambar, harga, dan deskripsi. Daftar produk akan ditampilkan secara terurut berdasarkan kategori produk. Pertanyaan: Tag HTML manakah yang paling tepat untuk menampilkan daftar produk ini dengan struktur yang jelas dan mudah dipahami?

Gunakan <ul> untuk daftar produk, dan setiap produk dalam elemen <li> dengan nama, gambar, harga, dan deskripsi di dalamnya

Gunakan <ol> untuk daftar produk, dan setiap produk dalam elemen <li>

Gunakan <dl> dengan <dt> untuk nama produk dan <dd> untuk harga dan deskripsi

Gunakan <table> untuk menampilkan produk dalam baris dan kolom

Gunakan <section> untuk setiap kategori produk dan <div> untuk setiap produk

Studi Kasus: Anda sedang membuat halaman web yang menampilkan daftar pertanyaan yang sering diajukan (FAQ). Setiap pertanyaan diikuti oleh jawaban. Anda ingin menggunakan struktur HTML yang tepat untuk memastikan bahwa informasi ini mudah diakses dan dipahami oleh pengunjung. Pertanyaan: Tag HTML yang paling tepat untuk menampilkan daftar FAQ adalah...

Gunakan <dl> dengan <dt> untuk pertanyaan dan <dd> untuk jawaban

Gunakan <ul> dengan elemen <li> untuk setiap pertanyaan, dan jawaban di dalam elemen <p>

Gunakan <ol> dengan elemen <li> untuk setiap pertanyaan dan jawaban

Gunakan <section> untuk setiap pertanyaan dan <article> untuk jawaban

Gunakan <nav> untuk daftar pertanyaan dan jawaban

Asessmen Sumatif Akhir Semester Gasal 24/25 Kelas XI

11th Grade

•

50 Qs

Similar activities

quiz dasar pengenalan corel draw

11th Grade

•

50 Qs

UJIAN AKHIR TAHUN: REKA BENTUK DAN TEKNOLOGI TINGKATAN 2

10th - 12th Grade

•

55 Qs

PSTS Desain Komunikasi Visual Semester Gasal 2025

11th Grade

•

50 Qs

KONSENTRASI KEAHLIAN GRAFIKA (TEKNIK CETAK)

11th Grade

•

50 Qs

Mapel Pilihan DKV Kelas XI

11th Grade

•

50 Qs

Ulangan Harian Desain Komunikasi Visual

11th Grade

•

45 Qs

REMEDIAL DASAR KOMUNIKASI

11th Grade

•

50 Qs

Remedial MapelPil DKV Kelas XI (Uji Pengetahuan Fitur Canva)

11th Grade

•

50 Qs

Asessmen Sumatif Akhir Semester Gasal 24/25 Kelas XI

Quiz

•

Design

•

11th Grade

•

Practice Problem

•

Easy

Khoirun F

Used 7+ times

FREE Resource

50 questions

Show all answers

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Apa itu Web Browser?

Alat untuk mengedit halaman web

Aplikasi untuk mengakses dan menampilkan halaman web

Bahasa pemrograman untuk membuat situs web

Server tempat menyimpan halaman web

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Apa fungsi utama dari HTML dalam pengembangan web?

Memberikan gaya pada halaman web

Menyusun struktur dan konten pada halaman web

Menghubungkan halaman web ke basis data

Menganimasikan elemen halaman web

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Tag HTML apa yang digunakan untuk menampilkan gambar?

<img>

<image>

<src>

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Apa fungsi tag <a> dalam HTML?

Menyisipkan gambar

Membuat tautan (link) ke halaman lain

Menampilkan audio

Menampilkan video

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Apa fungsi dari atribut alt pada tag <img>?

Mengubah ukuran gambar

Memberikan teks alternatif jika gambar tidak dapat ditampilkan

Menambahkan tautan ke gambar

Menambah animasi pada gambar

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Tag HTML apa yang digunakan untuk membuat tabel?

<tbl>

<tr>

<table>

<tab>

MULTIPLE CHOICE QUESTION

45 sec • 2 pts

Apa kepanjangan dari CSS?

Cascading Style Sheets

Computer Style Sheets

Creative Style Sheets

Colorful Style Sheets

Create a free account and access millions of resources

Create resources

Host any resource

Get auto-graded reports

Continue with Google

Continue with Email

Continue with Classlink

Continue with Clever

or continue with

Microsoft

Apple

Others

Already have an account?

Similar Resources on Wayground

50 questions

REMIDI ASAS GANJIL PDB KELAS XI

Quiz

•

11th Grade

50 questions

KUIS DKV 1

Quiz

•

9th - 12th Grade

50 questions

Desain brief

Quiz

•

11th Grade

Popular Resources on Wayground

10 questions

Honoring the Significance of Veterans Day

Interactive video

•

6th - 10th Grade

9 questions

FOREST Community of Caring

Lesson

•

1st - 5th Grade

10 questions

Exploring Veterans Day: Facts and Celebrations for Kids

Interactive video

•

6th - 10th Grade

19 questions

Veterans Day

Quiz

•

5th Grade

14 questions

General Technology Use Quiz

Quiz

•

8th Grade

25 questions

Multiplication Facts

Quiz

•

5th Grade

15 questions

Circuits, Light Energy, and Forces

Quiz

•

5th Grade

19 questions

Thanksgiving Trivia

Quiz

•

6th Grade

Discover more resources for Design

28 questions

Ser vs estar

Quiz

•

9th - 12th Grade

20 questions

Thanksgiving Trivia

Quiz

•

11th Grade

34 questions

Geometric Terms

Quiz

•

9th - 12th Grade

20 questions

-AR -ER -IR present tense

Quiz

•

10th - 12th Grade

16 questions

Proportional Relationships And Constant Of Proportionality

Quiz

•

7th - 12th Grade

10 questions

DNA Replication Concepts and Mechanisms

Interactive video

•

7th - 12th Grade

10 questions

Unit 2: LS.Bio.1.5-LS.Bio.2.2 Power Vocab

Quiz

•

9th - 12th Grade

20 questions

Food Chains and Food Webs

Quiz

•

7th - 12th Grade

Asessmen Sumatif Akhir Semester Gasal 24/25 Kelas XI

50 questions

Apa itu Web Browser?

Apa fungsi utama dari HTML dalam pengembangan web?

Tag HTML apa yang digunakan untuk menampilkan gambar?

Apa fungsi tag <a> dalam HTML?

Apa fungsi dari atribut alt pada tag <img>?

Tag HTML apa yang digunakan untuk membuat tabel?

Apa kepanjangan dari CSS?

Apa fungsi dari CSS dalam pengembangan web?

Properti CSS apa yang digunakan untuk mengubah warna latar belakang elemen?

Apa arti dari atribut href dalam tag <a>?

Create a free account and access millions of resources

Similar Resources on Wayground

Popular Resources on Wayground

Discover more resources for Design