Absen XI TKJ (2024/2025) - SMK Mudita Singkawang (Pemrograman) SM 2
Mapel Pemrograman
Kegiatan 1 - 14 Januari 2025
MENAMPILKAN AUDIO
Contoh penerapan dalam HTML:
Contoh penggunaan tag <embed>:
Link pengumpulan Hasil >>https://forms.gle/WbZAQNQXEkCZuuJF9
Kegiatan 2 - 17 Januari 2025
Contoh penerapan pada HTML:
Link pengumpulan Hasil >>https://forms.gle/6a6natRxP93JRzvn9
Kegiatan 3 - 7 Ferbruari 2025
C. TUGAS MANDIRI (5 SOAL URAIAN)
Jawablah pertanyaan-pertanyaan di bawah ini dengan benar!
1. Analisislah langkah-langkah dalam menyisipkan gambar di dokumen HTML!
2. Analisislah langkah-langkah dalam menampilkan audio di dalam dokumen web!
3. Analisislah langkah-langkah dalam menampilkan animasi di dalam dokumen web!
4. Sebutkan atribut dan fungsinya tag untuk menampilkan gambar!
5. Bagaimana cara menyisipkan file audio ke dalam tampilan web ?
Link pengumpulan Hasil >>https://forms.gle/7TZMHm8K7j359Er48
Kegiatan 4 - 18 Ferbruari 2025
Link absolut adalah link yang akan menunjuk ke halaman dari situs web lain
Contoh penerapan pada HTML:
Tampilan pada browser:
Link pengumpulan Hasil >> https://forms.gle/zVoBXKw2YZPf3d149
Kegiatan 5 - 21 Ferbruari 2025
Link relative adalah link ke dokumen internal, dan penulisan alamattujuannya pun tidak perlu ditulis secara lengkap, cukup nama dokumennya saja, dan nama direktorinya
Memiliki 2 dokumen HTML, misal dokumen 1 bernama link1.html
Dokumen ke 2 bernama link2.html
Tampilan untuk file link1.html di browser :
Jika tombol Halaman Selanjutnya diklik maka akan menuju ke halaman link2.html, yaitu
Jika tombol Halaman Sebelumnya diklik maka akan menuju ke halaman link1.html Link ke bagian dokumen tertentu atau internal link
HTML membedakan ketiga jenis link diatas berdasarkan lokasi atau alamat dokumen yang akan diakses.
Link pengumpulan Hasil >> https://forms.gle/FS9fbrygQaTuGtnb6
Kegiatan 6 - 25 Ferbruari 2025
C. TUGAS MANDIRI (5 SOAL URAIAN)Jawablah pertanyaan-pertanyaan di bawah ini dengan benar !
1. Bagaimana cara menggunakan link di dalam halaman web ?
2. Bagaimana membuat link dengan tujuan satu halaman yang sama
3. Bagaimana membuat link dengan tujuan dokumen yang berbeda?
4. Apa bedanya format link pada target link, email dan telepon ?
5. Sebutkan jenis-jenis link dalam dokumen HTML
Link pengumpulan Hasil >> https://forms.gle/Y9juybMSBaK2m2128
Kegiatan 7 - 7 Maret 2025
D. SOAL PRAKTIK URAIAN
bacalah petunjuk lalu kerjakan soal-soal di bawah ini dengan cermat dan teliti!
1. Bagian apa yang paling penting dalam tag link?
2. Bagaimana cara menyajikan link dalam dokumen tertentu pada file yang sama?
3. Bagaimana cara menyajikan link dalam dokumen tertentu pada file yang berbeda?
4. Bagaimana cara menyajikan target link? Berikan contohnya!
5. Buatlah link email: info@smk2-yk.sch.id
Link pengumpulan Hasil >> https://forms.gle/VZ2sFiQ9y4nbG3ys8
Kegiatan 8 - 11 Maret 2025
Tampilan pada browser
Link pengumpulan Hasil >> https://forms.gle/CXcCaDqRR8K8yRaB8
Kegiatan 9 - 15 April 2025
contoh form dengan password:
Tampilan pada browser:
Kegiatan 10 - 22 April 2025
1. Jelaskan tentang cara kerja dari form!
2. Jelaskan tentang macam-macam elemen tag <form> html !
3. Buatlah form biodata seperti di bawah ini :
Kegiatan 11 - 29 April 2025
Buatlah form biodata seperti di bawah ini :
JavaScript (script.js):
1. Simpan kode HTML di atas sebagai index.html.
2. Simpan kode JavaScript di atas sebagai script.js di dalam folder yang sama dengan index.html.
3. Buka file index.html di peramban web Anda.
Link pengumpulan Hasil >> https://forms.gle/RHq6riVnpAMSLBSSA
Kegiatan 12 - 9 Mei 2025
E. UJI KOMPETENSI
PILIHAN GANDA
Berilah tanda silang (X) pada pilihan jawaban yang benar!
1. Dalam konteks dokumen digital seperti halaman web, terdapat sebuah acuan atau koneksi yang memungkinkan pengguna berpindah dari satu bagian dokumen ke bagian lain, atau bahkan ke dokumen atau sumber lain yang berbeda, seringkali diidentifikasi oleh tampilan kursor yang berubah saat diarahkan kepadanya. Konsep ini secara umum dikenal sebagai...
A. Hypertext Markup Language (HTML)
B. Struktur Dokumen
C. Hyperlink
D. Relational Database
E. Element Interactivity
2. Pada bahasa pemrograman web HTML, untuk membuat sebuah koneksi atau tautan yang dapat diklik oleh pengguna untuk navigasi antar halaman atau sumber daya, digunakan sebuah tag spesifik yang berperan mendefinisikan elemen hyperlink. Tag apakah yang dimaksud?
A. <p>
B. <img>
C. <div>
D. <a>
E. <span>
3. Berdasarkan lokasi tujuan tautan, link dalam HTML dapat dibedakan menjadi beberapa jenis. Link yang dibuat dengan menuliskan alamat lengkap (URL) termasuk protokolnya, dan bertujuan untuk mengarahkan pengguna ke halaman web yang berada di domain atau situs web yang berbeda dari halaman saat ini, disebut sebagai...
A. Link Relative
B. Link Internal Dokumen
C. Link Anchor
D. Link Absolut
E. Link Skrip
4. Ketika Anda membuat tautan yang mengarah ke dokumen HTML lain, gambar, atau file lainnya, tetapi semua file tersebut masih berada di dalam struktur folder atau situs web yang sama dengan halaman web yang sedang diakses, dan penulisan alamat tujuannya cukup dengan nama file atau nama direktorinya saja tanpa protokol lengkap, jenis link ini dikategorikan sebagai...
A. Link Absolut
B. Link Eksternal
C. Link Relative
D. Link Anchor
E. Link Non-Relatif
5. Pada halaman web yang memiliki konten sangat panjang, seringkali dibuat daftar isi di bagian atas atau tautan yang memungkinkan pengguna langsung melompat ke bagian tertentu di tengah atau akhir halaman tanpa perlu melakukan scrolling manual. Jenis link yang tujuannya mengarah ke bagian spesifik dalam dokumen HTML yang sama dengan menggunakan penanda identifikasi (id) pada bagian tujuan disebut sebagai...
A. Link Absolut
B. Link Relatif antar Dokumen
C. Link Eksternal Situs
D. Link Internal Dokumen (Anchor Link)
E. Link Target Baru
6. Dalam tag HTML untuk membuat hyperlink (<a>), terdapat sebuah atribut yang wajib ada untuk menentukan URL atau alamat tujuan dari link tersebut, baik itu alamat halaman web lain, nama file dalam situs yang sama, atau bagian spesifik dalam dokumen yang sama. Atribut apakah yang berfungsi sebagai penentu tujuan link ini?
A. src
B. alt
C. title
D. href
E. target
7. Untuk membuat sebuah hyperlink yang ketika diklik akan membuka aplikasi email default pengguna dengan alamat email tertentu sudah terisi di kolom penerima (To:), atribut href pada tag <a> menggunakan sebuah protokol atau skema URL khusus di awal alamat email. Protokol apakah yang digunakan untuk membuat link email ini?
A. http://
B. https://
C. ftp://
D. mailto:
E. tel:
8. Sama halnya dengan link email, untuk membuat hyperlink yang ketika diklik pada perangkat yang mendukung (seperti smartphone) akan memicu panggilan telepon ke nomor tertentu, atribut href pada tag <a> juga menggunakan protokol atau skema URL spesifik yang diikuti oleh nomor telepon tujuan. Protokol apakah yang digunakan untuk membuat link telepon ini?
A. mailto:
B. call:
C. phone://
D. tel:
E. dial:
9. Perhatikan cuplikan kode HTML berikut:
<a href="http://www.ilmukomputer.com/">Ilmu Komputer</a>
Berdasarkan penulisan alamat tujuan (href) yang menggunakan protokol http:// dan nama domain lengkap www.ilmukomputer.com, jenis link yang dibuat oleh kode program di atas merupakan contoh dari...
A. Link Relative
B. Link Internal Dokumen
C. Link Absolut
D. Link Skrip
E. Link File Lokal
10. Diberikan kode HTML untuk sebuah hyperlink seperti di bawah ini:
<a href="info.html">Informasi Lengkap</a>
Jika kode ini terdapat pada halaman index.html dan kedua file (index.html dan info.html) berada dalam folder yang sama di sebuah situs web, maka saat link "Informasi Lengkap" diklik, pengguna akan diarahkan ke...
A. Halaman index.html lagi
B. Halaman eksternal di internet
C. Dokumen bernama info.html dalam folder yang sama
D. Bagian spesifik dalam halaman saat ini
E. Tidak terjadi navigasi karena syntax salah
11. Anda ingin membuat sebuah link pada halaman web Anda menggunakan HTML yang jika diklik akan membawa pengguna ke situs berita www.detik.com. Berdasarkan materi pembelajaran mengenai penggunaan tag <a> dan atribut href untuk link web, manakah penulisan kode HTML yang paling tepat untuk tujuan tersebut?
A. <href a www.detik.com> </a>
B. <a href www.detik.com> </a>
C. <a href="http://www.detik.com/">Detik.com</a>
D. <a www.detik.com> </a>
E. <href www.detik.com> </a>
12. Tag <a> dalam HTML memiliki beberapa atribut penting yang digunakan untuk mengontrol perilaku dan tujuan link, seperti href untuk URL tujuan dan target untuk menentukan di mana dokumen dibuka. Berdasarkan konteks pembuatan hyperlink yang dijelaskan dalam materi, manakah dari pilihan berikut yang BUKAN merupakan atribut utama atau umum yang digunakan langsung pada tag <a> untuk mendefinisikan karakteristik link itu sendiri?
A. href
B. target
C. id (untuk target internal)
D. title (untuk tooltip)
E. src
13. Anda memiliki file dokumen HTML bernama tabel.html yang berada di folder yang sama dengan halaman web tempat Anda ingin menempatkan link menuju file tersebut. Berdasarkan aturan penulisan link relatif dalam HTML, manakah dari tag berikut yang secara sintaksis benar untuk membuat link bertuliskan "Link ke tabel" yang mengarah ke tabel.html?
A. <a def="tabel.html">Link ke tabel</a>
B. <a ref="tabel.html">Link ke tabel</a>
C. <a href="tabel.html">Link ke tabel</a>
D. <a herf="tabel">Link ke tabel</a>
E. <a href="tabel">Link ke tabel</a>
14. Untuk membuat hyperlink yang standar mengarah ke sebuah alamat web eksternal (URL lengkap), sintaks dasar yang digunakan dalam tag <a> adalah menempatkan alamat web tujuan di dalam nilai atribut href. Manakah penulisan sintaks dasar yang tepat untuk membuat link ke sebuah URL?
A. <A HREF="#***"></A> (Ini untuk target internal)
B. <A HREF="URL#***"></A> (Ini untuk target internal pada file lain)
C. <A HREF="URL" TARGET="_blank">Teks Link</A> (Ini dengan target)
D. <A HREF="URL">Teks Link</A>
E. <A NAME="***">Teks Link</A> (Ini untuk menandai target internal)
15. Ketika Anda ingin membuat link yang akan menggulir (scroll) halaman ke bawah atau ke atas menuju bagian spesifik yang telah ditandai dengan atribut id dalam dokumen HTML yang sama, Anda perlu menggunakan simbol # diikuti dengan nilai id target di dalam atribut href. Manakah penulisan sintaks dasar yang tepat untuk membuat hyperlink yang menargetkan bagian dalam dokumen yang sama?
A. <A HREF="#nama_id_target">Teks Link</A>
B. <A HREF="nama_id_target"></A>
C. <A HREF="http://#nama_id_target">Teks Link</A>
D. <A HREF="nama_file.html#nama_id_target">Teks Link</A> (Ini untuk file lain)
E. <A NAME="nama_id_target">Teks Target</A> (Ini untuk menandai target, bukan linknya)
16. Selain mengarahkan ke halaman web atau file lain, hyperlink juga dapat dibuat pada gambar. Berdasarkan materi, bagaimana cara membuat sebuah gambar menjadi elemen yang dapat diklik (hyperlink) untuk navigasi?
A. Menempatkan tag <img> di dalam tag <p>
B. Menempatkan tag <img> di dalam tag <div>
C. Menempatkan tag <img> sebagai nilai dari atribut href
D. Menempatkan tag <img> di dalam tag <a>
E. Menggunakan atribut link pada tag <img>
17. Atribut TARGET pada tag <a> digunakan untuk mengontrol di mana dokumen atau URL yang dituju oleh hyperlink akan dibuka. Bentuk umum penulisan atribut ini adalah <a href="..." target="Nama Target">...</a>. Jika Anda ingin link dibuka di jendela atau tab browser yang baru, nilai atribut target yang umum digunakan adalah...
A. _self (membuka di jendela yang sama)
B. _top (membuka di jendela paling atas)
C. _parent (membuka di frame parent)
D. _blank (membuka di jendela atau tab baru)
E. _new (nilai non-standar)
18. Untuk menandai sebuah bagian teks atau gambar dalam dokumen HTML sebagai target yang akan dituju oleh internal link (link dalam satu halaman), Anda perlu memberikan sebuah nama atau identifikasi unik pada elemen tersebut. Tag atau atribut apakah yang digunakan bersama dengan simbol # pada link href untuk menandai bagian target ini?
A. Atribut class
B. Tag <label>
C. Atribut id
D. Atribut name (cara lama, id lebih disarankan)
E. Tag <span>
19. Perhatikan link internal dokumen berikut: <a href="#bagian_artikel">Lompat ke Bagian Artikel</a>. Ketika link ini diklik, browser akan mencari sebuah elemen dalam halaman yang sama yang memiliki atribut khusus dengan nilai yang sesuai dengan bagian setelah simbol # pada href. Atribut apakah yang dicari oleh browser pada elemen target dalam kasus ini?
A. class="bagian_artikel"
B. name="bagian_artikel" (Cara lama)
C. src="bagian_artikel"
D. id="bagian_artikel"
E. target="bagian_artikel"
20. Link jenis apakah yang penulisan alamat tujuannya tidak perlu ditulis secara lengkap menggunakan protokol http:// atau https://, melainkan cukup nama dokumennya saja (misal: halaman2.html) jika berada dalam direktori yang sama, atau menyertakan nama direktori (misal: ../arsip/dokumen.pdf) jika berada di direktori yang berbeda namun masih dalam satu situs web?
A. Link Absolut
B. Link Eksternal
C. Link Relatif
D. Link Internal Dokumen
E. Link Lengkap
21. Kelebihan utama dari membuat link ke bagian dokumen tertentu (internal link) pada halaman web yang panjang adalah...
A. Mengurangi ukuran file halaman HTML
B. Mempercepat waktu loading halaman secara keseluruhan
C. Memudahkan pengguna untuk langsung menuju ke informasi yang diinginkan tanpa scrolling
D. Meningkatkan keamanan halaman web
E. Membuat halaman web terlihat lebih menarik secara visual
22. Protokol javascript: dapat digunakan dalam atribut href pada tag <a>. Berdasarkan pilihan yang diberikan dalam materi, protokol ini digunakan untuk menjadikan link tersebut ketika diklik akan menjalankan...
A. Panggilan telepon
B. Pengiriman email
C. Eksekusi kode skrip JavaScript
D. Pembukaan file lokal
E. Koneksi ke server FTP
23. Dalam kode program <a href="dokumen.pdf">Unduh Dokumen</a>, jenis link yang digunakan adalah link relatif, dengan asumsi file dokumen.pdf berada dalam direktori yang bisa dijangkau secara relatif dari lokasi file HTML. Saat link "Unduh Dokumen" diklik, browser akan mencoba...
A. Membuka halaman web baru dengan nama dokumen.pdf
B. Mengirim email ke alamat dokumen.pdf
C. Melakukan panggilan telepon ke nomor dokumen.pdf
D. Mengunduh atau menampilkan file dokumen.pdf
E. Menjalankan skrip JavaScript bernama dokumen.pdf
24. Manakah dari pernyataan berikut yang paling tepat menjelaskan fungsi atribut href pada tag <a> dalam HTML?
A. Menentukan teks atau gambar yang akan ditampilkan sebagai link.
B. Menetapkan nama unik untuk elemen yang akan dijadikan target link internal.
C. Menentukan di mana dokumen yang dituju oleh link akan dibuka.
D. Menyediakan URL atau alamat tujuan yang akan diakses ketika link diklik.
E. Memberikan informasi tambahan (tooltip) saat kursor diarahkan ke link.
25. Berdasarkan materi pembelajaran, jika Anda membuat link email menggunakan format <a href="mailto:info@smk2-yk.sch.id">Kirim Email ke Sekolah</a>, maka ketika pengguna mengklik tautan "Kirim Email ke Sekolah", tindakan apa yang akan dilakukan oleh browser atau sistem operasi pengguna?
A. Mengunduh file bernama info@smk2-yk.sch.id
B. Mencoba membuka halaman web dengan URL info@smk2-yk.sch.id
C. Membuka aplikasi email default pengguna dengan alamat info@smk2-yk.sch.id sudah terisi di kolom penerima.
D. Melakukan panggilan telepon ke nomor info@smk2-yk.sch.id
E. Menampilkan teks "Kirim Email ke Sekolah" sebagai plain text.
Link pengumpulan Hasil >> https://forms.gle/HePzsBnmDEaySMdr8
Kegiatan 13 - 20 Mei 2025
Pilihan Ganda
Pilihlah jawaban yang paling tepat!
1. Acuan dalam dokumen hiperteks ke dokumen lain atau sumber lain disebut dengan...
A. Hyperlink
B. Hypertext
C. HTML
D. Relasi
E. Elemen
2. Tag HTML yang digunakan untuk membuat link adalah...
A. <link>
B. <href>
C. <a>
D. <url>
E. <src>
3. Atribut yang wajib ada di dalam tag <a> untuk menentukan URL atau alamat dari halaman yang akan dituju adalah...
A. id
B. class
C. src
D. href
E. name
4. Link yang akan menunjuk ke halaman dari situs web lain secara lengkap disebut...
A. Link Relatif
B. Link Absolut
C. Internal Link
D. Target Link
E. Email Link
5. Jika Anda ingin membuat link ke dokumen internal, dan penulisan alamat tujuannya tidak perlu ditulis secara lengkap, jenis link yang tepat adalah...
A. Link Absolut
B. Link Relatif
C. Internal Link
D. Eksternal Link
E. Target Link
6. Untuk membuat link ke bagian tertentu dalam dokumen HTML yang sama, Anda perlu memberikan nama atau id pada bagian yang dituju, dan menggunakan simbol...
A. @
B. $
C. #
D. &
E. *
7. Penulisan link untuk tujuan email yang benar adalah...
A. <a href="email:nama@yourdomain.com">Kirim pesan email</a>
B. <a href="mailto:nama@yourdomain.com">Kirim pesan email</a>
C. <a src="nama@yourdomain.com">Kirim pesan email</a>
D. <a link="nama@yourdomain.com">Kirim pesan email</a>
E. <a to="nama@yourdomain.com">Kirim pesan email</a>
8. Untuk membuat link yang dapat langsung memanggil nomor telepon, protokol yang digunakan dalam atribut href adalah...
A. http:
B. https:
C. file:
D. tel:
E. call:
9. Apa fungsi dari atribut target di dalam tag <a>?
A. Menentukan gaya visual link.
B. Menentukan di mana dokumen yang dituju akan dibuka (misalnya, di jendela/tab baru).
C. Menentukan teks yang akan ditampilkan pada link.
D. Menentukan jenis file yang akan di-link.
E. Menentukan ikon yang menyertai link.
10. Jika Anda memiliki kode <a href="http://www.ilmukomputer.com/">Ilmu Komputer</a>, jenis link tersebut adalah...
A. Link Relatif
B. Link Internal
C. Link Absolut
D. Link Email
E. Link Telepon
11. Link berikut: <a href="link2.html">Halaman Selanjutnya</a> yang berada di file link1.html, adalah contoh dari...
A. Link Absolut
B. Link Relatif
C. Link Internal
D. Link Email
E. Link Telepon
12. Untuk membuat link ke bagian dokumen tertentu menggunakan gambar, Anda perlu menempatkan tag <img> di dalam tag...
A. <p>
B. <div>
C. <span>
D. <a>
E. <h1>
13. Jika sebuah link memiliki atribut id="tujuanLink", bagaimana cara membuat link yang mengarah ke bagian tersebut dari dokumen yang sama?
A. <a href="tujuanLink">Teks</a>
B. <a href="#tujuanLink">Teks</a>
C. <a link="tujuanLink">Teks</a>
D. <a id_link="tujuanLink">Teks</a>
E. <a go="tujuanLink">Teks</a>
14. Mana dari berikut ini yang bukan merupakan jenis-jenis link dalam HTML yang dijelaskan di materi?
A. Link Absolut
B. Link Relatif
C. Link ke Bagian Dokumen Tertentu
D. Link Video
E. Link ke Email
15. Dalam kode program <a href="info.html">Informasi Lengkap</a>, dokumen yang akan dituju adalah...
A. info.html
B. A href
C. Informasi Lengkap
D. </a>
E. <a>
16. Tag <a> digunakan untuk...
A. Menghapus elemen
B. Menampilkan gambar
C. Membuat hyperlink
D. Menampilkan video
E. Memberi warna
17. Link yang tujuannya mengarah ke dokumen-dokumen lain yang masih berada di dalam satu situs web yang sama (komputer yang sama) adalah...
A. Link Absolut
B. Link Relative
C. Link Hyperlink
D. Link tag
E. Link element
18. Protokol pada link dengan atribut href yang digunakan untuk menjadikan link ke email adalah...
A. mailto:
B. file:
C. ftp://
D. https://
E. tel:
19. Protokol pada link dengan atribut href yang digunakan untuk menjadikan link ke telepon adalah...
A. mailto:
B. file:
C. ftp://
D. javascript:
E. tel:
20. Perintah hyperlink untuk alamat web adalah...
A. <A HREF="#***"></A>
B. <A HREF="URL#***"></A>
C. <A HREF="URL TARGET">URL</A>
D. <A HREF="URL"></A>
E. <A HREF="URL TARGET">
21. Perintah hyperlink untuk target dalam dokumen yang sama adalah...
A. <A HREF="#***"></A>
B. <A HREF="URL#***"></A>
C. <A HREF="URL TARGET">URL</A>
D. <A HREF="URL"></A>
E. <A HREF="URL TARGET">
22. Manakah dari atribut berikut yang bukan merupakan atribut standar dalam tag <a> yang dijelaskan dalam materi?
A. href
B. target
C. id
D. src
E. title
23. Jika Anda mengarahkan kursor di atas sebuah link di halaman web, dan kursor berubah menjadi tangan kecil, hal ini mengindikasikan bahwa elemen tersebut adalah...
A. Gambar
B. Teks biasa
C. Formulir input
D. Hyperlink
E. Tabel
24. Untuk menghubungkan suatu bagian tertentu di dalam slide, file dokumen, program atau halaman web dengan bagian yang lainnya pada bidang tersebut, metode yang digunakan adalah...
A. Menggunakan teks tebal
B. Memberi warna pada teks
C. Menggunakan hyperlink
D. Menambahkan gambar
E. Mengubah ukuran font
25. Apa yang akan terjadi jika tombol "Halaman Selanjutnya" diklik pada contoh link relatif dari link1.html ke link2.html?
A. Browser akan menampilkan pesan error.
B. Browser akan kembali ke halaman sebelumnya.
C. Browser akan membuka halaman link2.html.
D. Browser akan mengunduh file link2.html.
E. Browser akan menutup.
Link pengumpulan Hasil >>https://forms.gle/Ddbxrw7Pc3XGP5Dm9
0 komentar: