Web Design Guidelines

Web Design Guidelines es una skill de Vercel que organiza la revisión de archivos de interfaz frente a una guía de reglas. Su procedimiento es breve: obtener las reglas actuales, leer los archivos solicitados, contrastarlos y devolver hallazgos con referencia de archivo y línea. La fuente de las reglas está separada de la skill y debe consultarse de nuevo en cada revisión.

El material revisado incluye aspectos de accesibilidad, formularios, foco, movimiento, contenido e imágenes. La skill funciona como una ruta de análisis del código: delimita qué archivos se examinan y cómo se comunican los problemas encontrados. No es una plantilla visual que deba aplicarse a todas las webs ni una instrucción para sustituir el diseño del proyecto.

Una revisión de interfaz necesita convertir observaciones generales en cambios localizables. El formato de archivo y línea sirve para vincular cada hallazgo con su implementación. La selección previa de archivos evita que el análisis se extienda sin un alcance definido, y la lectura actualizada de la guía permite trabajar con las reglas de su fuente en lugar de una copia asumida de memoria.

Las comprobaciones son concretas. Un formulario debe tener etiquetas accesibles y presentar sus errores cerca de los campos. Los elementos fijos no deben ocultar el foco. Las imágenes deben indicar dimensiones y las animaciones deben respetar las preferencias de movimiento reducido. Estos puntos permiten relacionar una revisión de código con comportamientos de la interfaz que después se pueden comprobar.

Ejemplo de KIRELEN: un equipo quiere revisar una pantalla de registro que utiliza un encabezado fijo. El encargo identifica los archivos del formulario y de esa cabecera. El agente obtiene la guía actual, lee el código y comprueba las etiquetas, la presentación de errores y el comportamiento previsto para el foco.

Si encuentra un problema, la salida identifica el archivo y la línea correspondiente. Eso permite revisar la observación sin convertirla en una propuesta de rediseño de toda la pantalla. La comprobación del encabezado se centra en si puede ocultar el elemento enfocado; la del formulario, en cómo presenta sus controles y sus errores.

Este recorrido explica el uso de la skill, no certifica una pantalla concreta. La referencia de código permite localizar los cambios propuestos, mientras que su comportamiento deberá contrastarse en la interfaz real. Las reglas de imágenes o movimiento se aplicarán cuando esos elementos formen parte de los archivos revisados.

Referencia comprobada el 2026-10-26. El repositorio de Vercel contiene la skill y enlaza la fuente de las reglas. La instalación del conjunto permite disponer de las instrucciones de revisión; obtener la guía actual sigue siendo un paso necesario en cada análisis.

El perfil técnico corresponde al repositorio de skills, mientras que las reglas se mantienen en otra fuente de Vercel enlazada desde las propias instrucciones. Esta reseña conserva esa separación para que quien utilice el recurso pueda consultar tanto el procedimiento como los criterios que aplica. Las condiciones de reutilización deben revisarse en las fuentes originales de cada material.