Lewati ke konten

Table

Table

banner-background
Table Section Overview

Table adalah pola tampilan data berbentuk grid (baris dan kolom) yang digunakan untuk menampilkan informasi secara terstruktur.

Pola ini membantu pengguna membaca, membandingkan, dan menganalisis data dengan lebih mudah tanpa kehilangan konteks.

Gunakan Table untuk menampilkan data dalam jumlah besar seperti daftar pengguna, laporan transaksi, atau hasil analisis.

Pola ini cocok digunakan pada halaman dashboard, laporan manajemen, atau pusat data, di mana pengguna perlu mengamati banyak entitas sekaligus.

Pastikan setiap kolom dan baris disusun secara logis agar mudah dipindai dan diurutkan.

Recommended - 1 Digit per Field

✅ Disarankan

Batasi konten dalam satu sel hingga maksimal 3–4 baris.

Avoided - 2 or More Digits

❌ Dihindari

Hindari konten terlalu panjang atau bertele-tele di dalam sel.

Header

Gunakan label kolom yang singkat, konsisten, dan deskriptif.

Pastikan urutan kolom mencerminkan prioritas informasi. Contohnya nama entitas di awal, status atau aksi di akhir.

Header Application

Row

Tampilkan data secara sejajar: rata kiri untuk teks dan rata kanan untuk angka atau nilai nominal.

Gunakan jarak antarbaris yang cukup agar tabel tetap terbaca dengan nyaman.

Row Application

Pagination

Gunakan pagination untuk tabel dengan jumlah data yang banyak (default 30 baris per halaman). Hal ini membantu menjaga performa halaman dan memudahkan pengguna fokus pada satu kelompok data dalam satu waktu.

Pagination Application

Action Area

Sediakan area khusus untuk aksi seperti edit, delete, view, atau info, menggunakan ikon atau tombol yang konsisten.

Hindari penggunaan teks panjang untuk aksi agar tampilan tabel tetap ringkas.

Action Area Application

Dashboard Identity and Access Management (IAM)

Contoh ini menampilkan penggunaan Table bersama Tabs Navigation dalam halaman Identity and Access Management (IAM).

Tabel berfungsi untuk menampilkan daftar pengguna dalam sistem SSO PERURI, mencakup fitur seperti pencarian pengguna, pengelompokan berdasarkan peran, serta status akun aktif atau nonaktif.

Dashboard IAM Application