wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

LATIHAN SOAL PRAKARYA-REKAYASA KELAS XII

Total questions: 50

Worksheet time: 25mins

Name
Class
Date
1.

Dalam konteks kewirausahaan digital, apa tujuan utama merancang website sebelum membangunnya?

a)

Agar struktur, tujuan, dan kebutuhan pengguna jelas sejak awal

b)

Agar dapat langsung menghasilkan keuntungan

c)

Agar desain lebih menarik dibanding kompetitor

d)

Agar tidak perlu menggunakan bahasa pemrograman lain

e)

Agar bisa tampil di media sosial secara otomatis

2.

Seorang siswa diminta merancang website untuk memasarkan produk lokal. Langkah pertama yang sebaiknya dilakukan adalah…

a)

Menganalisis kebutuhan pengguna dan tujuan website

b)

Membuat form pemesanan

c)

Menentukan domain dan hosting

d)

Mendesain CSS untuk halaman utama

e)

Membuat database produk

3.

Jika sebuah perusahaan hanya mengandalkan brosur cetak untuk promosi produk rekayasa, dampak negatifnya dibandingkan dengan promosi lewat website adalah ….

a)

Informasi terbatas dan sulit diperbarui

b)

Biaya produksi lebih murah

c)

Informasi lebih cepat menyebar

d)

Konsumen lebih mudah mengakses produk

e)

Perusahaan lebih dikenal luas

4.

Fungsi utama deklarasi pada awal dokumen HTML adalah...

a)

Memberitahu browser bahwa dokumen menggunakan standar HTML5

b)

Menentukan encoding karakter halaman

c)

Mengaktifkan JavaScript

d)

Mengatur tampilan halaman

e)

Menghubungkan file CSS

5.

Elemen <html lang="id"> berfungsi untuk...

a)

Menentukan font bahasa Indonesia

b)

Membuat halaman bisa dibaca mesin pencari dan pembaca layar dalam Bahasa Indonesia

c)

Menyimpan metadata tambahan

d)

Mengatur struktur heading

e)

Mengubah mode warna

6.

Salah satu manfaat utama website bagi rekayasa produk adalah ….

a)

Menyulitkan promosi

b)

Menjadi sarana promosi digital

c)

Membatasi akses pasar

d)

Menghapus jejak digital

e)

Mengurangi inovasi produk

7.

Software yang digunakan untuk membuka halaman web disebut ….

a)

Compiler

b)

Browser

c)

EditoR

d)

Hosting

e)

Server

8.

Tag <head> dan <body> memiliki perbedaan utama yaitu...

a)

<head> untuk konten visual, <body> untuk metadata

b)

<head> untuk metadata, <body> untuk konten yang terlihat pengguna

c)

Keduanya menampilkan isi halaman

d)

<head> untuk styling inline

e)

<body> berisi skrip eksternal

9.

Struktur HTML yang benar adalah...

a)

<html><body><head>...</head></body></html>

b)

<head><body><html>...</html></body></head>

c)

<html><head>...</head><body>...</body></html>

d)

<body><head><html></html></head></body>

e)

<html><meta><body></body></html>

10.

Atribut alt dalam tag <img> penting untuk...

a)

Menambah ukuran gambar

b)

Mengatur posisi gambar

c)

Membantu SEO dan pembaca layar ketika gambar gagal dimuat

d)

Memberi efek bayangan

e)

Mempercepat loading

11.

Elemen <main> dalam HTML5 berfungsi...

a)

Untuk styling tombol

b)

Sebagai header halaman

c)

Menandai isi utama halaman

d)

Untuk metadata

e)

Untuk menutup tag body

12.

File HTML biasanya disimpan dengan ekstensi ...

a)

.docx

b)

.pdf

c)

.htm atau .html

d)

.css

e)

.js

13.

<head> dalam HTML berfungsi untuk…

a)

menampilkan konten web

b)

menampilkan teks tebal

c)

menyimpan informasi metadata & judul

d)

menampilkan gambar

e)

membuat form

14.

Elemen <body> digunakan untuk…

a)

mengatur hyperlink

b)

menyimpan CSS

c)

menyimpan script server

d)

menampilkan semua konten utama web

e)

menyimpan database

15.

Atribut bgcolor="black" pada tag <body> digunakan untuk …

a)

Mengubah warna teks hitam

b)

Mengubah warna heading hitam

c)

Mengubah warna garis hitam

d)

Mengubah background menjadi hitam

e)

Mengubah warna link hitam

16.

Bagaimana perintah menentukan ukuran huruf ...

a)

<font text=”...”>

b)

<font face=”...”>

c)

<font color=”...”>

d)

<font size=”...”>

e)

<font =”...”>

17.

Perhatikan potongan kode berikut:

<body text="red" bgcolor="black">

<p align="center"><b>Belajar HTML</b></p>

</body>

Jika dijalankan pada browser, hasil tampilan teks adalah …

a)

Teks berwarna merah, latar belakang merah, teks tebal rata kiri

b)

Teks berwarna hitam, latar belakang hitam, teks rata tengah

c)

Teks berwarna merah, latar belakang putih, teks tebal rata kiri

d)

Teks berwarna merah, latar belakang hitam, teks tebal rata tengah

e)

Teks hitam, latar belakang putih, teks tebal rata kiri

18.

Kelebihan HTML5 dibanding versi sebelumnya adalah...

a)

Tidak mendukung CSS

b)

Tidak kompatibel dengan browser lama

c)

Hanya untuk desktop

d)

Mendukung tag semantik baru seperti <section>, <article>, <nav>

e)

Tidak ada perbedaan

19.

Untuk mengatur teks agar tebal di Tailwind digunakan class...

a)

text-bold

b)

bold-text

c)

text-weight

d)

fw-bold

e)

font-bold

20.

Class hidden md:block artinya...

a)

Selalu tampil

b)

Disembunyikan di semua ukuran layar

c)

Muncul hanya di mobile

d)

Tidak berfungsi di Tailwind

e)

Tersembunyi di layar kecil, muncul di layar medium ke atas

21.

Untuk memberi warna latar belakang kuning muda digunakan class...

a)

bg-lightyellow

b)

bg-yellow

c)

yellow-bg

d)

background-yellow

e)

bg-yellow-100

22.

Untuk mengganti tema dark/light menggunakan JavaScript, digunakan perintah...

a)

body.toggleTheme()

b)

theme.switch()

c)

setTheme()

d)

darkMode.enable()

e)

document.body.classList.toggle("dark")

23.

Elemen <iframe> dapat digunakan untuk...

a)

Membuat daftar

b)

Mengatur warna

c)

Membuat form

d)

Menyimpan data

e)

Menampilkan konten dari sumber eksternal seperti Google Maps

24.

Dalam JavaScript, DOM singkatan dari...

a)

Document Object Model

b)

Data Object Mode

c)

Dynamic Order Model

25.

Fungsi utama fetch() dalam JavaScript adalah...

a)

Mengambil data dari server

b)

Menyimpan data di localStorage

c)

Membuat elemen HTML

d)

Menghapus CSS

e)

Mengubah warna teks

26.

Fitur Code di Canva AI memungkinkan pengguna…

a)

Menulis dan mengeksekusi potongan kode untuk menghasilkan visual

b)

Membuat presentasi otomatis dari dokumen

c)

Menghapus latar gambar

d)

Mencetak desain langsung

e)

Membuat prototipe aplikasi mobile

27.

Keunggulan utama menggunakan Canva AI Code Mode untuk web designer adalah…

a)

Hanya mendukung bahasa Python

b)

Menghasilkan visual berbasis kode secara langsung

c)

Mempercepat proses rendering video

d)

Mengedit template bawaan saja

e)

Mengurangi ukuran file HTML

28.

Dalam pembuatan website, Gemini pada fitur Canvas dapat membantu dengan…

a)

Membuat animasi 3D berkualitas tinggi

b)

Menghasilkan teks, kode, dan brainstorming dalam satu ruang kerja

c)

Menghapus bug dalam browser

d)

Mengirim file ke GitHub otomatis

e)

Menjalankan server lokal

29.

Apa kelebihan Gemini Canvas dibandingkan chatbot standar?

a)

Hanya mampu menjawab perintah berbasis suara

b)

Memiliki ruang kerja kolaboratif multimodal

c)

Tidak dapat mengekspor dokumen

d)

Tidak mendukung kode

e)

Hanya bisa digunakan offline

30.

Editor teks berperan penting dalam pembuatan website karena…

a)

Menghasilkan gambar otomatis

b)

Menyediakan lingkungan penulisan dan pengeditan kode HTML, CSS, JavaScript

c)

Membuat video animasi

d)

Menghapus malware dari browser

e)

Meningkatkan kecepatan jaringan

31.

Contoh teks editor yang paling umum digunakan untuk web development adalah…

a)

VLC Media Player

b)

Visual Studio Code / Notepad ++

c)

BlueStacks

d)

Adobe Premiere

e)

PowerPoint

32.

Dalam penggunaan Canva AI Code, output yang dihasilkan biasanya berupa…

a)

File executable

b)

Data server

c)

Gambar atau visual yang di-render dari kode

d)

Video animasi

e)

File musik

33.

Jika seorang siswa ingin mendokumentasikan kode sambil berdiskusi dengan AI dalam satu halaman yang sama, ia sebaiknya menggunakan…

a)

Canva Editor

b)

Notepad biasa

c)

Gemini Canvas

d)

Terminal Linux

e)

Aplikasi foto editor

34.

Keunggulan Gemini Canvas untuk pembelajaran coding adalah…

a)

Tidak bisa membaca file

b)

Hanya menulis jawaban singkat

c)

Dapat menampilkan penjelasan, kode, dan revisi secara interaktif

d)

Tidak mendukung JavaScript

e)

Tidak bisa digunakan untuk brainstorming

35.

Saat membuat website, kombinasi ideal alat untuk belajar desain sekaligus coding adalah…

a)

Hanya Canva

b)

Hanya Gemini

c)

Canva AI untuk visual + Gemini Canvas untuk penjelasan + teks editor untuk implementasi kode

d)

Hanya Notepad

e)

Hanya editor gambar

36.

Pada CSS, properti margin berfungsi untuk…

a)

Mengatur jarak dalam elemen

b)

Mengatur warna teks

c)

Mengatur jarak luar elemen

d)

Mengubah jenis huruf

e)

Mengatur ukuran gambar

37.

Elemen <footer> dalam HTML digunakan untuk…

a)

Menampilkan menu navigasi

b)

Menampilkan bagian bawah halaman seperti kontak atau copyright

c)

Menyimpan script

d)

Menyimpan gambar

e)

Menampilkan judul halaman

38.

Atribut href pada tag <a> digunakan untuk…

a)

Menentukan ukuran hyperlink

b)

Menentukan jenis tombol

c)

Menentukan alamat tujuan tautan

d)

Mengatur warna tautan

e)

Mengatur hover effect

39.

Keunggulan menggunakan CSS eksternal adalah…

a)

Hanya bisa digunakan pada satu halaman

b)

Membuat kode lebih panjang

c)

Memisahkan tampilan dari struktur sehingga lebih rapi dan mudah dikelola

d)

Tidak bisa dipakai untuk website besar

e)

Tidak bisa mengatur warna

40.

Tag <video> dalam HTML digunakan untuk…

a)

Menampilkan musik

b)

Menampilkan video di web

c)

Menghubungkan web dengan kamera

d)

Menjalankan JavaScript

e)

Mengirim file

41.

Manfaat AI dalam kewirausahaan digital adalah…

a)

Menghentikan promosi otomatis

b)

Mempersempit jangkauan pasar

c)

Memberikan rekomendasi produk dan personalisasi

d)

Membatasi pengunjung

e)

Menonaktifkan website saat trafik tinggi

42.

Di Canva AI Code Mode, kode yang ditulis pengguna biasanya menghasilkan…

a)

Website langsung jadi

b)

Gambar atau visual dari kode

c)

File database

d)

Game 3D

e)

Software desktop

43.

Fungsi utama JavaScript dalam website interaktif adalah…

a)

Mengatur struktur dasar halaman

b)

Mengatur warna tanpa CSS

c)

Memberikan interaktivitas dan logika pada website

d)

Menggantikan gambar

e)

Menyimpan web ke hosting

44.

Elemen <section> digunakan untuk…

a)

Menampilkan gambar

b)

Mengelompokkan konten ke dalam bagian tematik

c)

Menampilkan teks kecil

d)

Menyimpan script

e)

Menyimpan metadata

45.

Dalam Gemini Canvas, keunggulan utamanya untuk coding adalah…

a)

Hanya menampilkan output

b)

Tidak bisa menjalankan kode

c)

Memungkinkan brainstorming, penjelasan, dan revisi kode dalam satu ruang kerja

d)

Tidak mendukung bahasa JavaScript

e)

Hanya bisa menulis teks pendek

46.

Elemen <nav> digunakan untuk…

a)

Menampilkan paragraf

b)

Menampilkan video

c)

Menyimpan link navigasi

d)

Menyimpan seluruh isi halaman

e)

Membuat koment

47.

Untuk memasukkan CSS eksternal digunakan tag…

a)

<style>

b)

<script>

c)

<css>

d)

<meta>

e)

<link>

48.

Ekstensi file JavaScript adalah…

a)

.css

b)

.js

c)

.java

d)

.jsx

e)

.script

49.

Gemini Canvas mendukung mode kerja…

a)

Membuat gambar tanpa teks

b)

Brainstorming, coding, penjelasan, dan revisi dalam satu halaman

c)

Hanya untuk membuat tabel

d)

Hanya bisa menulis jawaban pendek

e)

Tidak mendukung file

50.

Tag <source> umumnya digunakan dalam elemen…

a)

<table>

b)

<form>

c)

<video> atau <audio>

d)

<header>

e)

<meta>