Membuat Tabel Sedehana dengan HTML

Website adalah keseluruhan halaman-halaman web yang terdapat dalam sebuah domain yang mengandung informasi, biasanya web dibangun atas banyak halaman web yang saling berhubungan atau disebut juga dengan hyperlink, sedangkan teks yang dijadikan media penghubung disebut hypertext.

HTML(Hypertext Markup Language) Hypertext sendiri merupakan sebuah text yang apabila di klik akan membawa pergi dari satu dokumen ke dokumen lainnya, Markup sendiri digunakan untuk mengatur layout dan tampilan-tampilan visual seperti font, warna text, gambar, dll, lalu Language merupakan penunjuk bahwa HTML merupakan semacam script pemrograman. Jadi HTML adalah script pemrograman yang mengatur bagaimana dalam menyajikan informasi di dunia internet dan bagaimana informasi itu membawa kita melompat dari satu tempat ke tempat lainnya.

Disini saya akan membuat web sederhana dengan menggunakan HTML, begini langkah-langkahnya :

1. Buka aplikasi bernama Notepad++

2. Lalu setelah buka aplikasi Notepad++, di dalam Notepad++ pada menu Language pilih H lalu pilih HTML

3. Lalu setelah itu kita buat kodingan web sederhananya seperti gambar berikut :

Jadi di dalam kodingan yang tadi kita buat, line 1 sampai 12 merupakan untuk membuat tulisan tebal di pojok kiri atas dan juga untuk membuat sebuah tabel dengan dua kolom dan dua baris. Lalu pada kolom pertama ada tulisan “ini kolom 1 pada baris 1” dan juga ada tulisan “ini kolom 1 pada baris 2” dan pada kolom kedua isinya sama hanya tapi yang ini barisnya menjadi baris 2, yang pertama “ini kolom 1 pada baris 2” dan yang kedua “ini kolom 2 pada baris 2”. Selanjutnya pada line 1 terdapat sebuah huruf p <p> yang berfungsi untuk membuat paragraf, lalu ada huruf b <b> yang berfungsi untuk menebalkan. Lalu pada line 2 terdapat <table> yang berfungsi untuk membuat tabel, lalu ada border ="1" yaitu border yang dipilih merupakan tipe nomor 1, lalu  bordercolor="black" yaitu border diberi warna hitam, lalu bgcolor="White" yaitu warna background berwarna putih, cellspadding="8" dan cellspasing="0" yaitu spasi yang kekanan bernilai 8 dan spasi yang kebawah bernilai 0, kemudian width="100%" yaitu ukurannya 100 persen. Selanjutnya pada line 4 dan lima kita membuat <tr> dan <td>, <tr> sendiri digunakan untuk membuat kolom dan <td> sendiri digunakan untuk membuat baris. Selanjutnya pada line 14 sampai 54 kita membuat tabel tersebut sebagai bingkai paragraf yang diberi warna biru dan terletak di bawah tabel, lalu kita buat tulisan yang berisi “Dalam menyelesaikan tugas kelompok softskill ini kami membuat halaman dengan tujuan melakukan tutorial website” dan diberi border, lalu kita buat tulisan Kelas 2ia21 dan kita buat sebuah tabel pada baris pertama kita isi Nama Kelompok dan NPM Kelompok dan diberi warna tabelnya dengan warna ungu, disini membuat nama kelompok dan npmnya ada 5 orang yaitu pada baris ke 2 kita beri tulisan ABDUL AZIZ dengan NPMnya yaitu 50417014, lalu pada baris ke 3 kita beri tulisan AZHAR RAFI SYABAN dengan NPMnya yaitu 51417098, lalu pada baris ke 4 kita beri tulisan MUHAMMAD ANDYKA BAKRY dengan NPMnya yaitu 53417754, lalu pada baris ke 5 kita beri tulisan MUHAMMAD HABIB CAHYA HERDIKA dengan NPMnya yaitu 51417098, lalu terkahir pada baris ke 6 kita beri tulisan SULISTIO RACHMADI dengan NPMnya yaitu 55417795. Selanjutnya pada line 14 terdapat front color="blue" yaitu warna dari tulisan berwarna biru, lalu pada line 15 terdapat style="border-collapse: collapse" yaitu memilih style border yang collapse,  terakhir pada line 24 align digunakan untuk menentukan tata letak tulisan.

4. Jika sudah membuat kodingan seperti diatas Save kodingan yang sudah dibuat dengan format nama file.html

5. Terakhir jika sudah disave kita buka file yang tadi disave, lalu akan otomatis masuk ke browser dan muncul tabel yang kita buat seperti  berikut :

Untuk lebih jelasnya silahkan tonton video pada link yang sudah di siapkan dibawah ini, terimakasih.

Link Video :

https://youtu.be/gWQZkXBIndI

Daftar Pustaka :

Jubilee Enterprise. 2015. HTML 5 Manual Book.  PT Elex Media Komputindo. Jakarta diakses 14 Juli 2019


Yuhefizar, S. Kom, Ir. HA Mooduto, Rahmat Hidayat, ST. 2009. Cara Mudah Membangun Website Interaktif Menggunakan Content Management System Joomla Edisi Revisi. PT Elex Media Komputindo. Jakarta diakses 14 Juli 2019