Pengembangan web adalah salah satu bidang yang berkembang pesat di era digital saat ini. Hal ini menuntut adanya keterampilan dan pengetahuan yang memadai bagi para pengembang web, baik profesional maupun pemula. Bagi siswa SMK yang mengambil bidang keahlian Pengembangan Perangkat Lunak dan Gim, pemahaman mengenai dasar-dasar pengembangan web menjadi keterampilan penting yang harus dimiliki.

Salah satu cara untuk mempelajari dasar-dasar pengembangan web adalah dengan menggunakan HTML. HTML adalah singkatan dari HyperText Markup Language, yaitu bahasa markup yang digunakan untuk membuat struktur dasar halaman web. HTML memungkinkan kita untuk menentukan elemen-elemen yang akan ditampilkan pada halaman web, seperti teks, gambar, tautan, tabel, formulir, dan lain-lain. HTML juga memungkinkan kita untuk memberikan atribut-atribut tertentu pada elemen-elemen tersebut, seperti warna, ukuran, gaya, dan lain-lain.

HTML merupakan bahasa yang mudah dipelajari dan dipahami, karena menggunakan tag dan atribut yang bersifat deskriptif. Tag adalah kode yang diapit oleh tanda kurung sudut (< dan >) yang menunjukkan jenis elemen yang digunakan. Atribut adalah informasi tambahan yang diberikan pada tag untuk mengatur sifat-sifat elemen tersebut. Contoh tag dan atribut HTML adalah sebagai berikut:

<h1>Ini adalah judul halaman</h1>
<p>Ini adalah paragraf pertama</p>
<p style="color: blue;">Ini adalah paragraf kedua dengan warna biru</p>
<a href="https://www.smk10semarang.sch.id">Ini adalah tautan ke Website SMKN 10 Semarang</a>
<img src="gambar.jpg" alt="Ini adalah gambar">

Dokumen HTML adalah dokumen yang disajikan pada web browser, yaitu aplikasi yang digunakan untuk mengakses dan menampilkan halaman web. Dokumen HTML biasanya memiliki ekstensi .htm atau .html. Dokumen HTML terdiri dari dua bagian utama, yaitu head dan body. Head adalah bagian yang berisi informasi tentang dokumen, seperti judul, meta data, dan tautan ke file-file lain yang dibutuhkan, seperti CSS dan JavaScript. Body adalah bagian yang berisi konten yang ditampilkan pada halaman web, seperti teks, gambar, tautan, dan lain-lain.

Untuk membuat dokumen HTML, kita dapat menggunakan aplikasi-aplikasi yang tersedia, seperti Notepad, Visual Studio Code, Sublime Text, dan lain-lain. Kita juga dapat menggunakan editor online, seperti CodePen, JSFiddle, Repl.it, dan lain-lain. Yang penting adalah kita dapat menulis kode HTML dengan benar dan menyimpannya dengan ekstensi .htm atau .html.

Dalam pembelajaran dasar pengembangan web, HTML merupakan fondasi yang penting untuk dipahami dan dikuasai oleh siswa. HTML memberikan landasan yang kokoh bagi siswa untuk belajar konsep-konsep lain yang terkait dengan pengembangan web, seperti CSS, JavaScript, Bootstrap, jQuery, dan lain-lain. CSS adalah bahasa yang digunakan untuk mengatur tampilan dan gaya halaman web. JavaScript adalah bahasa yang digunakan untuk menambahkan fungsi dan interaksi pada halaman web. Bootstrap, jQuery, dan lain-lain adalah framework dan library yang memudahkan pengembangan web dengan menyediakan komponen-komponen yang siap pakai.

Untuk meningkatkan pemahaman dan keterampilan siswa dalam pengembangan web, proyek praktis adalah salah satu metode yang efektif. Proyek praktis dapat memberikan kesempatan bagi siswa untuk menerapkan konsep-konsep yang telah dipelajari dalam pembuatan halaman web. Proyek praktis juga dapat meningkatkan kreativitas, motivasi, dan keterlibatan siswa dalam pembelajaran.

Salah satu contoh proyek praktis yang dapat dilakukan oleh siswa adalah membuat halaman web sederhana yang berisi informasi tentang diri mereka, seperti nama, kelas, hobi, cita-cita, dan lain-lain. Siswa dapat menggunakan HTML untuk membuat struktur dasar halaman web, seperti judul, paragraf, gambar, tautan, dan lain-lain. Siswa juga dapat menggunakan CSS untuk mengatur tampilan dan gaya halaman web, seperti warna, ukuran, font, dan lain-lain. Siswa juga dapat menggunakan JavaScript untuk menambahkan fungsi dan interaksi pada halaman web, seperti tombol, animasi, validasi, dan lain-lain.

Dengan melakukan proyek praktis, siswa dapat melihat hasil dari kode yang mereka tulis dan mendapatkan umpan balik langsung dari web browser. Siswa juga dapat mengevaluasi dan memperbaiki kode yang mereka tulis jika terdapat kesalahan atau kekurangan. Siswa juga dapat membandingkan dan berbagi hasil proyek mereka dengan teman-teman atau guru mereka.

Pembelajaran dasar pengembangan web dengan menggunakan HTML telah terbukti efektif dalam meningkatkan pemahaman dan keterampilan siswa SMK Kelas X Pengembangan Perangkat Lunak dan Gim. Hal ini didukung oleh hasil penelitian yang menggunakan pendekatan eksperimen kuasi dengan kelompok kontrol dan kelompok eksperimen. Kelompok kontrol menerima pembelajaran konvensional, sementara kelompok eksperimen menerima pembelajaran dengan menggunakan HTML. Pre-test dan post-test digunakan untuk mengukur peningkatan pemahaman siswa. Hasil analisis data menunjukkan bahwa kelompok eksperimen mengalami peningkatan pemahaman konsep dan keterampilan pengembangan web secara signifikan dibandingkan dengan kelompok kontrol. Observasi juga mencatat partisipasi dan keterlibatan siswa yang lebih tinggi selama proyek praktis.

Oleh karena itu, diharapkan guru Pengembangan Perangkat Lunak dan Gim dapat mempertimbangkan penggunaan HTML sebagai bagian integral dari kurikulum pembelajaran. HTML dapat memberikan manfaat bagi siswa dalam mempelajari dasar-dasar pengembangan web secara praktis dan menyenangkan. HTML juga dapat membuka jalan bagi siswa untuk belajar konsep-konsep lanjutan yang terkait dengan pengembangan web, seperti CSS, JavaScript, Bootstrap, jQuery, dan lain-lain. HTML juga dapat meningkatkan keterampilan dan kompetensi siswa dalam menghadapi tantangan dan peluang di era digital saat ini.

“SMK Negeri 10 Semarang, dari Semarang untuk Indonesia”