diff --git a/.jules/palette.md b/.jules/palette.md index ea004e2d..2fbfd649 100644 --- a/.jules/palette.md +++ b/.jules/palette.md @@ -81,3 +81,6 @@ ## 2026-08-12 - Skip to Content Accessibility **Learning:** Screen reader and keyboard-only users experience significant friction when forced to navigate through repetitive header controls on every page load. **Action:** Keep a visible-on-focus skip link as the first interactive element, target a programmatically focusable main container, and give the focused link a high-contrast outline. +## 2024-05-19 - Accessibility for UI states and links +**Learning:** Adding ARIA-labels for "opens in a new tab" to external links significantly helps screen reader context. Using `aria-busy` along with visual styling (`opacity`, `pointer-events`) accurately represents loading rows in non-framework components. Extracting inline styles to CSS classes is necessary when adding hover/focus states to elements like buttons. Modifying programmatic focus flow (e.g. `element.focus()`) can unintentionally break implicit keyboard accessibility tests; adding shortcut tooltips (`title`) or ARIA labels is safer for incremental a11y improvements. +**Action:** Consistently apply `aria-label` to external links, `aria-busy` to loading states, and extract inline button styles to CSS for interactive pseudo-classes, but avoid touching `focus()` lines on components unless specifically refactoring the focus flow. diff --git a/scanner/dashboard/console.html b/scanner/dashboard/console.html index 7ec262af..588cf6e7 100644 --- a/scanner/dashboard/console.html +++ b/scanner/dashboard/console.html @@ -6,8 +6,8 @@ AppGuardrail Console