50 Contoh Soal Kelas 12 SMK Pengembangan Website
50 Contoh Soal Kelas 12 SMK Pengembangan Website – Berikut adalah 50 contoh soal pilihan ganda untuk kelas 12 SMK jurusan Pengembangan Website beserta jawabannya:
1. Apa itu HTML?
a. Bahasa pemrograman
b. Bahasa markup
c. Sistem operasi
d. Sistem database
e. Bahasa desain grafis
Jawaban: b. Bahasa markup
2. Apa tag HTML yang digunakan untuk membuat heading utama?
a. `<head>`
b. `<h1>`
c. `<header>`
d. `<h>`
e. `<title>`
Jawaban: b. `<h1>`
3. Tag HTML mana yang digunakan untuk membuat paragraf?
a. `<p>`
b. `<div>`
c. `<section>`
d. `<header>`
e. `<span>`
Jawaban: a. `<p>`
4. Apa fungsi dari tag `<a>` dalam HTML?
a. Menampilkan gambar
b. Membuat link
c. Membuat tabel
d. Menambahkan video
e. Menambahkan teks
Jawaban: b. Membuat link
5. Tag HTML `<img>` digunakan untuk:
a. Membuat gambar
b. Mengatur warna latar belakang
c. Menambahkan link
d. Menambahkan teks
e. Membuat form
Jawaban: a. Membuat gambar
6. Apa atribut yang digunakan untuk menentukan sumber gambar dalam tag `<img>`?
a. `alt`
b. `src`
c. `width`
d. `height`
e. `url`
Jawaban: b. `src`
7. Untuk menyisipkan sebuah tabel, tag yang digunakan adalah:
a. `<table>`
b. `<list>`
c. `<section>`
d. `<row>`
e. `<tr>`
Jawaban: a. `<table>`
8. Untuk menentukan kolom dalam tabel, tag yang digunakan adalah:
a. `<col>`
b. `<td>`
c. `<tr>`
d. `<th>`
e. `<table>`
Jawaban: a. `<col>`
9. Apa fungsi atribut `href` dalam tag `<a>`?
a. Menentukan lokasi file
b. Menentukan tipe file
c. Menentukan ukuran file
d. Menentukan warna teks
e. Menentukan jenis font
Jawaban: a. Menentukan lokasi file
10. Tag yang digunakan untuk membuat form di HTML adalah:
a. `<form>`
b. `<input>`
c. `<button>`
d. `<label>`
e. `<select>`
Jawaban: a. `<form>`
11. Apa itu CSS?
a. Bahasa markup
b. Bahasa pemrograman
c. Gaya untuk halaman web
d. Alat untuk membuat grafik
e. Sistem manajemen konten
Jawaban: c. Gaya untuk halaman web
12. Untuk mengubah warna latar belakang halaman menggunakan CSS, kita menggunakan properti:
a. `color`
b. `background-color`
c. `font-size`
d. `border`
e. `text-align`
Jawaban: b. `background-color`
13. Untuk mengatur ukuran teks pada elemen menggunakan CSS, kita menggunakan properti:
a. `font-size`
b. `font-family`
c. `text-align`
d. `text-decoration`
e. `letter-spacing`
Jawaban: a. `font-size`
14. Bagaimana cara mengubah warna teks dengan CSS?
a. `text-color: red;`
b. `color: red;`
c. `font-color: red;`
d. `background-color: red;`
e. `text-background: red;`
Jawaban: b. `color: red;`
15. Apa itu selector dalam CSS?
a. Komponen untuk menentukan elemen yang akan diubah
b. Jenis warna untuk latar belakang
c. Alat untuk menghubungkan dua halaman web
d. Pengaturan untuk mengubah teks
e. Format untuk gambar
Jawaban: a. Komponen untuk menentukan elemen yang akan diubah
16. Untuk mengatur jarak antara elemen, kita menggunakan properti:
a. `margin`
b. `padding`
c. `border`
d. `spacing`
e. `align`
Jawaban: a. `margin`
17. Bagaimana cara mengatur posisi elemen di tengah menggunakan CSS?
a. `position: center;`
b. `margin: auto;`
c. `float: center;`
d. `text-align: center;`
e. `display: center;`
Jawaban: b. `margin: auto;`
18. Apa yang dimaksud dengan ‘class’ dalam CSS?
a. Sebuah elemen HTML
b. Nama untuk memilih elemen yang akan diubah
c. Jenis file
d. Gaya untuk tombol
e. Alat untuk menghubungkan dua halaman web
Jawaban: b. Nama untuk memilih elemen yang akan diubah
19. Apa itu `id` dalam CSS?
a. Nama unik untuk elemen yang akan diubah
b. Jenis warna
c. Alat untuk menghubungkan dua halaman
d. Jenis font yang digunakan
e. Pengaturan ukuran gambar
Jawaban: a. Nama unik untuk elemen yang akan diubah
20. Untuk mengubah font pada teks, kita menggunakan properti:
a. `font-size`
b. `font-family`
c. `font-color`
d. `font-style`
e. `font-weight`
Jawaban: b. `font-family`
21. Apa itu JavaScript?
a. Bahasa pemrograman untuk website
b. Bahasa markup
c. Sistem pengelola konten
d. Sistem database
e. Alat untuk desain grafis
Jawaban: a. Bahasa pemrograman untuk website
22. Apa yang dilakukan fungsi `alert()` dalam JavaScript?
a. Menampilkan pesan dalam pop-up
b. Menyembunyikan elemen
c. Mengatur nilai variabel
d. Menghitung angka
e. Menyimpan data
Jawaban: a. Menampilkan pesan dalam pop-up
23. Bagaimana cara mendeklarasikan sebuah variabel di JavaScript?
a. `var x;`
b. `variable x;`
c. `x var;`
d. `let x;`
e. `const x;`
Jawaban: a. `var x;`
24. Apa yang dilakukan kode berikut: `console.log(“Hello World”);`?
a. Menampilkan pesan di halaman web
b. Menghentikan eksekusi program
c. Menampilkan pesan di konsol
d. Mengubah warna teks
e. Menyimpan data
Jawaban: c. Menampilkan pesan di konsol
25. Fungsi `document.getElementById()` digunakan untuk:
a. Mengambil elemen berdasarkan ID
b. Mengubah teks elemen
c. Menyembunyikan elemen
d. Menambahkan gambar
e. Membuat elemen baru
Jawaban: a. Mengambil elemen berdasarkan ID
26. Apa yang dimaksud dengan event dalam JavaScript?
a. Proses yang terjadi ketika pengguna berinteraksi dengan elemen
b. Gaya halaman
c. Variabel dalam program
d. Struktur data
e. Komentar dalam kode
Jawaban: a. Proses yang terjadi ketika pengguna berinteraksi dengan elemen
27. Apa fungsi dari `setTimeout()` dalam JavaScript?
a. Menunda eksekusi fungsi
b. Menghitung waktu
c. Menampilkan pop-up
d. Mengubah warna latar belakang
e. Menyimpan data
Jawaban: a. Menunda eksekusi fungsi
28. Bagaimana cara menulis komentar dalam JavaScript?
a. `// Komentar`
b. `/* Komentar */`
c. `# Komentar`
d. `<!– Komentar –>`
e. `%% Komentar %%`
Jawaban: a. `// Komentar`
29. Apa yang dimaksud dengan array dalam JavaScript?
a. Struktur data yang menyimpan elemen-elemen
b. Fungsi untuk menghitung angka
c. Teks dalam variabel
d. Alat untuk membuat elemen
e. Program untuk menampilkan pesan
Jawaban: a. Struktur data yang menyimpan elemen-elemen
30. Fungsi `addEventListener()` digunakan untuk:
a. Menambahkan event handler pada elemen
b. Mengambil elemen berdasarkan kelas
c. Mengubah ukuran elemen
d. Menambahkan komentar pada kode
e. Menyembunyikan elemen
Jawaban: a. Menambahkan event handler pada elemen
31. Apa yang dimaksud dengan responsive web design?
a. Desain yang menyesuaikan tampilan dengan ukuran layar
b. Desain yang menggunakan banyak gambar
c. Desain untuk perangkat desktop
d. Desain untuk perangkat mobile
e. Desain tanpa elemen visual
Jawaban: a. Desain yang menyesuaikan tampilan dengan ukuran layar
32. Apa itu `media query` dalam CSS?
a. Kondisi untuk menerapkan gaya berdasarkan ukuran layar
b. Gaya untuk latar belakang
c. Gaya untuk tombol
d. Pengaturan font
e. Pengaturan margin
Jawaban: a. Kondisi untuk menerapkan gaya berdasarkan ukuran layar
33. Untuk membuat website responsif pada perangkat mobile, kita bisa menggunakan:
a. `meta viewport`
b. `meta charset`
c. `div container`
d. `header`
e. `footer`
Jawaban: a. `meta viewport`
34. Apa itu fluid layout?
a. Layout yang menggunakan satuan persentase
b. Layout yang hanya digunakan untuk desktop
c. Layout yang menggunakan ukuran tetap
d. Layout yang menggunakan gambar besar
e. Layout yang tidak responsif
Jawaban: a. Layout yang menggunakan satuan persentase
35. Apa fungsi dari `flexbox` dalam CSS?
a. Mengatur tata letak elemen secara fleksibel
b. Menambahkan gambar latar belakang
c. Menentukan ukuran gambar
d. Menambah elemen pada halaman
e. Mengatur animasi
Jawaban: a. Mengatur tata letak elemen secara fleksibel
36. Apa itu grid system dalam desain web?
a. Sistem layout yang mengatur kolom dan baris
b. Sistem untuk menambah gambar
c. Sistem untuk membuat tabel
d. Sistem untuk mengubah warna latar belakang
e. Sistem untuk menambah elemen video
Jawaban: a. Sistem layout yang mengatur kolom dan baris
37. Bagaimana cara membuat kolom yang bisa diatur lebar dan panjangnya dalam CSS?
a. Menggunakan `flexbox`
b. Menggunakan `border`
c. Menggunakan `font-size`
d. Menggunakan `text-align`
e. Menggunakan `margin`
Jawaban: a. Menggunakan `flexbox`
38. Apa itu breakpoint dalam desain responsif?
a. Titik di mana layout halaman berubah berdasarkan ukuran layar
b. Area tempat gambar disisipkan
c. Ukuran gambar pada perangkat mobile
d. Ukuran teks yang digunakan
e. Posisi elemen dalam halaman
Jawaban: a. Titik di mana layout halaman berubah berdasarkan ukuran layar
39. Pada mobile-first design, elemen halaman web diatur untuk:
a. Perangkat mobile terlebih dahulu
b. Perangkat desktop terlebih dahulu
c. Perangkat tablet terlebih dahulu
d. Perangkat pintar terlebih dahulu
e. Semua perangkat tanpa perubahan
Jawaban: a. Perangkat mobile terlebih dahulu
40. Untuk menampilkan gambar responsif di CSS, kita dapat menggunakan properti:
a. `width: 100%`
b. `width: auto`
c. `height: auto`
d. `resize: both`
e. `max-width: 100%`
Jawaban: e. `max-width: 100%`
41. Apa itu CMS (Content Management System)?
a. Sistem untuk mengelola konten web
b. Sistem untuk mengubah kode HTML
c. Alat untuk membuat animasi
d. Sistem pengelola database
e. Sistem untuk menghubungkan server
Jawaban: a. Sistem untuk mengelola konten web
42. Apa keuntungan menggunakan CMS seperti WordPress?
a. Mudah digunakan tanpa keterampilan teknis
b. Menghasilkan kode HTML manual
c. Memerlukan keterampilan pengkodean tinggi
d. Hanya cocok untuk situs pribadi
e. Tidak mendukung desain responsif
Jawaban: a. Mudah digunakan tanpa keterampilan teknis
43. Framework yang banyak digunakan untuk pengembangan website dinamis adalah:
a. Django
b. WordPress
c. JavaScript
d. PHP
e. Python
Jawaban: a. Django
44. Laravel adalah framework untuk pengembangan website menggunakan bahasa pemrograman:
a. PHP
b. JavaScript
c. Python
d. Ruby
e. Java
Jawaban: a. PHP
45. Apa itu Bootstrap dalam pengembangan web?
a. Framework CSS untuk desain responsif
b. Alat untuk menambahkan gambar
c. Sistem database
d. Alat untuk optimasi gambar
e. Alat pengujian kecepatan
Jawaban: a. Framework CSS untuk desain responsif
46. Apa tujuan utama menggunakan framework dalam pengembangan website?
a. Meningkatkan kecepatan dan efisiensi
b. Mengurangi biaya pembuatan website
c. Menghasilkan tampilan yang lebih menarik
d. Menambahkan banyak plugin
e. Membuat website lebih aman
Jawaban: a. Meningkatkan kecepatan dan efisiensi
47. Sistem manajemen konten (CMS) yang paling populer saat ini adalah:
a. WordPress
b. Joomla
c. Drupal
d. Magento
e. Blogger
Jawaban: a. WordPress
48. Framework JavaScript yang populer untuk pengembangan web front-end adalah:
a. React
b. Django
c. Laravel
d. Ruby on Rails
e. Flask
Jawaban: a. React
49. Apa yang dimaksud dengan plugin di WordPress?
a. Fitur tambahan yang memperluas fungsi website
b. Alat untuk menambahkan gambar
c. Sistem untuk mendesain template
d. Sistem untuk mengelola pengguna
e. Sistem untuk menambahkan video
Jawaban: a. Fitur tambahan yang memperluas fungsi website
50. Apa yang dimaksud dengan template di CMS?
a. Desain atau struktur halaman yang sudah jadi
b. Sistem pengelola database
c. Alat untuk membuat animasi
d. Sistem untuk menambah gambar
e. Alat untuk menambah elemen
Jawaban: a. Desain atau struktur halaman yang sudah jadi
Sekian 50 Contoh Soal Kelas 12 SMK Pengembangan Website, Semoga Bermanfaat. Baca Juga 50 Contoh Soal Kelas 12 SMK Manajemen Pemasaran