Mesa
Biblioteca de componentes
Cómo usar este componente
Utilice el componente Tabla para mostrar y organizar los datos de forma eficaz. Seleccione este componente siempre que necesite presentar datos tabulares de forma clara y accesible.
Muestra datos estructurados en formato de cuadrícula, con opciones para encabezados, clasificación y funcionalidad de búsqueda.
Prácticas recomendadas
- Habilite el campo de búsqueda de tablas más grandes para mejorar la navegación de datos.
- Siga las convenciones de encabezado (H2-H6) dentro de las celdas de la tabla.
- Utilice varios componentes de tabla si es necesario para mayor claridad.
- Organice las tablas con una fila de encabezado superior o un encabezado de columna izquierda para mayor accesibilidad.
- No utilice tablas para fines de diseño; utilice el componente Control de columna en su lugar.
- Evite establecer anchos de columna fijos; Las tablas deben responder a la ventanilla del usuario.
- No combine varias tablas en un componente.
- No coloque imágenes en celdas de tabla.
Características y opciones
Las tablas se pueden colocar en cualquier lugar de la página, sin embargo, asegúrese de que las tablas tengan un ancho de columna suficiente.
Las tablas tienen las siguientes propiedades:
- Título
- ID (le permite establecer un enlace de anclaje)
- Tamaño del título: H2 (predeterminado)
- Descripción
- Campo de búsqueda
- Tamaño de fuente: pequeño (predeterminado) o grande
- Estilo de alineación: encabezado de columna superior (predeterminado) o izquierdo
| Encabezado 1 | Encabezado 2 | Encabezado 3 |
| Fila 1- Columna 1 | Fila 1- Columna 2 | Fila 1- Columna 3 |
| Fila 2- Columna 1 | Fila 2- Columna 2 | Fila 2- Columna 3 |
| Fila 3- Columna 1 | Fila 3- Columna 2 | Fila 3- Columna 3 |
| Fila 4- Columna 1 | Fila 4- Columna 2 | Fila 4- Columna 3 |
| Fila 5- Columna 1 | Fila 5- Columna 2 | Fila 5- Columna 3 |
| Encabezado 1 | Fila 1- Columna 1 | Fila 1- Columna 2 | Fila 1- Columna 3 |
| Encabezado 2 | Fila 2- Columna 1 | Fila 2- Columna 2 | Fila 2- Columna 3 |
| Encabezado 3 | Fila 3- Columna 1 | Fila 3- Columna 2 | Fila 3- Columna 3 |
Pautas de accesibilidad
- Asegúrese de que las tablas estén organizadas con una fila o columna de encabezado clara.
- Los encabezados deben describir los datos a los que pertenecen, mejorando la navegación del lector de pantalla.
- Evite usar tablas para datos no tabulares para evitar problemas de accesibilidad.
- Todas las tablas deben ser tablas simples. No se puede acceder a las tablas complejas.
Lista de verificación del coordinador web
- Asegúrese de que haya una fila o columna de encabezado y describa con precisión los datos.
- Active el campo de búsqueda para tablas con más de tres filas.
- Evite anchos de columna fijos; Asegúrese de que la tabla se ajuste a diferentes ventanas gráficas.