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.
Mit meinem Agent installieren
Kopieren Sie diese Anfrage in Ihren Agent. Sie enthält die maßgebliche Skill-Seite und das Manifest.
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.Ihr Agent sollte weiterhin seinen Plan anzeigen und alle von der Sicherheitsrichtlinie verlangten Bestätigungen anfordern.
Agent-lesbare Ressourcen
Verwenden Sie diese Links, wenn ein KI-Agent, Crawler oder Skript sauberen Kontext benötigt, statt die vollständige Seite zu lesen.
Testen
„web-design-guidelines“ wird verwendet. Review a checkout form with a low-contrast secondary action and no visible focus state.
Erwartetes Ergebnis:
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.
„web-design-guidelines“ wird verwendet. Create theme guidance for a dashboard that supports light and dark modes.
Erwartetes Ergebnis:
- 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.
„web-design-guidelines“ wird verwendet. Audit a table workflow for narrow screens and long labels.
Erwartetes Ergebnis:
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.
Sicherheitsaudit
SicherAll 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.
Risikofaktoren
⚙️ Externe Befehle (1)
🌐 Netzwerkzugriff (2)
Diesen Bericht teilen & zitieren
Teile den versionierten Bewertungsbericht, das neutrale Badge, die Einbettungskarte und Zitate. Skillstore berichtet Nachweise, ohne zu entscheiden, ob dieser Skill sicher ist.
Berichtslink kopieren
https://skillstore.io/skills/shreyam1008-web-design-guidelines/audits/1?utm_source=security_passport&utm_medium=share&utm_campaign=versioned_reportMarkdown-Badge
[](https://skillstore.io/skills/shreyam1008-web-design-guidelines?utm_source=security_passport_badge)HTML-Badge
<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>Einbettungskarte
<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>Wissenschaftliche Zitate (APA · BibTeX · CFF)
APA-Zitat
shreyam1008. (2026). web-design-guidelines security audit report (audit version 1) [Author version unspecified]. Skillstore. https://skillstore.io/skills/shreyam1008-web-design-guidelines/audits/1BibTeX-Zitat
@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"
Varianten vergleichen
7 installierbare VariantenJeder Autor bleibt ein eigener installierbarer Skill. Die empfohlene Variante wird nach Skillstore-Nachweisen bewertet.
Warum diese Variante zuerst steht
vercel-labs-web-design-guidelines
2026-11-10
shreyam1008-web-design-guidelines
2026-10-04
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
Skillstore-Score
Warum dieser Score Evidenzvertrauen: MittelWas Sie erstellen können
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.
Diese Prompts ausprobieren
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.
Bewährte Praktiken
- 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.
Vermeiden
- 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.
Häufig gestellte Fragen
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?
Entwicklerdetails
Autor
shreyam1008Lizenz
MIT
Skillstore-Revision
r1
Versionshinweis
Der Autor hat keine Version angegeben.
Ref.
bbec03cf10354f3aaccd6dd24eda4ac9ceeceac5
Aktualität der Wartung
2.10.2026
Nutzung
0 Downloads · 0 Aufrufe
Dateistruktur