Cara Membuat Tabel Data Online

Tabel data mencantumkan berbagai informasi dalam kolom dan baris agar mudah dibaca. Data biasanya sebagian numerik dengan label teks. Contohnya adalah tabel data yang menunjukkan berapa banyak kalori yang dimakan seseorang setiap hari. Pembuatan tabel data secara online dapat dilakukan dengan HTML atau bahasa browser CSS yang lebih kompleks. Tabel terakhir terlihat seperti tabel data yang dibuat dalam spreadsheet atau di atas kertas. Satu-satunya perbedaan adalah pengkodean latar belakang, yang tidak terlihat kecuali melihat kode sumbernya. Pengkodean dapat dibuat oleh editor HTML, teks, atau cara lain. Ada banyak situs online yang menawarkan kemampuan untuk memasukkan data, mengatur beberapa atribut dan membuat semua pengkodean tabel untuk Anda. Tabel data online biasanya digunakan sebagai bagian dari halaman Web. Tabel data sering digunakan untuk membuat daftar item dengan kategori, seperti item untuk dijual. Beberapa halaman Web menggunakannya untuk menampilkan statistik informasi. Meskipun tabel data dapat digunakan secara offline untuk mencetak atau dalam laporan, biasanya lebih baik digunakan perangkat lunak spreadsheet, seperti Microsoft Office Excel, yang menawarkan lebih banyak fitur untuk bekerja dengan data. Panduan ini menunjukkan cara membuat tabel data HTML dengan Notepad.

Buka editor HTML atau hanya dokumen teks Notepad biasa untuk memasukkan kode HTML. Notepad bekerja dengan baik jika Anda terbiasa dengan pengkodean HTML. Editor HTML membuat tugas berulang lebih cepat, tetapi beberapa, seperti Frontpage, menambahkan pengkodean tambahan yang tidak perlu yang dapat memperlambat halaman Web. Hal terbaik untuk dilakukan adalah membuat kode dengan editor HTML terlebih dahulu, lalu kembali dan edit kode dengan tangan untuk membersihkannya.

Tentukan atribut tabel untuk batas, lebar, warna latar belakang, dan warna font. Anda perlu mempertimbangkan tata letak halaman Web, lebar, warna, dan atribut lainnya untuk membuat tabel mudah dibaca. Anda juga perlu memutuskan berapa banyak baris dan kolom yang diperlukan untuk data. Mulailah mendefinisikan atribut tabel. (Contoh kami menunjukkan jumlah kalori yang dimakan saat makan siang dan makan malam pada setiap hari kerja. Kami membutuhkan tiga kolom (Hari, Makan Siang, dan Makan Malam) dan tujuh baris (dua untuk label dan satu untuk setiap hari kerja).

Tambahkan batas di sekitar tabel dan sel data. Batas memisahkan data ke dalam sel agar mudah dilihat. Itu diukur dalam piksel dan dapat diberi nilai 0 untuk tidak menggunakannya. Perbatasan satu atau dua piksel umumnya baik-baik saja. Tag untuk perbatasan adalah

bgcolor=border="CHOSEN_BORDER_WIDTH"

Warna perbatasan dapat diubah dengan tag

bordercolor="CHOSEN_COLOR"

yang menggunakan istilah warna dasar, seperti kode warna heksadesimal merah atau hitam atau enam digit. Heksadesimal menawarkan lebih banyak warna. Contoh kita menggunakan border="2" dan bordercolor="black".

Tentukan lebar seluruh tabel. Ini diukur dalam piksel atau persen dari ukuran layar. Piksel bersifat definitif dan persentase memungkinkan tabel menyesuaikan dengan ukuran layar yang berbeda. Cobalah untuk menilai lebar berdasarkan lebar data di seluruh baris. Jika nanti Anda mengetahui meja terlalu tipis atau lebar, itu bisa diubah. Contoh kami menggunakan lebar = "175".

Mengatur warna latar belakang sel data. Ini berbeda dari warna latar belakang halaman, yang dapat menawarkan kontras yang baik. Tagnya adalah

bgcolor="CHOSEN_COLOR"

seperti warna perbatasan. Contoh kita menggunakan bgcolor="white".

Mengatur warna font teks dalam sel. Pastikan warnanya kontras dengan baik dengan latar belakang, sehingga mudah dibaca. Terang saat gelap atau gelap saat terang selalu bekerja paling baik. Tagnya adalah

font="CHOSEN_COLOR"

Contoh kita adalah font="black", yang sangat kontras dengan latar belakang putih.

Tuliskan tag tabel lengkap antara panah kiri dan kanan dengan spasi di antara atribut tag dan dimulai dengan tag tabel di depan. Urutan tag tidak masalah, selama "tabel" ada di depan.

Tentukan lebar kolom. Lebar setiap kolom tergantung pada lebar seluruh tabel. Ambil lebar tabel dan bagi dengan jumlah sel untuk mendapatkan kolom berukuran sama. Jika perlu, sesuaikan lebar kolom, tetapi totalnya tidak boleh melebihi lebar tabel. Ketika satu lebar sel berubah, sel lainnya perlu disesuaikan untuk menjumlahkan lebar tabel. (Contoh kami memiliki lebar 175 dan tiga kolom per baris, jadi pembagian genap sekitar 59. Pembagian sebenarnya adalah 70, 60, 40.)

Mulailah menambahkan data Anda. Pertama, mulailah baris baru dan tambahkan baris tabel dengan kode

. Selanjutnya, tambahkan tag data tabel

Masukkan data Anda untuk sel; menggunakan kode ini untuk mewakili sel kosong:

Tutup sel dengan tag. Tag warna batas digunakan untuk menentukan warna batas sel, jika diinginkan. Jika dibiarkan, warna batas tabel default digunakan. Kode sel pertama contoh kami adalah:

Ulangi pembuatan sel data tabel, masing-masing pada baris baru, hingga semua sel dalam baris selesai. Kemudian akhiri baris dengan tag. Mulailah baris berikutnya dengan proses yang sama, dimulai dengan

tandai lagi.

Tutup kode tabel dengan dengan menandai. Kode tabel terakhir kami, jika diakhiri setelah dua baris data, ada di bawah.

KALORI

Hari

Makan siang

Makan malam

Senin

450

800

Selasa

600

720

Hal yang Anda Butuhkan

  • Editor HTML atau Notepad
  • Data
  • Bagikan
instagram viewer