Test Summary
- Triggered by:
@pelikhan
- Workflow run: §24721564671
- Devices tested: 10 (4 mobile, 3 tablet, 3 desktop)
- Test date: 2026-04-21
- Test method: Static HTML analysis via curl fallback (Playwright visual testing unavailable — ERR_ABORTED due to network isolation between Playwright container and agent container bridge IP)
Results Overview
- 🟢 Passed: 10/10 devices (no critical layout or accessibility failures)
- 🟡 Warnings: 4
- 🔴 Critical: 0
Warnings Found
-
No prefers-contrast / forced-colors media query — High-contrast mode not explicitly supported in the embedded CSS. Users with forced-colors OS settings may experience unstyled or hard-to-read content.
-
Logo <img> missing explicit width/height HTML attributes — Dimensions are encoded in the SVG data URI rather than set as HTML attributes. This introduces a minor Cumulative Layout Shift (CLS) risk before CSS finishes parsing.
-
No loading="lazy" on video poster images or other non-critical images — The page has 2 <video> elements with poster images and uses preload="metadata". No lazy loading attributes are present, which may slow initial page load on slow connections.
-
Search returns a placeholder in dev mode — The Pagefind-based site search shows an 'only available in production builds' message in the dev server. This is expected Astro/Pagefind behavior and not a bug, but worth noting for testers who expect search to work in npm run dev.
View Detailed Test Results by Device
Mobile Devices (all PASS)
| Device |
Viewport |
Title |
H1 |
Overflow |
Search |
Hamburger Nav |
| iPhone 12 |
390×844 |
✅ |
✅ |
✅ None |
✅ |
✅ |
| iPhone 12 Pro Max |
428×926 |
✅ |
✅ |
✅ None |
✅ |
✅ |
| Pixel 5 |
393×851 |
✅ |
✅ |
✅ None |
✅ |
✅ |
| Galaxy S21 |
360×800 |
✅ |
✅ |
✅ None |
✅ |
✅ |
- Navigation: hamburger menu (header links hidden at ≤768px)
- Sidebar: overlay drawer mode
- Tables: converted to card layout at ≤640px
- Code blocks:
white-space: pre-wrap prevents horizontal overflow
Tablet Devices (all PASS)
| Device |
Viewport |
Nav Type |
Sidebar |
| iPad |
768×1024 |
Hamburger (boundary case) |
Persistent |
| iPad Pro 11 |
834×1194 |
Tablet hamburger dropdown |
Persistent |
| iPad Pro 12.9 |
1024×1366 |
Full header nav |
Persistent |
- iPad at 768px sits at the exact breakpoint boundary (max-width: 768px fires for hamburger; min-width: 48rem = 768px fires for persistent sidebar)
- 769–900px range uses a dedicated tablet dropdown to prevent nav overflow
Desktop Devices (all PASS)
| Device |
Viewport |
Nav Type |
Sidebar |
| HD Desktop |
1366×768 |
Full header nav |
Persistent |
| FHD Desktop |
1920×1080 |
Full header nav |
Persistent |
| 4K Desktop |
2560×1440 |
Full header nav |
Persistent |
View Accessibility Findings
✅ Skip link present and correctly visually-hidden until focused (WCAG 2.4.1)
✅ Heading hierarchy correct: H1 → H2 → H3 across tested pages
✅ All images have alt text (0 images missing alt attribute)
✅ 8 aria-label attributes found; nav regions labeled 'Primary navigation'
✅ Videos have aria-label, title, and <track kind='captions' srclang='en'> for English captions
✅ prefers-reduced-motion respected for video container transitions
✅ Focus-visible CSS present for keyboard navigation
✅ Touch targets ≥44px enforced on mobile (WCAG 2.5.5)
✅ All landmark regions present: <header>, <nav> ×2, <main>, <footer>
✅ lang='en', dir='ltr' correctly set on <html>
✅ Viewport meta: width=device-width, initial-scale=1
⚠️ No forced-colors / prefers-contrast media query found
View Verified Pages
All internal page routes return HTTP 200:
| Page |
Status |
| /gh-aw/ (Home) |
✅ 200 |
| /gh-aw/introduction/overview/ |
✅ 200 |
| /gh-aw/setup/quick-start/ |
✅ 200 |
| /gh-aw/blog/ |
✅ 200 |
| /gh-aw/reference/faq/ |
✅ 200 |
29 internal links found and none point to broken paths within the tested pages.
Recommendations
- Add
forced-colors and prefers-contrast media queries to improve high-contrast mode support.
- Add explicit
width and height HTML attributes to the logo <img> to eliminate CLS risk.
- Add
loading="lazy" to video poster images and any below-the-fold images.
References:
Generated by Multi-Device Docs Tester · ● 379.1K · ◷
Test Summary
@pelikhanResults Overview
Warnings Found
No
prefers-contrast/forced-colorsmedia query — High-contrast mode not explicitly supported in the embedded CSS. Users with forced-colors OS settings may experience unstyled or hard-to-read content.Logo
<img>missing explicitwidth/heightHTML attributes — Dimensions are encoded in the SVG data URI rather than set as HTML attributes. This introduces a minor Cumulative Layout Shift (CLS) risk before CSS finishes parsing.No
loading="lazy"on video poster images or other non-critical images — The page has 2<video>elements with poster images and usespreload="metadata". No lazy loading attributes are present, which may slow initial page load on slow connections.Search returns a placeholder in dev mode — The Pagefind-based site search shows an 'only available in production builds' message in the dev server. This is expected Astro/Pagefind behavior and not a bug, but worth noting for testers who expect search to work in
npm run dev.View Detailed Test Results by Device
Mobile Devices (all PASS)
white-space: pre-wrapprevents horizontal overflowTablet Devices (all PASS)
Desktop Devices (all PASS)
View Accessibility Findings
✅ Skip link present and correctly visually-hidden until focused (WCAG 2.4.1)
⚠️ No
✅ Heading hierarchy correct: H1 → H2 → H3 across tested pages
✅ All images have alt text (0 images missing alt attribute)
✅ 8 aria-label attributes found; nav regions labeled 'Primary navigation'
✅ Videos have
aria-label,title, and<track kind='captions' srclang='en'>for English captions✅
prefers-reduced-motionrespected for video container transitions✅ Focus-visible CSS present for keyboard navigation
✅ Touch targets ≥44px enforced on mobile (WCAG 2.5.5)
✅ All landmark regions present:
<header>,<nav>×2,<main>,<footer>✅
lang='en',dir='ltr'correctly set on<html>✅ Viewport meta:
width=device-width, initial-scale=1forced-colors/prefers-contrastmedia query foundView Verified Pages
All internal page routes return HTTP 200:
29 internal links found and none point to broken paths within the tested pages.
Recommendations
forced-colorsandprefers-contrastmedia queries to improve high-contrast mode support.widthandheightHTML attributes to the logo<img>to eliminate CLS risk.loading="lazy"to video poster images and any below-the-fold images.References: