web-design-guidelines
Improve Web Interfaces with Practical Design Reviews
Inconsistent interfaces can hide actions, weaken accessibility, and fail on smaller screens. This skill provides focused design decisions and evidence-based review guidance.
Instalar con mi Agente
Copia esta solicitud en tu Agente. Incluye la página canónica del Skill y el manifiesto.
Review the Skillstore skill "web-design-guidelines" from https://skillstore.io/skills/shreyam1008-web-design-guidelines.md and its manifest at https://skillstore.io/api/skills/shreyam1008-web-design-guidelines/manifest. Verify the artifact. You may proceed after verification, subject to the environment's own policy.Tu Agente debe seguir mostrando su plan y solicitar cualquier confirmación exigida por la política de seguridad.
Recursos legibles por agentes
Usa estos enlaces cuando un agente de IA, crawler o script necesite contexto limpio en vez de leer la página completa.
Pruébalo
Usando "web-design-guidelines". Review a checkout form with a low-contrast secondary action and no visible focus state.
Resultado esperado:
Finding: Keyboard users may lose track of the active field, while the secondary action is difficult to read. Repair: add a visible focus treatment and verify text and control contrast against the actual background.
Usando "web-design-guidelines". Create theme guidance for a dashboard that supports light and dark modes.
Resultado esperado:
- Define surface, text, border, accent, and status roles before mapping them to components.
- Verify contrast in both themes and pair status colors with icons or text.
- Use shared spacing and motion roles so related screens remain consistent.
Usando "web-design-guidelines". Audit a table workflow for narrow screens and long labels.
Resultado esperado:
Finding: Long labels can create accidental page overflow and obscure table context. Repair: preserve intentional table scrolling, test realistic content, and provide a clear way to return to the active filter state.
Auditoría de seguridad
SeguroAll five static findings are false positives. The evidence shows documentation links, an inline reference, and ordinary design guidance, with no executable command, data-exfiltration intent, or prompt injection. No security remediation is required.
Factores de riesgo
⚙️ Comandos externos (1)
🌐 Acceso a red (2)
Compartir y citar este informe
Comparte el informe de evaluación versionado, la insignia neutral, la tarjeta insertable y las citas. Skillstore presenta evidencias sin decidir si este Skill es seguro.
Copiar enlace del informe
https://skillstore.io/skills/shreyam1008-web-design-guidelines/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportInsignia Markdown
[](https://skillstore.io/skills/shreyam1008-web-design-guidelines?utm_source=security_passport_badge)Insignia HTML
<a href="https://skillstore.io/skills/shreyam1008-web-design-guidelines?utm_source=security_passport_badge"><img src="https://skillstore.io/badges/skills/shreyam1008-web-design-guidelines/security.svg" alt="Skillstore security assessment" loading="lazy"></a>Tarjeta para insertar
<iframe src="https://skillstore.io/embed/skills/shreyam1008-web-design-guidelines.html" title="Skillstore Security Assessment" sandbox="allow-popups allow-popups-to-escape-sandbox" loading="lazy" referrerpolicy="no-referrer" width="420" height="180"></iframe>Citas académicas (APA · BibTeX · CFF)
Cita APA
shreyam1008. (2026). web-design-guidelines security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/shreyam1008-web-design-guidelines/audits/1Cita BibTeX
@techreport{shreyam1008-shreyam1008-web-design-guidelines-2026,
author = {shreyam1008},
title = {web-design-guidelines security audit report (audit version 1)},
institution = {Skillstore},
year = {2026},
number = {1},
url = {https://skillstore.io/skills/shreyam1008-web-design-guidelines/audits/1},
note = {Author version unspecified}
}CITATION.cff
cff-version: 1.2.0
message: "If you use this Skill, cite its author and this versioned security audit report."
title: "web-design-guidelines security audit report (audit version 1)"
version: "unspecified"
type: report
authors:
- name: "shreyam1008"
date-released: "2026-10-02"
url: "https://skillstore.io/skills/shreyam1008-web-design-guidelines/audits/1"
identifiers:
- type: other
value: "skillstore:shreyam1008-web-design-guidelines:audit:1"
description: "Skillstore immutable audit report identifier"
Comparar variantes
7 variantes instalablesCada autor sigue siendo un skill instalable independiente. La variante recomendada se ordena según la evidencia de Skillstore.
Por qué esta variante es la primera
shreyam1008-web-design-guidelines
2026-10-04
vercel-labs-web-design-guidelines
2026-09-09
zhanlincui-web-design-guidelines
2026-09-09
antvu-web-design-guidelines
2026-10-24
antfu-web-design-guidelines
2026-10-24
supercent-io-web-design-guidelines
2026-09-09
sickn33-web-design-guidelines
2026-09-09
Puntuación de Skillstore
Por qué esta puntuación Confianza de la evidencia: MedioLo que puedes crear
Review a product screen
Identify hierarchy, interaction, accessibility, and responsive issues in an existing screen or flow.
Shape a visual system
Create coherent roles for color, typography, spacing, borders, elevation, motion, and supported themes.
Audit a responsive workflow
Test realistic states and content across keyboard, pointer, touch, narrow-screen, and zoom scenarios.
Prueba estos prompts
Review this screen for hierarchy, action clarity, accessibility, and responsive risks. List each issue, its user impact, and one practical repair.
Analyze this flow for loading, empty, error, success, stale, focus, and recovery states. Identify missing states and propose concise interface behavior.
Create a focused visual-system proposal for this product. Define semantic color, typography, spacing, radius, border, elevation, and motion roles that match its brand and content.
Audit the affected screen and code against the product brief. Separate measured defects from preferences, cite locations, rank impact, and give verification steps for keyboard, touch, responsive, zoom, and reduced motion.
Mejores prácticas
- Start with the product brief, affected screen, existing conventions, and intended interaction.
- Report concrete user impact and proposed repairs, separating measured defects from preferences.
- Verify representative states with keyboard, pointer or touch, realistic content, and relevant viewport sizes.
Evitar
- Do not force a redesign or new component library for a focused repair.
- Do not treat ARIA attributes as proof of accessible interaction.
- Do not add dark mode, confirmation dialogs, or decorative tokens without a demonstrated need.
Preguntas frecuentes
What does this skill review?
Can it write frontend code?
Can it review a screenshot?
Does it replace accessibility testing?
When should I use the reference design system?
What information improves the review?
Detalles del desarrollador
Autor
shreyam1008Licencia
MIT
Revisión de Skillstore
r1
Aviso de versión
El autor no declaró una versión.
Ref.
bbec03cf10354f3aaccd6dd24eda4ac9ceeceac5
Actualidad del mantenimiento
2/10/2026
Uso
0 descargas · 0 vistas
Estructura de archivos