60 Pertanyaan dan Jawaban Wawancara HTML Teratas (2025)

Berikut adalah pertanyaan dan jawaban wawancara HTML untuk kandidat baru dan berpengalaman untuk mendapatkan pekerjaan impian mereka.

Unduh PDF Gratis: Pertanyaan Wawancara HTML

---

1) Apa itu HTML?

HTML adalah kependekan dari HyperText Markup Language dan merupakan bahasa World Wide Web. Ini adalah bahasa pemformatan teks standar yang digunakan untuk membuat dan menampilkan halaman di Web. Dokumen HTML terdiri dari dua hal: konten dan tag yang memformatnya agar dapat ditampilkan dengan benar di halaman.

---

2) Apa itu tag?

Konten ditempatkan di antara tag HTML untuk memformatnya dengan benar. Itu menggunakan simbol kurang dari (<) dan simbol lebih besar (>). Simbol garis miring juga digunakan sebagai tag penutup. Misalnya:

<strong>sample</strong>

---

3) Apakah semua tag HTML berpasangan?

Tidak, ada tag HTML tunggal yang tidak memerlukan tag penutup. Contohnya adalah menandai dan tag.

---

4) Apa saja daftar umum yang dapat digunakan saat mendesain halaman?

Anda dapat menyisipkan salah satu atau kombinasi tipe daftar berikut:
- Daftar pesanan
– daftar tidak berurutan
– daftar definisi
- Daftar menu
– daftar direktori
Masing-masing tipe daftar ini menggunakan kumpulan tag berbeda untuk menyusunnya

---

5) Bagaimana cara menyisipkan komentar dalam HTML?

Komentar dalam HTML dimulai dengan “ ”. Misalnya:

<!-- A SAMPLE COMMENT -->

---

6) Apakah semua entitas karakter ditampilkan dengan benar di semua sistem?

Tidak, ada beberapa entitas karakter yang tidak dapat ditampilkan saat sistem operasi tempat browser berjalan tidak mendukung karakter tersebut. Ketika itu terjadi, karakter-karakter ini ditampilkan sebagai kotak.

---

7) Apa itu peta gambar?

Peta gambar memungkinkan Anda menautkan ke banyak halaman web berbeda menggunakan satu gambar. Anda dapat menentukan bentuk dalam gambar yang ingin Anda jadikan bagian dari pemetaan gambar.

---

8) Apa keuntungan dari meruntuhkan ruang putih?

Spasi putih adalah rangkaian karakter spasi kosong, yang diperlakukan sebagai karakter spasi tunggal dalam HTML. Karena browser menciutkan beberapa spasi menjadi satu spasi, Anda dapat membuat indentasi baris teks tanpa mengkhawatirkan banyak spasi. Ini memungkinkan Anda mengatur kode HTML ke dalam format yang lebih mudah dibaca.

---

9) Dapatkah nilai atribut disetel ke apa pun atau adakah nilai khusus yang diterimanya?

Beberapa nilai atribut hanya dapat diatur ke nilai yang telah ditentukan sebelumnya. Atribut lain dapat menerima nilai numerik apa pun yang mewakili jumlah piksel untuk suatu ukuran.

---

10) Bagaimana cara menyisipkan simbol hak cipta pada halaman browser?

Untuk menyisipkan simbol hak cipta, Anda perlu mengetikkan © atau & #169; dalam file HTML.

---

11) Bagaimana cara membuat link ke bagian dalam halaman yang sama?

Tautan dapat dibuat menggunakan tag, dengan referensi melalui penggunaan simbol angka (#). Misalnya, Anda dapat memiliki satu baris sebagai BACK TO TOP , yang akan menghasilkan kata “BACK TO TOP” muncul di halaman web dan tertaut ke bookmark bernama paling atas. Anda kemudian membuat perintah tag terpisah seperti di suatu tempat di bagian atas halaman web yang sama sehingga pengguna akan terhubung ke tempat itu ketika dia mengklik “BACK TO TOP”.

---

12) Apakah ada cara untuk menjaga elemen daftar tetap lurus dalam file HTML?

Dengan menggunakan indentasi, Anda dapat menjaga elemen daftar tetap lurus. Jika Anda membuat indentasi setiap daftar sub-sarang lebih jauh dari daftar induk yang memuatnya, Anda dapat dengan cepat menentukan berbagai daftar dan elemen yang dikandungnya.

---

13) Jika Anda melihat alamat web di majalah, halaman web mana yang dituju?

Setiap halaman web di web dapat memiliki alamat web terpisah. Sebagian besar alamat ini berhubungan dengan halaman web paling atas. Alamat web terbitan yang muncul di majalah biasanya menunjukkan halaman paling atas ini. Dari halaman tingkat atas ini, Anda dapat mengakses semua halaman lain dalam situs web.

---

14) Apa kegunaan teks alternatif dalam pemetaan gambar?

Saat Anda menggunakan peta gambar, akan membingungkan dan sulit menentukan hotspot mana yang sesuai dengan tautan mana. Dengan menggunakan teks alternatif, Anda meletakkan teks deskriptif pada setiap tautan hotspot.

---

15) Apakah file HTML lama berfungsi di browser baru?

Ya, file HTML lama mematuhi standar HTML. Sebagian besar file lama berfungsi di browser baru, meskipun beberapa fitur mungkin tidak berfungsi.

---

16) Apakah hyperlink hanya berlaku untuk teks?

Tidak, hyperlink dapat digunakan dalam teks maupun gambar. Artinya, Anda dapat mengonversi gambar menjadi tautan yang memungkinkan pengguna menautkan ke halaman lain saat diklik. Kelilingi gambar di dalam … kombinasi tag.

---

17) Jika sistem operasi pengguna tidak mendukung karakter yang diperlukan, bagaimana simbol dapat direpresentasikan?

Jika sistem operasi mereka tidak mendukung karakter tertentu, karakter tersebut masih dapat ditampilkan dengan menampilkannya sebagai gambar.

---

18) Bagaimana cara mengubah tipe nomor di tengah daftar?

Itu tag mencakup dua atribut – jenis dan nilai. Atribut type dapat digunakan untuk mengubah tipe penomoran untuk item daftar apa pun. Atribut value dapat mengubah indeks angka.

---

19) Apa itu style sheet?

Style sheet memungkinkan Anda membuat template gaya yang konsisten, mudah dipindahkan, dan terdefinisi dengan baik. Templat ini dapat ditautkan ke beberapa halaman web berbeda, sehingga memudahkan pemeliharaan dan mengubah tampilan dan nuansa semua halaman web dalam situs.

---

20) Sebutkan jenis poin yang tersedia dalam HTML

Dengan daftar yang diurutkan, Anda dapat memilih untuk menggunakan beberapa jenis daftar yang berbeda termasuk angka alfabet dan Romawi. Atribut tipe untuk daftar tidak berurutan dapat diatur ke cakram, persegi, atau lingkaran.

---

21) Bagaimana cara membuat teks warna-warni di halaman web?

Untuk membuat teks dengan warna berbeda, gunakan tag … untuk setiap karakter yang ingin Anda beri warna. Anda dapat menggunakan kombinasi tag ini sebanyak yang diperlukan, mengelilingi satu karakter atau keseluruhan kata.

---

22) Mengapa ada nilai entitas karakter numerik dan bernama?

Nilai numerik diambil dari nilai ASCII untuk berbagai karakter, namun hal ini mungkin sulit untuk diingat. Oleh karena itu, nilai entitas karakter bernama dibuat untuk memudahkan desainer halaman web menggunakannya.

---

23) Tulis urutan tag tabel HTML yang menghasilkan output berikut:
50 buah 100 500
10 buah 5 50

Jawaban:

<table> 
<tr> 
<td>50 pcs</td> 
<td>100</td> 
<td>500</td> 
</tr> 
<tr> 
<td>10 pcs</td> 
<td>5</td> 
<td>50</td> 
</tr> 
</table>

---

24) Apa keuntungan mengelompokkan beberapa kotak centang menjadi satu?

Meskipun kotak centang tidak mempengaruhi satu sama lain, mengelompokkan kotak centang membantu mengaturnya. Tombol kotak centang dapat memiliki namanya sendiri dan tidak perlu menjadi anggota grup. Satu halaman web dapat memiliki banyak kelompok kotak centang yang berbeda.

---

25) Apa yang akan terjadi jika Anda tumpang tindih dengan kumpulan tag?

Jika dua kumpulan tag HTML tumpang tindih, hanya tag pertama yang akan dikenali. Masalah ini akan Anda temukan ketika teks tidak ditampilkan dengan benar di layar browser.

---

26) Apa itu applet?

Applet adalah program kecil yang dapat tertanam dalam halaman web untuk melakukan beberapa fungsi tertentu, seperti komputasi, animasi, dan pemrosesan informasi. Applet ditulis menggunakan bahasa Java.

---

27) Bagaimana jika tidak ada teks di antara tag atau jika ada teks yang dihilangkan secara tidak sengaja? Apakah ini akan mempengaruhi tampilan file HTML?

Jika tidak ada teks di antara tag, maka tidak ada yang perlu diformat. Oleh karena itu tidak ada pemformatan yang akan muncul. Beberapa tag, khususnya tag tanpa tag penutup seperti tag, tidak memerlukan teks apa pun di antara keduanya.

---

28) Apakah mungkin untuk mengatur warna tertentu untuk batas tabel?

Anda dapat menentukan warna batas menggunakan style sheet, namun warna untuk tabel yang tidak menggunakan style sheet akan sama dengan warna teks.

---

29) Bagaimana cara membuat link yang akan terhubung ke halaman web lain ketika diklik?

Untuk membuat hyperlink, atau link yang menghubungkan ke halaman web lain, gunakan tag href. Format umum untuk ini adalah: teks
Ganti "situs" dengan URL halaman sebenarnya yang seharusnya ditautkan ketika teks diklik.

---

30) Apa cara lain yang bisa digunakan untuk menyelaraskan gambar dan membungkus teks?

Tabel dapat digunakan untuk memposisikan teks dan gambar. Cara lain yang berguna untuk membungkus teks di sekitar gambar adalah dengan menggunakan style sheet.

---

31) Bisakah satu tautan teks mengarah ke dua halaman web berbeda?

Tidak. Tag hanya dapat menerima satu atribut href, dan hanya dapat menunjuk ke satu halaman web.

---

32) Apa perbedaan antara daftar direktori dan menu dan daftar tidak berurutan?

Perbedaan utamanya adalah direktori dan daftar menu tidak menyertakan atribut untuk mengubah gaya poin.

---

33) Bisakah kamu mengubah warna peluru?

Warna poin selalu sama dengan warna karakter pertama dalam item daftar. Jika Anda mengelilingi dan karakter pertama dengan sekumpulan tag dengan kumpulan atribut warna, warna poin, dan karakter pertama akan memiliki warna yang berbeda dari teks.

---

34) Berapa batasan ukuran bidang teks?

Ukuran default untuk bidang teks adalah sekitar 13 karakter. Namun, jika Anda menyertakan atribut size, Anda dapat mengatur nilai size menjadi serendah 1. Nilai size maksimum akan ditentukan oleh lebar browser. Jika atribut size disetel ke 0, ukurannya akan disetel ke ukuran default 13 karakter.

---

35) Lakukan tag selalu harus berada di awal baris atau kolom?

Setiap tag dapat diubah menjadi a menandai. Hal ini menyebabkan teks yang terdapat di dalamnya tag untuk ditampilkan sebagai huruf tebal di browser. Meskipun tag terutama digunakan untuk judul, tidak perlu digunakan secara eksklusif untuk judul.

---

36) Apa hubungan antara atribut perbatasan dan aturan?

Batas sel default, dengan ketebalan 1 piksel, secara otomatis ditambahkan antar sel jika atribut perbatasan diatur ke nilai bukan nol. Demikian pula, jika atribut border tidak disertakan, border default 1 piksel akan muncul jika atribut rule ditambahkan ke menandai.

---

37) Apa itu tenda?

Tenda memungkinkan Anda meletakkan teks bergulir di halaman web. Untuk melakukan ini, tempatkan teks apa pun yang ingin Anda tampilkan bergulir di dalamnya Dan tag.

---

38) Bagaimana cara membuat teks pada halaman web yang memungkinkan Anda mengirim email saat diklik?

Untuk mengubah teks menjadi tautan yang dapat diklik untuk mengirim email, gunakan perintah mailto dalam tag href. Formatnya adalah sebagai berikut:

<A HREF=”mailto:youremailaddress”>text to be clicked</A>

 

---

39) Apakah tag satu-satunya cara untuk memisahkan bagian teks?

Tidak tag hanyalah salah satu cara untuk memisahkan baris teks. Tag lainnya, seperti menandai dan tag, juga memisahkan bagian teks.

---

40) Apakah ada kejadian di mana teks akan muncul di luar browser?

Secara default, teks dibungkus agar muncul di dalam jendela browser. Namun, jika teks merupakan bagian dari sel tabel dengan lebar yang ditentukan, teks tersebut dapat melampaui jendela browser.

---

41) Apa perbedaan tautan aktif dengan tautan biasa?

Warna default untuk link normal dan aktif adalah biru. Beberapa browser mengenali link aktif ketika kursor mouse ditempatkan di atas link tersebut; yang lain mengenali tautan aktif ketika tautan tersebut memiliki fokus. Tautan yang tidak memiliki kursor mouse di atas tautan tersebut dianggap sebagai tautan normal.

---

42) Apakah style sheet membatasi jumlah definisi gaya baru yang dapat dimasukkan ke dalam tanda kurung?

Style sheet tidak membatasi jumlah definisi gaya yang dapat disertakan dalam tanda kurung untuk pemilih tertentu. Namun, setiap definisi gaya baru harus dipisahkan satu sama lain dengan simbol titik koma.

---

43) Bisakah saya menentukan nilai bobot pecahan seperti 670 atau 973 untuk bobot font?

Implementasinya sangat bergantung pada browser, tetapi standar ini tidak mendukung nilai bobot pecahan. Nilai yang dapat diterima harus diakhiri dengan dua angka nol.

---

44) Hierarki apa yang diikuti dalam style sheet?

Jika satu pemilih menyertakan tiga definisi gaya berbeda, definisi yang paling dekat dengan tag sebenarnya akan diutamakan. Gaya inline lebih diprioritaskan daripada style sheet tersemat, yang lebih diprioritaskan daripada style sheet eksternal.

---

45) Bisakah beberapa penyeleksi dengan nama kelas dikelompokkan bersama?

Anda dapat menentukan beberapa penyeleksi dengan definisi gaya yang sama dengan memisahkannya menggunakan koma. Teknik yang sama juga berfungsi untuk penyeleksi dengan nama kelas.

---

46) Apa yang terjadi jika Anda membuka bagian luar CSS file di browser?

Saat Anda mencoba membuka file CSS eksternal di browser, browser tidak dapat membuka file tersebut, karena file tersebut memiliki ekstensi yang berbeda. Satu-satunya cara untuk menggunakan file CSS eksternal adalah dengan mereferensikannya menggunakan tag dalam dokumen HTML lain.

---

47) Bagaimana cara membuat gambar menjadi gambar latar belakang halaman web?

Untuk melakukan ini, tempatkan kode tag setelah tag sebagai berikut:

<body background = “image.gif”>

Ganti image.gif dengan nama file gambar Anda. Ini akan mengambil gambar dan menjadikannya gambar latar belakang halaman web Anda.

---

48) Apa yang terjadi jika properti tipe gaya daftar digunakan pada elemen non-daftar seperti paragraf?

Jika properti tipe gaya daftar digunakan pada elemen non-daftar seperti paragraf, properti tersebut akan diabaikan dan tidak memengaruhi paragraf.

---

49) Kapan sebaiknya menggunakan bingkai?

Bingkai dapat membuat navigasi situs menjadi lebih mudah. Jika link utama ke situs terletak di bingkai yang muncul di bagian atas atau sepanjang tepi browser, konten untuk link tersebut dapat ditampilkan di sisa jendela browser.

---

50) Apa yang terjadi jika jumlah nilai pada atribut baris atau kolom tidak berjumlah 100 persen?

Browser mengukur frame relatif terhadap jumlah total nilainya. Jika atribut cols diatur ke 100%, 200% browser akan menampilkan dua bingkai vertikal dengan bingkai kedua dua kali lebih besar dari bingkai pertama.

---

51) Browser mana yang mendukung HTML5?

Versi terbaru Google Chrome, Apple Safari, Mozilla Firefox, dan Opera semuanya mendukung sebagian besar fitur HTML5.

---

52) Sebutkan dua tag baru yang disertakan dalam HTML 5

Dan adalah tag baru yang disertakan dalam versi HTML5. Mereka terutama digunakan sebagai pengganti Flash, Silverlight, dan teknologi serupa untuk memutar item multimedia.

---

53) Tahukah Anda dua tag semantik mana yang disertakan dalam versi HTML5?

Itu Dan tag adalah dua tag baru yang disertakan dalam HTML5. Artikel dapat terdiri dari beberapa bagian yang dapat memiliki banyak artikel. Tag artikel mewakili seluruh blok konten yang merupakan bagian dari keseluruhan yang lebih besar.

---

54) Apa itu dalam HTML5?

Tag ini mewakili bagian dari konten aliran mandiri. Ini sebagian besar digunakan sebagai satu kesatuan sebagai referensi alur utama dokumen.

---

55) Apa gunanya elemen Canvas?

Elemen kanvas membantu membuat bagan, grafik, memotong Photoshop untuk membuat gambar 2D dan menempatkannya langsung ke dalam kode HTML5.

---

56) Apa saja elemen FORM baru yang tersedia di HTML5?

Elemen Formulir baru di HTML5 menawarkan fungsionalitas yang jauh lebih baik daripada versi sebelumnya.

Tag yang diberikan untuk menjalankan fungsi ini adalah:

1) – Tag ini digunakan untuk menentukan daftar opsi untuk kontrol input.

2) – Tag ini mewakili bidang generator pasangan kunci.

3) – Ini mewakili hasil perhitungan skrip apa pun.

---

57) Ceritakan dua manfaat Penyimpanan Web HTML5

Dua manfaat utama Penyimpanan Web HTML5:

• Ia dapat menyimpan data hingga 10 MB yang tentunya lebih banyak dari yang dimiliki cookie.
• Data penyimpanan web tidak dapat ditransfer dengan permintaan HTTP. Ini membantu meningkatkan kinerja aplikasi.

---

58) Apa saja dua jenis Penyimpanan Web di HTML5?

Dua jenis penyimpanan HTML5 adalah:

Penyimpanan Sesi: Ini hanya menyimpan data sesi saat ini. Artinya, data yang disimpan dalam penyimpanan sesi akan dihapus secara otomatis saat browser ditutup.

Penyimpanan lokal: Penyimpanan lokal adalah jenis lain dari Penyimpanan Web HTML5. Di penyimpanan lokal, data tidak terhapus secara otomatis saat jendela browser saat ini ditutup.

---

59) Apa itu Cache Aplikasi di HTML5 dan mengapa digunakan?

Konsep Cache Aplikasi berarti aplikasi web di-cache. Itu dapat diakses tanpa memerlukan koneksi internet.

Beberapa kelebihan Aplikasi Cache :

1. Penjelajahan offline – Pengguna web juga dapat menggunakan aplikasi ini saat offline.
2. Kecepatan - Sumber daya yang di-cache dimuat lebih cepat
3. Kurangi beban server – Browser web hanya akan mengunduh sumber daya yang diperbarui dari server.

---

60) Jelaskan lima tipe input baru yang disediakan oleh HTML5 untuk formulir?

Berikut ini adalah tipe data baru yang penting yang ditawarkan oleh HTML5:

1. Tanggal: Ini memungkinkan pengguna untuk memilih tanggal.
2. tanggalwaktu-lokal: Jenis input ini memungkinkan pengguna untuk memilih tanggal dan waktu tanpa zona waktu.
3. tanggal Waktu: Jenis input ini memungkinkan pengguna untuk memilih tanggal dan waktu dengan zona waktu.
4. bulan: Ini memungkinkan pengguna untuk memilih bulan dan tahun
5. email: Bidang masukan ini digunakan untuk berisi alamat email.

Pertanyaan wawancara ini juga akan membantu dalam viva (lisan) Anda. Untuk membangun karir yang cemerlang sebagai UI / UX pengembang, kandidat perlu memecahkan wawancara di mana mereka ditanyai berbagai pertanyaan wawancara HTML5.