Tipos de paneles
Panel chico simple
Sirven para mostrar información sobre una temática particular. No son accionables, es por eso que no poseen ningún tipo de fondo que actúe como contenedor de la información.
Panel chico con accionables o enlace
Además de brindar información, las personas usuarias tienen la posibilidad de realizar algún tipo de acción correspondiente al contexto en el que se presente el panel.
Panel chico con lista de enlaces
Sirven para listar contenido relacionado y efectuar alguna acción determinada, como por ejemplo: descargar un archivo o abrir la información en una nueva pestaña.
Panel chico con lista de descargas
Puede utilizarse para descargas de archivos relacionados al contenido principal y poder darle más visibilidad y jerarquía que con una lista de enlaces.
Diseño y estructura (contexto de uso)
Contenedores y fondos
Los paneles pueden estar contenidos con un fondo únicamente si están compuestos de al menos un elemento que permita el llamado a la acción. En el caso de los paneles simples, sería incorrecto el uso de fondos ya que pueden generar confusión a las personas usuarias por su similitud a un componente tipo tarjeta.
Por definición el componente de paneles no tienen ningún estado (hover, active, focus), ya que su función es agrupar diferentes elementos y relacionarlos entre si.
Grupo de paneles
Los paneles pueden agruparse entre sí para informar sobre determinado contenido. Estos grupos tienen que ser de un máximo de 3 paneles chicos, para que la estructura conformada sea armoniosa y el contenido detallado en la descripción no se desborde.
Además, los grupos de paneles tiene disponer del mismo elemento para llamar a la acción. No debe utilizarse, en un mismo grupo, diferentes tipos de botones en cada panel.
En el caso de que haya menos de 3 paneles, no se debe modificar su tamaño y debe mantener la estructura del componente, ó si el contenido es de suma relevancia también se pueden utilizar 2 destacados conjunto ó 1 destacado banner.
Al utilizar un grupo de paneles chicos simples, la recomendación es agruparlos dentro de un contenedor y utilizar un titular para dar la sensación a las personas usuarias de que esa información esta allí para comunicar algo que destaca por sobre el resto.
Recordar que no se debe agregar un fondo a los paneles simples individualmente ya que puede generar confusión con la funcionalidad de las tarjetas.
Paneles con listas
Los paneles con listas se utilizan en el "sidebar" de la interfaz para brindarle a las personas usuarias información adicional y complementaria.
Imágenes en paneles
El uso de imágenes en los paneles chicos es opcional. La imagen es un refuerzo visual que ayuda a las personas usuarias a entender el contexto o reforzar la información. En caso de utilizar imágenes recordar siempre completar el atributo alt="..."