Mesa
Biblioteca de componentes
Cómo utilizar 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 para 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 izquierdo para la accesibilidad.
- No utilice tablas con fines de diseño; en su lugar, utilice el componente Control de columna.
- 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ña (predeterminada) 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 un encabezado, fila o columna claros.
- Los encabezados deben describir los datos a los que pertenecen, lo que mejora la navegación del lector de pantalla.
- Evite el uso de tablas para datos no tabulares para evitar problemas de accesibilidad.
- Todas las mesas deben ser tablas simples. No se puede acceder a las tablas complejas.
Lista de verificación del coordinador web
- Asegúrese de que haya un encabezado, fila o columna y describa con precisión los datos.
- Active el campo de búsqueda para tablas con más de tres filas.
- Evite los anchos de columna fijos; Asegúrese de que la tabla se ajuste a las diferentes ventanas gráficas.