- I made both surfaces friendlier to screen readers.

CMS changes landed in [layout.php](/Users/tyemeclifford/Documents/GH/blog/themes/neon/layout.php), [style.css](/Users/tyemeclifford/Documents/GH/blog/themes/neon/assets/style.css), [app.js](/Users/tyemeclifford/Documents/GH/blog/themes/neon/assets/app.js), and [lone-embed.php](/Users/tyemeclifford/Documents/GH/blog/lone-embed.php): skip link, named search/forms, current page state, live notices/empty states, labelled media/embed controls, visible focus states, theme control pressed states, and a focus-trapped/lightbox dialog with proper ARIA. Mac app changes landed in [main.m](/Users/tyemeclifford/Documents/GH/blog/macclient/AppKitClient/main.m), and I rebuilt [TCMS](/Users/tyemeclifford/Documents/GH/blog/macclient/TCMS.app/Contents/MacOS/TCMS): AppKit controls/tables/fields/previews now get accessibility labels/help/value text, workspace sections are named, media/comment tables expose useful context, and status messages are announced via macOS accessibility notifications.
2026-07-05 23:36:27 -04:00
parent 0b28e719ee
commit 75d38d4eb8
6 changed files with 298 additions and 64 deletions
@@ -70,8 +70,9 @@ function e(string $value): string
    </style>
 </head>
 <body>
-    <video controls playsinline preload="metadata"<?php if ($poster !== ''): ?> poster="<?= e($poster) ?>"<?php endif; ?>>
+    <video controls playsinline preload="metadata" aria-label="<?= e($title !== '' ? $title : 'Embedded video') ?>"<?php if ($poster !== ''): ?> poster="<?= e($poster) ?>"<?php endif; ?>>
        <source src="<?= e($file) ?>" type="<?= e(media_type($file)) ?>">
+        Your browser does not support the video element.
    </video>
 </body>
 </html>
@@ -60,6 +60,25 @@ static NSString *TCMSFormatBytes(id value) {
        : [NSString stringWithFormat:@"%.1f %@", amount, units[unitIndex]];
 }

+static void TCMSSetAccessibility(NSView *view, NSString *label, NSString *help) {
+    if (!view) {
+        return;
+    }
+    if (label.length > 0) {
+        [view setAccessibilityLabel:label];
+    }
+    if (help.length > 0) {
+        [view setAccessibilityHelp:help];
+    }
+}
+
+static void TCMSSetAccessibilityValue(NSView *view, NSString *value) {
+    if (!view) {
+        return;
+    }
+    [view setAccessibilityValue:value ?: @""];
+}
+
@interface TCMSMarkdownTextView : NSTextView
@end

@@ -383,6 +402,7 @@ static NSString *TCMSFormatBytes(id value) {
    self.window.minSize = NSMakeSize(1040, 680);
    self.window.delegate = self;
    self.window.releasedWhenClosed = NO;
+    TCMSSetAccessibility(self.window.contentView, @"TCMS workspace", @"Manage posts, pages, media, comments, and settings.");
    [self.window center];

    NSView *content = self.window.contentView;
@@ -390,10 +410,12 @@ static NSString *TCMSFormatBytes(id value) {
    sidebar.autoresizingMask = NSViewHeightSizable | NSViewMaxXMargin;
    sidebar.wantsLayer = YES;
    sidebar.layer.backgroundColor = [NSColor colorWithCalibratedWhite:0.08 alpha:1].CGColor;
+    TCMSSetAccessibility(sidebar, @"Navigation and status", @"Choose a TCMS section and hear current status messages.");
    [content addSubview:sidebar];

    NSTextField *brand = [self label:@"TCMS" frame:NSMakeRect(18, 680, 154, 34) font:[NSFont boldSystemFontOfSize:28]];
    brand.textColor = NSColor.whiteColor;
+    TCMSSetAccessibility(brand, @"TCMS", @"Ty Clifford's Content Management System.");
    [sidebar addSubview:brand];

    NSArray *buttons = @[
@@ -410,6 +432,7 @@ static NSString *TCMSFormatBytes(id value) {
        button.frame = NSMakeRect(18, y, 154, 36);
        button.bezelStyle = NSBezelStyleTexturedRounded;
        button.autoresizingMask = NSViewMinYMargin;
+        TCMSSetAccessibility(button, [NSString stringWithFormat:@"Show %@", entry[0]], [NSString stringWithFormat:@"Switch to the %@ section.", entry[0]]);
        [sidebar addSubview:button];
        y -= 46;
    }
@@ -418,10 +441,13 @@ static NSString *TCMSFormatBytes(id value) {
    self.statusLabel.textColor = [NSColor colorWithCalibratedWhite:0.78 alpha:1];
    self.statusLabel.lineBreakMode = NSLineBreakByWordWrapping;
    self.statusLabel.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.statusLabel, @"Status", @"Latest TCMS status message.");
+    TCMSSetAccessibilityValue(self.statusLabel, @"Ready");
    [sidebar addSubview:self.statusLabel];

    self.workspace = [[NSView alloc] initWithFrame:NSMakeRect(190, 0, 990, 740)];
    self.workspace.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;
+    TCMSSetAccessibility(self.workspace, @"Posts section", @"Main TCMS editing workspace.");
    [content addSubview:self.workspace];
    [self.window makeKeyAndOrderFront:nil];
 }
@@ -504,6 +530,7 @@ static NSString *TCMSFormatBytes(id value) {
    label.bezeled = NO;
    label.drawsBackground = NO;
    label.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(label, text, nil);
    return label;
 }

@@ -512,6 +539,7 @@ static NSString *TCMSFormatBytes(id value) {
    field.placeholderString = placeholder;
    field.delegate = self;
    field.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(field, placeholder, nil);
    return field;
 }

@@ -546,6 +574,24 @@ static NSString *TCMSFormatBytes(id value) {
    self.mediaPreviewURLString = nil;
 }

+- (void)announceAccessibilityMessage:(NSString *)message {
+    if (message.length == 0) {
+        return;
+    }
+
+    NSDictionary *info = @{
+        NSAccessibilityAnnouncementKey: message,
+        NSAccessibilityPriorityKey: @(NSAccessibilityPriorityMedium)
+    };
+    NSAccessibilityPostNotificationWithUserInfo(self.window ?: NSApp, NSAccessibilityAnnouncementRequestedNotification, info);
+}
+
+- (void)configureWorkspaceAccessibilityWithTitle:(NSString *)title heading:(NSView *)heading {
+    NSString *label = [NSString stringWithFormat:@"%@ section", title.length > 0 ? title : @"TCMS"];
+    TCMSSetAccessibility(self.workspace, label, @"Main TCMS workspace.");
+    NSAccessibilityPostNotification(heading ?: self.workspace, NSAccessibilityLayoutChangedNotification);
+}
+
 - (void)showContentSection:(NSString *)section {
    self.section = section;
    [self clearWorkspace];
@@ -554,36 +600,51 @@ static NSString *TCMSFormatBytes(id value) {

    NSTextField *heading = [self label:[section capitalizedString] frame:NSMakeRect(20, 690, 180, 28) font:[NSFont boldSystemFontOfSize:24]];
    [self.workspace addSubview:heading];
-    [self addButton:@"Refresh" frame:NSMakeRect(210, 690, 78, 30) action:@selector(refreshCurrentSection)];
-    [self addButton:@"New" frame:NSMakeRect(296, 690, 58, 30) action:@selector(newContent)];
-    [self addButton:@"Draft" frame:NSMakeRect(362, 690, 70, 30) action:@selector(saveDraft)];
-    [self addButton:@"Update" frame:NSMakeRect(440, 690, 76, 30) action:@selector(updateContent)];
-    [self addButton:@"Publish" frame:NSMakeRect(524, 690, 78, 30) action:@selector(publishContent)];
-    [self addButton:@"Upload Media" frame:NSMakeRect(610, 690, 118, 30) action:@selector(uploadEditorMedia)];
-    [self addButton:@"Delete" frame:NSMakeRect(736, 690, 70, 30) action:@selector(deleteContent)];
+    [self configureWorkspaceAccessibilityWithTitle:[section capitalizedString] heading:heading];
+    NSButton *refreshButton = [self addButton:@"Refresh" frame:NSMakeRect(210, 690, 78, 30) action:@selector(refreshCurrentSection)];
+    NSButton *newButton = [self addButton:@"New" frame:NSMakeRect(296, 690, 58, 30) action:@selector(newContent)];
+    NSButton *draftButton = [self addButton:@"Draft" frame:NSMakeRect(362, 690, 70, 30) action:@selector(saveDraft)];
+    NSButton *updateButton = [self addButton:@"Update" frame:NSMakeRect(440, 690, 76, 30) action:@selector(updateContent)];
+    NSButton *publishButton = [self addButton:@"Publish" frame:NSMakeRect(524, 690, 78, 30) action:@selector(publishContent)];
+    NSButton *uploadMediaButton = [self addButton:@"Upload Media" frame:NSMakeRect(610, 690, 118, 30) action:@selector(uploadEditorMedia)];
+    NSButton *deleteButton = [self addButton:@"Delete" frame:NSMakeRect(736, 690, 70, 30) action:@selector(deleteContent)];
+    TCMSSetAccessibility(refreshButton, [NSString stringWithFormat:@"Refresh %@ list", section], nil);
+    TCMSSetAccessibility(newButton, [NSString stringWithFormat:@"Create new %@", type], nil);
+    TCMSSetAccessibility(draftButton, @"Save current content as draft", nil);
+    TCMSSetAccessibility(updateButton, @"Update current content", nil);
+    TCMSSetAccessibility(publishButton, @"Publish current content", nil);
+    TCMSSetAccessibility(uploadMediaButton, @"Upload media and insert it in the editor", nil);
+    TCMSSetAccessibility(deleteButton, @"Delete current content", @"Deletes the selected post or page after confirmation.");

    NSScrollView *listScroll = [self buildTableWithFrame:NSMakeRect(20, 56, 280, 614) columns:@[@"title", @"status"]];
    listScroll.autoresizingMask = NSViewHeightSizable | NSViewMaxXMargin;
+    TCMSSetAccessibility(listScroll, [NSString stringWithFormat:@"%@ list", [section capitalizedString]], @"Select a row to load it into the editor.");
+    TCMSSetAccessibility(self.tableView, [NSString stringWithFormat:@"%@ table", [section capitalizedString]], @"Select a row to load it into the editor.");
    self.previousPageButton = [NSButton buttonWithTitle:@"Previous" target:self action:@selector(previousContentPage)];
    self.previousPageButton.frame = NSMakeRect(20, 20, 78, 28);
    self.previousPageButton.bezelStyle = NSBezelStyleRounded;
    self.previousPageButton.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.previousPageButton, @"Previous page", [NSString stringWithFormat:@"Show the previous page of %@.", section]);
    [self.workspace addSubview:self.previousPageButton];

    self.pageInfoLabel = [self label:@"1 / 1" frame:NSMakeRect(104, 24, 66, 20) font:[NSFont systemFontOfSize:12]];
    self.pageInfoLabel.alignment = NSTextAlignmentCenter;
    self.pageInfoLabel.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.pageInfoLabel, @"Page", @"Current list page.");
+    TCMSSetAccessibilityValue(self.pageInfoLabel, @"Page 1 of 1");
    [self.workspace addSubview:self.pageInfoLabel];

    self.nextPageButton = [NSButton buttonWithTitle:@"Next" target:self action:@selector(nextContentPage)];
    self.nextPageButton.frame = NSMakeRect(176, 20, 54, 28);
    self.nextPageButton.bezelStyle = NSBezelStyleRounded;
    self.nextPageButton.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.nextPageButton, @"Next page", [NSString stringWithFormat:@"Show the next page of %@.", section]);
    [self.workspace addSubview:self.nextPageButton];

    self.perPagePopup = [[NSPopUpButton alloc] initWithFrame:NSMakeRect(236, 20, 64, 28)];
    self.perPagePopup.autoresizingMask = NSViewMaxYMargin;
    self.perPagePopup.toolTip = @"Items per page";
+    TCMSSetAccessibility(self.perPagePopup, @"Items per page", [NSString stringWithFormat:@"Choose how many %@ to show per page.", section]);
    self.perPagePopup.target = self;
    self.perPagePopup.action = @selector(contentPerPageChanged:);
    [self.perPagePopup addItemsWithTitles:@[@"10", @"25", @"50", @"100"]];
@@ -602,9 +663,11 @@ static NSString *TCMSFormatBytes(id value) {
    self.titleField.autoresizingMask = NSViewWidthSizable | NSViewMinYMargin;
    self.statusPopup = [[NSPopUpButton alloc] initWithFrame:NSMakeRect(left + width - 220, 646, 100, 28)];
    self.statusPopup.autoresizingMask = NSViewMinXMargin | NSViewMinYMargin;
+    TCMSSetAccessibility(self.statusPopup, @"Status", @"Choose draft or published.");
    [self.statusPopup addItemsWithTitles:@[@"draft", @"published"]];
    self.typePopup = [[NSPopUpButton alloc] initWithFrame:NSMakeRect(left + width - 110, 646, 90, 28)];
    self.typePopup.autoresizingMask = NSViewMinXMargin | NSViewMinYMargin;
+    TCMSSetAccessibility(self.typePopup, @"Content type", @"Choose post or page.");
    [self.typePopup addItemsWithTitles:@[@"post", @"page"]];
    [self.workspace addSubview:self.titleField];
    [self.workspace addSubview:self.statusPopup];
@@ -625,12 +688,15 @@ static NSString *TCMSFormatBytes(id value) {
    self.allowCommentsButton = [NSButton checkboxWithTitle:@"Allow comments" target:self action:@selector(markDirty)];
    self.allowCommentsButton.frame = NSMakeRect(left, 460, 180, 24);
    self.allowCommentsButton.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(self.allowCommentsButton, @"Allow comments", @"Allow readers to leave comments on this content.");
    self.spellCheckButton = [NSButton checkboxWithTitle:@"Spell check" target:self action:@selector(editorOptionChanged:)];
    self.spellCheckButton.frame = NSMakeRect(left + 190, 460, 120, 24);
    self.spellCheckButton.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(self.spellCheckButton, @"Spell check", @"Toggle continuous spell checking in the Markdown editor.");
    self.autoCorrectButton = [NSButton checkboxWithTitle:@"Auto-correct" target:self action:@selector(editorOptionChanged:)];
    self.autoCorrectButton.frame = NSMakeRect(left + 320, 460, 130, 24);
    self.autoCorrectButton.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(self.autoCorrectButton, @"Auto-correct", @"Toggle automatic corrections in the Markdown editor.");
    for (NSView *view in @[self.slugField, self.categoryField, self.tagsField, self.summaryField, self.authorField, self.coverField, self.allowCommentsButton, self.spellCheckButton, self.autoCorrectButton]) {
        [self.workspace addSubview:view];
    }
@@ -641,6 +707,7 @@ static NSString *TCMSFormatBytes(id value) {
    self.editorScroll.hasHorizontalScroller = NO;
    self.editorScroll.autohidesScrollers = YES;
    self.editorScroll.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;
+    TCMSSetAccessibility(self.editorScroll, @"Markdown editor", @"Edit the Markdown body for the current post or page.");
    self.markdownView = [[TCMSMarkdownTextView alloc] initWithFrame:self.editorScroll.contentView.bounds];
    self.markdownView.font = [NSFont fontWithName:@"Menlo" size:13] ?: [NSFont monospacedSystemFontOfSize:13 weight:NSFontWeightRegular];
    self.markdownView.allowsUndo = YES;
@@ -651,6 +718,7 @@ static NSString *TCMSFormatBytes(id value) {
    self.markdownView.textContainer.heightTracksTextView = NO;
    self.markdownView.textContainerInset = NSMakeSize(8, 8);
    self.markdownView.delegate = self;
+    TCMSSetAccessibility(self.markdownView, @"Markdown editor", @"Edit the Markdown body for the current post or page.");
    self.editorScroll.documentView = self.markdownView;
    [self.workspace addSubview:self.editorScroll];
    [self resizeEditorTextView];
@@ -669,18 +737,27 @@ static NSString *TCMSFormatBytes(id value) {
    self.section = @"media";
    [self clearWorkspace];
    self.contentListPage = 1;
-    [self.workspace addSubview:[self label:@"Media" frame:NSMakeRect(20, 690, 180, 28) font:[NSFont boldSystemFontOfSize:24]]];
-    [self addButton:@"Refresh" frame:NSMakeRect(210, 690, 78, 30) action:@selector(refreshCurrentSection)];
-    [self addButton:@"Upload" frame:NSMakeRect(296, 690, 78, 30) action:@selector(uploadMedia)];
+    NSTextField *heading = [self label:@"Media" frame:NSMakeRect(20, 690, 180, 28) font:[NSFont boldSystemFontOfSize:24]];
+    [self.workspace addSubview:heading];
+    [self configureWorkspaceAccessibilityWithTitle:@"Media" heading:heading];
+    NSButton *refreshButton = [self addButton:@"Refresh" frame:NSMakeRect(210, 690, 78, 30) action:@selector(refreshCurrentSection)];
+    NSButton *uploadButton = [self addButton:@"Upload" frame:NSMakeRect(296, 690, 78, 30) action:@selector(uploadMedia)];
    self.openMediaButton = [self addButton:@"Open" frame:NSMakeRect(382, 690, 66, 30) action:@selector(openSelectedMedia:)];
    self.openMediaButton.enabled = NO;
    self.mediaURLCopyButton = [self addButton:@"Copy URL" frame:NSMakeRect(456, 690, 88, 30) action:@selector(copySelectedMediaURL:)];
    self.mediaURLCopyButton.enabled = NO;
    self.mediaEmbedCopyButton = [self addButton:@"Copy Embed" frame:NSMakeRect(552, 690, 104, 30) action:@selector(copySelectedMediaEmbed:)];
    self.mediaEmbedCopyButton.enabled = NO;
+    TCMSSetAccessibility(refreshButton, @"Refresh media list", nil);
+    TCMSSetAccessibility(uploadButton, @"Upload media", @"Upload a file to the TCMS media library.");
+    TCMSSetAccessibility(self.openMediaButton, @"Open selected media", @"Open the selected media item in the default app.");
+    TCMSSetAccessibility(self.mediaURLCopyButton, @"Copy selected media URL", nil);
+    TCMSSetAccessibility(self.mediaEmbedCopyButton, @"Copy Markdown embed for selected media", nil);

    NSScrollView *mediaScroll = [self buildTableWithFrame:NSMakeRect(20, 56, 420, 614) columns:@[@"name", @"mime", @"size"]];
    mediaScroll.autoresizingMask = NSViewHeightSizable | NSViewMaxXMargin;
+    TCMSSetAccessibility(mediaScroll, @"Media list", @"Select a row to preview media.");
+    TCMSSetAccessibility(self.tableView, @"Media table", @"Select a row to preview media.");
    self.tableView.target = self;
    self.tableView.doubleAction = @selector(openSelectedMedia:);
    [self configureMediaContextMenu];
@@ -689,22 +766,27 @@ static NSString *TCMSFormatBytes(id value) {
    self.previousPageButton.frame = NSMakeRect(20, 20, 78, 28);
    self.previousPageButton.bezelStyle = NSBezelStyleRounded;
    self.previousPageButton.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.previousPageButton, @"Previous media page", nil);
    [self.workspace addSubview:self.previousPageButton];

    self.pageInfoLabel = [self label:@"1 / 1" frame:NSMakeRect(104, 24, 66, 20) font:[NSFont systemFontOfSize:12]];
    self.pageInfoLabel.alignment = NSTextAlignmentCenter;
    self.pageInfoLabel.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.pageInfoLabel, @"Page", @"Current media list page.");
+    TCMSSetAccessibilityValue(self.pageInfoLabel, @"Page 1 of 1");
    [self.workspace addSubview:self.pageInfoLabel];

    self.nextPageButton = [NSButton buttonWithTitle:@"Next" target:self action:@selector(nextContentPage)];
    self.nextPageButton.frame = NSMakeRect(176, 20, 54, 28);
    self.nextPageButton.bezelStyle = NSBezelStyleRounded;
    self.nextPageButton.autoresizingMask = NSViewMaxYMargin;
+    TCMSSetAccessibility(self.nextPageButton, @"Next media page", nil);
    [self.workspace addSubview:self.nextPageButton];

    self.perPagePopup = [[NSPopUpButton alloc] initWithFrame:NSMakeRect(236, 20, 64, 28)];
    self.perPagePopup.autoresizingMask = NSViewMaxYMargin;
    self.perPagePopup.toolTip = @"Items per page";
+    TCMSSetAccessibility(self.perPagePopup, @"Media items per page", nil);
    self.perPagePopup.target = self;
    self.perPagePopup.action = @selector(contentPerPageChanged:);
    [self.perPagePopup addItemsWithTitles:@[@"10", @"25", @"50", @"100"]];
@@ -723,16 +805,20 @@ static NSString *TCMSFormatBytes(id value) {
    self.mediaPreviewContainer.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;
    self.mediaPreviewContainer.wantsLayer = YES;
    self.mediaPreviewContainer.layer.backgroundColor = [NSColor colorWithCalibratedWhite:0.11 alpha:1].CGColor;
+    TCMSSetAccessibility(self.mediaPreviewContainer, @"Media preview", @"Preview for the selected media item.");
    [self.workspace addSubview:self.mediaPreviewContainer];

    self.mediaPreviewLabel = [self label:@"No media selected" frame:NSMakeRect(16, 612, previewWidth - 32, 24) font:[NSFont boldSystemFontOfSize:15]];
    self.mediaPreviewLabel.autoresizingMask = NSViewWidthSizable | NSViewMinYMargin;
    self.mediaPreviewLabel.textColor = [NSColor colorWithCalibratedWhite:0.92 alpha:1];
+    TCMSSetAccessibility(self.mediaPreviewLabel, @"Selected media", nil);
+    TCMSSetAccessibilityValue(self.mediaPreviewLabel, @"No media selected");
    [self.mediaPreviewContainer addSubview:self.mediaPreviewLabel];

    self.mediaDetailLabel = [self label:@"" frame:NSMakeRect(16, 584, previewWidth - 32, 20) font:[NSFont systemFontOfSize:12]];
    self.mediaDetailLabel.autoresizingMask = NSViewWidthSizable | NSViewMinYMargin;
    self.mediaDetailLabel.textColor = [NSColor colorWithCalibratedWhite:0.72 alpha:1];
+    TCMSSetAccessibility(self.mediaDetailLabel, @"Media details", nil);
    [self.mediaPreviewContainer addSubview:self.mediaDetailLabel];

    NSRect previewFrame = NSMakeRect(16, 16, previewWidth - 32, 552);
@@ -740,12 +826,14 @@ static NSString *TCMSFormatBytes(id value) {
    self.mediaImageView.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;
    self.mediaImageView.imageScaling = NSImageScaleProportionallyUpOrDown;
    self.mediaImageView.hidden = YES;
+    TCMSSetAccessibility(self.mediaImageView, @"Image preview", @"Preview image for the selected media item.");
    [self.mediaPreviewContainer addSubview:self.mediaImageView];

    self.mediaPlayerView = [[AVPlayerView alloc] initWithFrame:previewFrame];
    self.mediaPlayerView.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;
    self.mediaPlayerView.controlsStyle = AVPlayerViewControlsStyleDefault;
    self.mediaPlayerView.hidden = YES;
+    TCMSSetAccessibility(self.mediaPlayerView, @"Media player", @"Play the selected audio or video item.");
    [self.mediaPreviewContainer addSubview:self.mediaPlayerView];

    [self resetMediaPreview];
@@ -756,18 +844,28 @@ static NSString *TCMSFormatBytes(id value) {
 - (void)showCommentsSection {
    self.section = @"comments";
    [self clearWorkspace];
-    [self.workspace addSubview:[self label:@"Comments" frame:NSMakeRect(20, 690, 180, 28) font:[NSFont boldSystemFontOfSize:24]]];
+    NSTextField *heading = [self label:@"Comments" frame:NSMakeRect(20, 690, 180, 28) font:[NSFont boldSystemFontOfSize:24]];
+    [self.workspace addSubview:heading];
+    [self configureWorkspaceAccessibilityWithTitle:@"Comments" heading:heading];
    self.commentStatusPopup = [[NSPopUpButton alloc] initWithFrame:NSMakeRect(210, 690, 120, 30)];
    self.commentStatusPopup.autoresizingMask = NSViewMinYMargin;
    [self.commentStatusPopup addItemsWithTitles:@[@"pending", @"approved", @"spam", @"all"]];
+    TCMSSetAccessibility(self.commentStatusPopup, @"Comment status filter", @"Choose which comments to list.");
    [self.workspace addSubview:self.commentStatusPopup];
-    [self addButton:@"Refresh" frame:NSMakeRect(340, 690, 90, 30) action:@selector(refreshCurrentSection)];
-    [self addButton:@"Approve" frame:NSMakeRect(440, 690, 90, 30) action:@selector(approveComment)];
-    [self addButton:@"Pending" frame:NSMakeRect(540, 690, 90, 30) action:@selector(pendingComment)];
-    [self addButton:@"Spam" frame:NSMakeRect(640, 690, 80, 30) action:@selector(spamComment)];
-    [self addButton:@"Delete" frame:NSMakeRect(730, 690, 80, 30) action:@selector(deleteComment)];
+    NSButton *refreshButton = [self addButton:@"Refresh" frame:NSMakeRect(340, 690, 90, 30) action:@selector(refreshCurrentSection)];
+    NSButton *approveButton = [self addButton:@"Approve" frame:NSMakeRect(440, 690, 90, 30) action:@selector(approveComment)];
+    NSButton *pendingButton = [self addButton:@"Pending" frame:NSMakeRect(540, 690, 90, 30) action:@selector(pendingComment)];
+    NSButton *spamButton = [self addButton:@"Spam" frame:NSMakeRect(640, 690, 80, 30) action:@selector(spamComment)];
+    NSButton *deleteButton = [self addButton:@"Delete" frame:NSMakeRect(730, 690, 80, 30) action:@selector(deleteComment)];
+    TCMSSetAccessibility(refreshButton, @"Refresh comments", nil);
+    TCMSSetAccessibility(approveButton, @"Approve selected comment", nil);
+    TCMSSetAccessibility(pendingButton, @"Mark selected comment pending", nil);
+    TCMSSetAccessibility(spamButton, @"Mark selected comment as spam", nil);
+    TCMSSetAccessibility(deleteButton, @"Delete selected comment", @"Deletes the selected comment from the server.");
    NSScrollView *commentsScroll = [self buildTableWithFrame:NSMakeRect(20, 20, self.workspace.bounds.size.width - 40, 650) columns:@[@"author", @"status", @"slug", @"body"]];
    commentsScroll.autoresizingMask = NSViewWidthSizable | NSViewHeightSizable;
+    TCMSSetAccessibility(commentsScroll, @"Comments list", @"Select a comment row before moderating it.");
+    TCMSSetAccessibility(self.tableView, @"Comments table", @"Select a comment row before moderating it.");
    [self refreshComments];
    [self refreshWindowLayout];
 }
@@ -775,7 +873,9 @@ static NSString *TCMSFormatBytes(id value) {
 - (void)showSettingsSection {
    self.section = @"settings";
    [self clearWorkspace];
-    [self.workspace addSubview:[self label:@"Settings" frame:NSMakeRect(20, 690, 220, 28) font:[NSFont boldSystemFontOfSize:24]]];
+    NSTextField *heading = [self label:@"Settings" frame:NSMakeRect(20, 690, 220, 28) font:[NSFont boldSystemFontOfSize:24]];
+    [self.workspace addSubview:heading];
+    [self configureWorkspaceAccessibilityWithTitle:@"Settings" heading:heading];
    [self.workspace addSubview:[self label:@"TCMS URL" frame:NSMakeRect(20, 640, 140, 24) font:[NSFont systemFontOfSize:13]]];
    [self.workspace addSubview:[self label:@"Username" frame:NSMakeRect(20, 596, 140, 24) font:[NSFont systemFontOfSize:13]]];
    [self.workspace addSubview:[self label:@"Password" frame:NSMakeRect(20, 552, 140, 24) font:[NSFont systemFontOfSize:13]]];
@@ -783,22 +883,29 @@ static NSString *TCMSFormatBytes(id value) {

    self.siteField = [self field:@"https://example.com/blog" frame:NSMakeRect(170, 638, 520, 28)];
    self.siteField.autoresizingMask = NSViewWidthSizable | NSViewMinYMargin;
+    TCMSSetAccessibility(self.siteField, @"TCMS URL", @"Base URL for the TCMS site.");
    self.usernameField = [self field:@"admin" frame:NSMakeRect(170, 594, 260, 28)];
    self.usernameField.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(self.usernameField, @"Username", @"Username for the TCMS API.");
    self.passwordField = [[NSSecureTextField alloc] initWithFrame:NSMakeRect(170, 550, 260, 28)];
    self.passwordField.delegate = self;
    self.passwordField.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(self.passwordField, @"Password", @"Password for the TCMS API.");
    self.autosaveField = [self field:@"30" frame:NSMakeRect(170, 506, 120, 28)];
+    TCMSSetAccessibility(self.autosaveField, @"Autosave seconds", @"Minimum autosave interval is 10 seconds.");
    self.autosaveField.autoresizingMask = NSViewMinYMargin;
    self.remoteAutosaveButton = [NSButton checkboxWithTitle:@"Also save remotely as draft" target:nil action:nil];
    self.remoteAutosaveButton.frame = NSMakeRect(170, 464, 260, 24);
    self.remoteAutosaveButton.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(self.remoteAutosaveButton, @"Also save remotely as draft", @"When enabled, autosave sends a draft copy to the server.");
    for (NSView *view in @[self.siteField, self.usernameField, self.passwordField, self.autosaveField, self.remoteAutosaveButton]) {
        [self.workspace addSubview:view];
    }

-    [self addButton:@"Save Settings" frame:NSMakeRect(170, 414, 120, 32) action:@selector(saveSettings)];
-    [self addButton:@"Test Auth" frame:NSMakeRect(300, 414, 100, 32) action:@selector(testConnection)];
+    NSButton *saveButton = [self addButton:@"Save Settings" frame:NSMakeRect(170, 414, 120, 32) action:@selector(saveSettings)];
+    NSButton *testButton = [self addButton:@"Test Auth" frame:NSMakeRect(300, 414, 100, 32) action:@selector(testConnection)];
+    TCMSSetAccessibility(saveButton, @"Save settings", nil);
+    TCMSSetAccessibility(testButton, @"Test authentication", @"Save settings, then test the TCMS API credentials.");
    [self populateSettingsFields];
    [self wireSettingsKeyLoop];
    [self refreshWindowLayout];
@@ -809,6 +916,7 @@ static NSString *TCMSFormatBytes(id value) {
    button.frame = frame;
    button.bezelStyle = NSBezelStyleRounded;
    button.autoresizingMask = NSViewMinYMargin;
+    TCMSSetAccessibility(button, title, nil);
    [self.workspace addSubview:button];
    return button;
 }
@@ -821,6 +929,8 @@ static NSString *TCMSFormatBytes(id value) {
    self.tableView.delegate = self;
    self.tableView.dataSource = self;
    self.tableView.columnAutoresizingStyle = NSTableViewUniformColumnAutoresizingStyle;
+    TCMSSetAccessibility(scroll, @"Table", @"Use arrow keys to move through rows.");
+    TCMSSetAccessibility(self.tableView, @"Table", @"Use arrow keys to move through rows.");
    for (NSString *identifier in columns) {
        NSTableColumn *column = [[NSTableColumn alloc] initWithIdentifier:identifier];
        column.title = [identifier capitalizedString];
@@ -854,13 +964,16 @@ static NSString *TCMSFormatBytes(id value) {

    [self.tableView deselectAll:nil];
    [self.tableView reloadData];
-    self.pageInfoLabel.stringValue = total == 0 ? @"0 / 0" : [NSString stringWithFormat:@"%ld / %ld", (long)self.contentListPage, (long)totalPages];
+    NSString *pageText = total == 0 ? @"0 / 0" : [NSString stringWithFormat:@"%ld / %ld", (long)self.contentListPage, (long)totalPages];
+    self.pageInfoLabel.stringValue = pageText;
+    TCMSSetAccessibilityValue(self.pageInfoLabel, total == 0 ? @"No pages" : [NSString stringWithFormat:@"Page %ld of %ld", (long)self.contentListPage, (long)totalPages]);
    self.previousPageButton.enabled = total > 0 && self.contentListPage > 1;
    self.nextPageButton.enabled = total > 0 && self.contentListPage < totalPages;
    self.perPagePopup.enabled = total > 0;
    if ([self.section isEqualToString:@"media"]) {
        [self resetMediaPreview];
    }
+    TCMSSetAccessibilityValue(self.tableView, [self currentListStatusMessage]);
    [self refreshWindowLayout];
 }

@@ -928,6 +1041,7 @@ static NSString *TCMSFormatBytes(id value) {
    }
    NSDictionary *item = self.tableItems[row];
    field.stringValue = [tableColumn.identifier isEqualToString:@"size"] ? TCMSFormatBytes(item[@"size"]) : TCMSString(item[tableColumn.identifier]);
+    TCMSSetAccessibility(field, [NSString stringWithFormat:@"%@: %@", tableColumn.title ?: TCMSString(tableColumn.identifier), field.stringValue], nil);
    return field;
 }

@@ -1570,6 +1684,9 @@ static NSString *TCMSFormatBytes(id value) {
    self.mediaEmbedCopyButton.enabled = NO;
    self.mediaPreviewLabel.stringValue = @"No media selected";
    self.mediaDetailLabel.stringValue = @"";
+    TCMSSetAccessibilityValue(self.mediaPreviewContainer, @"No media selected");
+    TCMSSetAccessibilityValue(self.mediaPreviewLabel, @"No media selected");
+    TCMSSetAccessibilityValue(self.mediaDetailLabel, @"");
 }

 - (void)previewMediaItem:(NSDictionary *)item {
@@ -1586,8 +1703,12 @@ static NSString *TCMSFormatBytes(id value) {
    self.openMediaButton.enabled = YES;
    self.mediaURLCopyButton.enabled = YES;
    self.mediaEmbedCopyButton.enabled = YES;
-    self.mediaPreviewLabel.stringValue = TCMSString(item[@"name"]).length ? TCMSString(item[@"name"]) : url.lastPathComponent;
+    NSString *mediaName = TCMSString(item[@"name"]).length ? TCMSString(item[@"name"]) : url.lastPathComponent;
+    self.mediaPreviewLabel.stringValue = mediaName;
    self.mediaDetailLabel.stringValue = [self mediaDetailForItem:item];
+    TCMSSetAccessibilityValue(self.mediaPreviewContainer, [NSString stringWithFormat:@"%@. %@", mediaName, self.mediaDetailLabel.stringValue]);
+    TCMSSetAccessibilityValue(self.mediaPreviewLabel, mediaName);
+    TCMSSetAccessibilityValue(self.mediaDetailLabel, self.mediaDetailLabel.stringValue);
    self.mediaImageView.image = nil;
    self.mediaImageView.hidden = YES;
    [self.mediaPlayerView.player pause];
@@ -1596,6 +1717,7 @@ static NSString *TCMSFormatBytes(id value) {

    if ([mime hasPrefix:@"image/"]) {
        self.mediaImageView.hidden = NO;
+        TCMSSetAccessibility(self.mediaImageView, [NSString stringWithFormat:@"Image preview for %@", mediaName], nil);
        [self setStatus:@"Loading image preview."];
        [[[NSURLSession sharedSession] dataTaskWithURL:url completionHandler:^(NSData *data, NSURLResponse *response, NSError *error) {
            NSImage *image = data.length > 0 ? [[NSImage alloc] initWithData:data] : nil;
@@ -1619,6 +1741,7 @@ static NSString *TCMSFormatBytes(id value) {
        AVPlayer *player = [AVPlayer playerWithURL:url];
        self.mediaPlayerView.player = player;
        self.mediaPlayerView.hidden = NO;
+        TCMSSetAccessibility(self.mediaPlayerView, [mime hasPrefix:@"audio/"] ? [NSString stringWithFormat:@"Audio player for %@", mediaName] : [NSString stringWithFormat:@"Video player for %@", mediaName], nil);
        [self setStatus:[mime hasPrefix:@"audio/"] ? @"Audio ready to play." : @"Video ready to play."];
        return;
    }
@@ -1652,7 +1775,10 @@ static NSString *TCMSFormatBytes(id value) {
        }
        self.tableItems = [NSMutableArray arrayWithArray:json[@"items"] ?: @[]];
        [self.tableView reloadData];
-        [self setStatus:@"Comments refreshed."];
+        NSString *status = self.commentStatusPopup.titleOfSelectedItem ?: @"pending";
+        NSString *message = [NSString stringWithFormat:@"Showing %ld %@ comments.", (long)self.tableItems.count, status];
+        TCMSSetAccessibilityValue(self.tableView, message);
+        [self setStatus:message];
    }];
 }

@@ -1748,6 +1874,8 @@ static NSString *TCMSFormatBytes(id value) {

 - (void)setStatus:(NSString *)message {
    self.statusLabel.stringValue = message ?: @"";
+    TCMSSetAccessibilityValue(self.statusLabel, message ?: @"");
+    [self announceAccessibilityMessage:message ?: @""];
 }

@end
@@ -3,19 +3,33 @@
    var storedMode = localStorage.getItem('neon-mode') || 'dark';
    var storedAccent = localStorage.getItem('neon-accent') || 'green';
    var modeButton = document.querySelector('[data-mode-toggle]');
+    var accentButtons = document.querySelectorAll('[data-accent]');
+
+    function labelAccent(accent) {
+        return accent.charAt(0).toUpperCase() + accent.slice(1);
+    }

    function applyMode(mode) {
        root.dataset.mode = mode;
        localStorage.setItem('neon-mode', mode);
        if (modeButton) {
-            modeButton.textContent = mode === 'light' ? 'Dark' : 'Light';
-            modeButton.setAttribute('aria-label', mode === 'light' ? 'Use dark mode' : 'Use light mode');
+            modeButton.textContent = 'Light';
+            modeButton.setAttribute('aria-label', 'Light mode');
+            modeButton.setAttribute('aria-pressed', mode === 'light' ? 'true' : 'false');
+            modeButton.title = mode === 'light' ? 'Disable light mode' : 'Enable light mode';
        }
    }

    function applyAccent(accent) {
        root.dataset.accent = accent;
        localStorage.setItem('neon-accent', accent);
+        accentButtons.forEach(function (button) {
+            var selected = button.dataset.accent === accent;
+            var name = labelAccent(button.dataset.accent || 'accent');
+            button.setAttribute('aria-pressed', selected ? 'true' : 'false');
+            button.setAttribute('aria-label', selected ? name + ' accent selected' : 'Use ' + name.toLowerCase() + ' accent');
+            button.title = selected ? name + ' accent selected' : 'Use ' + name.toLowerCase() + ' accent';
+        });
    }

    applyMode(storedMode);
@@ -27,7 +41,7 @@
        });
    }

-    document.querySelectorAll('[data-accent]').forEach(function (button) {
+    accentButtons.forEach(function (button) {
        button.addEventListener('click', function () {
            applyAccent(button.dataset.accent || 'green');
        });
@@ -145,14 +159,15 @@
            lightbox.hidden = true;
            lightbox.setAttribute('role', 'dialog');
            lightbox.setAttribute('aria-modal', 'true');
-            lightbox.setAttribute('aria-label', 'Post media slideshow');
+            lightbox.setAttribute('aria-labelledby', 'tcms-lightbox-title');
+            lightbox.setAttribute('aria-describedby', 'tcms-lightbox-caption');

            lightbox.innerHTML = [
                '<button class="tcms-lightbox__backdrop" type="button" data-lightbox-close aria-label="Close media viewer"></button>',
                '<section class="tcms-lightbox__dialog" role="document">',
                '<header class="tcms-lightbox__bar">',
-                '<strong class="tcms-lightbox__title"></strong>',
-                '<span class="tcms-lightbox__count"></span>',
+                '<strong class="tcms-lightbox__title" id="tcms-lightbox-title"></strong>',
+                '<span class="tcms-lightbox__count" aria-live="polite"></span>',
                '<button class="tcms-lightbox__close" type="button" data-lightbox-close aria-label="Close">Close</button>',
                '</header>',
                '<div class="tcms-lightbox__stage">',
@@ -160,7 +175,7 @@
                '<div class="tcms-lightbox__media"></div>',
                '<button class="tcms-lightbox__nav tcms-lightbox__nav--next" type="button" data-lightbox-next aria-label="Next media">Next</button>',
                '</div>',
-                '<p class="tcms-lightbox__caption"></p>',
+                '<p class="tcms-lightbox__caption" id="tcms-lightbox-caption"></p>',
                '</section>'
            ].join('');

@@ -198,6 +213,7 @@
            mediaFrame.textContent = '';
            titleNode.textContent = entry.title;
            countNode.textContent = (currentIndex + 1) + ' of ' + entries.length;
+            countNode.setAttribute('aria-label', 'Media ' + (currentIndex + 1) + ' of ' + entries.length);
            captionNode.textContent = entry.title;

            if (entry.type === 'image') {
@@ -219,6 +235,7 @@
                video.controls = true;
                video.playsInline = true;
                video.preload = 'metadata';
+                video.setAttribute('aria-label', entry.title);
                if (entry.poster) {
                    video.poster = entry.poster;
                }
@@ -253,11 +270,47 @@
            lightbox.hidden = true;
            mediaFrame.textContent = '';
            document.body.classList.remove('tcms-lightbox-open');
-            if (lastFocus && typeof lastFocus.focus === 'function') {
+            if (lastFocus && document.contains(lastFocus) && typeof lastFocus.focus === 'function') {
                lastFocus.focus();
            }
        }

+        function trapLightboxFocus(event) {
+            var focusable;
+            var first;
+            var last;
+
+            if (!lightbox || lightbox.hidden || event.key !== 'Tab') {
+                return;
+            }
+
+            focusable = Array.prototype.slice.call(lightbox.querySelectorAll([
+                'button:not([disabled])',
+                'a[href]',
+                'iframe',
+                'video[controls]',
+                '[tabindex]:not([tabindex="-1"])'
+            ].join(','))).filter(function (element) {
+                return !element.hidden && element.offsetParent !== null;
+            });
+
+            if (!focusable.length) {
+                event.preventDefault();
+                closeButton.focus();
+                return;
+            }
+
+            first = focusable[0];
+            last = focusable[focusable.length - 1];
+            if (event.shiftKey && document.activeElement === first) {
+                event.preventDefault();
+                last.focus();
+            } else if (!event.shiftKey && document.activeElement === last) {
+                event.preventDefault();
+                first.focus();
+            }
+        }
+
        function openFromEvent(event, index) {
            event.preventDefault();
            event.stopPropagation();
@@ -277,8 +330,9 @@
                }
                if (tag === 'img') {
                    trigger.setAttribute('role', 'button');
-                    trigger.setAttribute('aria-label', 'Open image viewer');
+                    trigger.setAttribute('aria-label', 'Open image viewer for ' + entry.title);
                }
+                trigger.setAttribute('aria-haspopup', 'dialog');
                trigger.addEventListener('click', function (event) {
                    openFromEvent(event, index);
                });
@@ -294,7 +348,8 @@
            button.className = 'tcms-lightbox-trigger';
            button.type = 'button';
            button.textContent = 'View';
-            button.setAttribute('aria-label', 'Open media viewer');
+            button.setAttribute('aria-haspopup', 'dialog');
+            button.setAttribute('aria-label', 'Open media viewer for ' + entry.title);
            button.addEventListener('click', function (event) {
                openFromEvent(event, index);
            });
@@ -319,6 +374,7 @@
            } else if (event.key === 'ArrowLeft') {
                showLightboxItem(currentIndex - 1);
            }
+            trapLightboxFocus(event);
        });
    }

@@ -39,6 +39,15 @@
    box-sizing: border-box;
 }

+.sr-only {
+    position: absolute;
+    width: 1px;
+    height: 1px;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+}
+
 html {
    min-height: 100%;
 }
@@ -67,6 +76,15 @@ a:hover {
    color: var(--accent);
 }

+a:focus-visible,
+button:focus-visible,
+input:focus-visible,
+textarea:focus-visible,
+[tabindex="-1"]:focus-visible {
+    outline: 3px solid color-mix(in srgb, var(--accent) 72%, white);
+    outline-offset: 3px;
+}
+
 button,
 input,
 textarea {
@@ -94,6 +112,26 @@ button:hover {
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 18%, transparent);
 }

+.skip-link {
+    position: fixed;
+    top: 0.75rem;
+    left: 0.75rem;
+    z-index: 2000;
+    transform: translateY(-160%);
+    border: 1px solid color-mix(in srgb, var(--accent) 72%, white);
+    border-radius: var(--radius);
+    padding: 0.55rem 0.75rem;
+    color: #06100b;
+    background: linear-gradient(135deg, var(--accent), var(--accent-2));
+    font-weight: 800;
+    text-decoration: none;
+    box-shadow: var(--shadow);
+}
+
+.skip-link:focus {
+    transform: translateY(0);
+}
+
 input,
 textarea {
    width: 100%;
@@ -221,6 +259,14 @@ textarea {
 .swatch--purple { background: #a084ff; }
 .swatch--orange { background: #ff9f43; }

+.mode-toggle[aria-pressed="true"],
+.swatch[aria-pressed="true"] {
+    border-color: color-mix(in srgb, var(--accent) 80%, white);
+    box-shadow:
+        0 0 0 3px color-mix(in srgb, var(--accent) 24%, transparent),
+        0 0 18px color-mix(in srgb, var(--accent) 34%, transparent);
+}
+
 .site-shell {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 280px;
@@ -11,13 +11,13 @@ $description = $item['summary'] ?? $site['description'] ?? '';
 $postCard = static function (array $entry): void { ?>
    <article class="post-card">
        <div class="post-card__meta">
-            <a href="<?= View::url('category/' . ContentRepository::slugify((string) $entry['category'])) ?>"><?= View::e($entry['category']) ?></a>
-            <span><?= View::date((string) $entry['date']) ?></span>
+            <a href="<?= View::url('category/' . ContentRepository::slugify((string) $entry['category'])) ?>" aria-label="Category: <?= View::e($entry['category']) ?>"><?= View::e($entry['category']) ?></a>
+            <time datetime="<?= View::e($entry['date']) ?>"><?= View::date((string) $entry['date']) ?></time>
        </div>
        <h2><a href="<?= View::itemUrl($entry) ?>"><?= View::e($entry['title']) ?></a></h2>
        <p><?= View::e($entry['summary']) ?></p>
        <?php if (!empty($entry['tags'])): ?>
-            <div class="tag-row">
+            <div class="tag-row" aria-label="Tags">
                <?php foreach ($entry['tags'] as $tag): ?>
                    <a href="<?= View::url('tag/' . ContentRepository::slugify((string) $tag)) ?>"><?= View::e($tag) ?></a>
                <?php endforeach; ?>
@@ -35,9 +35,9 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
            <?php endif; ?>
            <?php foreach (($pagination['numbers'] ?? []) as $number): ?>
                <?php if ((int) $number === (int) $pagination['page']): ?>
-                    <span class="pager pager--current" aria-current="page"><?= (int) $number ?></span>
+                    <span class="pager pager--current" aria-current="page" aria-label="Page <?= (int) $number ?>"><?= (int) $number ?></span>
                <?php else: ?>
-                    <a class="pager pager--number" href="<?= $url((int) $number) ?>"><?= (int) $number ?></a>
+                    <a class="pager pager--number" href="<?= $url((int) $number) ?>" aria-label="Go to page <?= (int) $number ?>"><?= (int) $number ?></a>
                <?php endif; ?>
            <?php endforeach; ?>
            <?php if ($pagination['has_next']): ?>
@@ -61,9 +61,10 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
    <script defer src="<?= View::asset('app.js') ?>"></script>
 </head>
 <body>
+    <a class="skip-link" href="#content">Skip to content</a>
    <header class="site-header">
        <a class="brand" href="<?= View::url('') ?>">
-            <span class="brand__mark"></span>
+            <span class="brand__mark" aria-hidden="true"></span>
            <span>
                <strong><?= View::e($site['title'] ?? "Ty Clifford's Content Management System") ?></strong>
                <small><?= View::e($site['tagline'] ?? '') ?></small>
@@ -71,40 +72,42 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
        </a>

        <nav class="main-nav" aria-label="Primary">
-            <a href="<?= View::url('') ?>">Home</a>
+            <a href="<?= View::url('') ?>"<?php if (($routeType ?? '') === 'home'): ?> aria-current="page"<?php endif; ?>>Home</a>
            <?php foreach ($navPages as $pageItem): ?>
-                <a href="<?= View::itemUrl($pageItem) ?>"><?= View::e($pageItem['title']) ?></a>
+                <a href="<?= View::itemUrl($pageItem) ?>"<?php if (($slug ?? '') === ($pageItem['slug'] ?? null)): ?> aria-current="page"<?php endif; ?>><?= View::e($pageItem['title']) ?></a>
            <?php endforeach; ?>
            <a href="<?= View::url('feed.xml') ?>">RSS</a>
        </nav>

-        <form class="search-form" action="<?= View::url('search') ?>" method="get">
-            <input type="search" name="q" value="<?= View::e($search_query ?? '') ?>" placeholder="Search" aria-label="Search">
+        <form class="search-form" action="<?= View::url('search') ?>" method="get" role="search" aria-label="Site search">
+            <label class="sr-only" for="site-search">Search posts and pages</label>
+            <input id="site-search" type="search" name="q" value="<?= View::e($search_query ?? '') ?>" placeholder="Search" autocomplete="off">
            <button type="submit" aria-label="Search">Go</button>
        </form>

-        <div class="theme-tools" aria-label="Theme controls">
-            <button class="mode-toggle" type="button" data-mode-toggle aria-label="Toggle light mode">Light</button>
+        <div class="theme-tools" role="group" aria-label="Theme controls">
+            <button class="mode-toggle" type="button" data-mode-toggle aria-pressed="false">Light</button>
            <?php foreach (['green', 'blue', 'red', 'pink', 'purple', 'orange'] as $accent): ?>
-                <button class="swatch swatch--<?= $accent ?>" type="button" data-accent="<?= $accent ?>" aria-label="<?= ucfirst($accent) ?> accent"></button>
+                <button class="swatch swatch--<?= $accent ?>" type="button" data-accent="<?= $accent ?>" aria-pressed="false" aria-label="Use <?= $accent ?> accent"></button>
            <?php endforeach; ?>
        </div>
    </header>

-    <main class="site-shell">
+    <main class="site-shell" id="content" tabindex="-1">
        <section class="content-lane">
            <?php if ($flash): ?>
-                <div class="notice notice--<?= View::e($flash['type']) ?>"><?= View::e($flash['message']) ?></div>
+                <div class="notice notice--<?= View::e($flash['type']) ?>" role="<?= ($flash['type'] ?? '') === 'error' ? 'alert' : 'status' ?>" aria-live="<?= ($flash['type'] ?? '') === 'error' ? 'assertive' : 'polite' ?>"><?= View::e($flash['message']) ?></div>
            <?php endif; ?>

            <?php if ($template === 'listing'): ?>
                <header class="page-heading">
                    <p><?= View::e($site['description'] ?? '') ?></p>
-                    <h1><?= View::e($heading ?? $title ?? '') ?></h1>
+                    <h1 id="page-title"><?= View::e($heading ?? $title ?? '') ?></h1>
                </header>
                <?php if (($search_query ?? null) !== null): ?>
-                    <form class="wide-search" action="<?= View::url('search') ?>" method="get">
-                        <input type="search" name="q" value="<?= View::e($search_query) ?>" placeholder="Search posts and pages" aria-label="Search posts and pages">
+                    <form class="wide-search" action="<?= View::url('search') ?>" method="get" role="search" aria-label="Search archive">
+                        <label class="sr-only" for="archive-search">Search posts and pages</label>
+                        <input id="archive-search" type="search" name="q" value="<?= View::e($search_query) ?>" placeholder="Search posts and pages" autocomplete="off">
                        <button type="submit">Search</button>
                    </form>
                <?php endif; ?>
@@ -114,7 +117,7 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
                    <?php endforeach; ?>
                </div>
                <?php if (empty($items)): ?>
-                    <p class="empty-state"><?= View::e($empty_message ?? 'No posts found.') ?></p>
+                    <p class="empty-state" role="status"><?= View::e($empty_message ?? 'No posts found.') ?></p>
                <?php endif; ?>
                <?php $renderPagination($pagination, $pagination_url); ?>
            <?php elseif ($template === 'single'): ?>
@@ -122,12 +125,12 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
                    <header class="article__header">
                        <?php if ($item['type'] === 'post'): ?>
                            <div class="post-card__meta">
-                                <a href="<?= View::url('category/' . ContentRepository::slugify((string) $item['category'])) ?>"><?= View::e($item['category']) ?></a>
-                                <span><?= View::date((string) $item['date']) ?></span>
+                                <a href="<?= View::url('category/' . ContentRepository::slugify((string) $item['category'])) ?>" aria-label="Category: <?= View::e($item['category']) ?>"><?= View::e($item['category']) ?></a>
+                                <time datetime="<?= View::e($item['date']) ?>"><?= View::date((string) $item['date']) ?></time>
                                <span><?= View::e($item['author']) ?></span>
                            </div>
                        <?php endif; ?>
-                        <h1><?= View::e($item['title']) ?></h1>
+                        <h1 id="page-title"><?= View::e($item['title']) ?></h1>
                        <?php if (!empty($item['summary'])): ?>
                            <p><?= View::e($item['summary']) ?></p>
                        <?php endif; ?>
@@ -136,7 +139,7 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
                        <?= $item['html'] ?>
                    </div>
                    <?php if (!empty($item['tags'])): ?>
-                        <footer class="tag-row article-tags">
+                        <footer class="tag-row article-tags" aria-label="Tags">
                            <?php foreach ($item['tags'] as $tag): ?>
                                <a href="<?= View::url('tag/' . ContentRepository::slugify((string) $tag)) ?>"><?= View::e($tag) ?></a>
                            <?php endforeach; ?>
@@ -148,7 +151,7 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
                    <section class="comments" id="comments">
                        <h2>Comments</h2>
                        <?php if (empty($approved_comments)): ?>
-                            <p class="empty-state">No comments yet.</p>
+                            <p class="empty-state" role="status">No comments yet.</p>
                        <?php endif; ?>
                        <?php foreach ($approved_comments as $comment): ?>
                            <article class="comment">
@@ -162,15 +165,15 @@ $renderPagination = static function (array $pagination, callable $url): void { ?

                        <form class="comment-form" action="<?= View::url('comment/' . $item['slug']) ?>" method="post">
                            <div class="form-grid">
-                                <label>Name <input name="author" required maxlength="120"></label>
-                                <label>Email <input type="email" name="email" required maxlength="180"></label>
+                                <label>Name <input name="author" required maxlength="120" autocomplete="name"></label>
+                                <label>Email <input type="email" name="email" required maxlength="180" autocomplete="email"></label>
                            </div>
-                            <label>Website <input type="url" name="site_url" maxlength="220"></label>
-                            <label class="honey-field">Leave this empty <input name="<?= View::e($config->get('comments.honeypot_field', 'website_url')) ?>" tabindex="-1" autocomplete="off"></label>
+                            <label>Website <input type="url" name="site_url" maxlength="220" autocomplete="url"></label>
+                            <label class="honey-field" aria-hidden="true">Leave this empty <input name="<?= View::e($config->get('comments.honeypot_field', 'website_url')) ?>" tabindex="-1" autocomplete="off"></label>
                            <label>Comment <textarea name="body" required rows="6" maxlength="5000"></textarea></label>
                            <?php if ($config->get('comments.captcha', true)): ?>
                                <input type="hidden" name="captcha_token" value="<?= View::e($captcha['token']) ?>">
-                                <label><?= View::e($captcha['question']) ?> <input name="captcha_answer" required inputmode="numeric"></label>
+                                <label>Captcha: <?= View::e($captcha['question']) ?> <input name="captcha_answer" required inputmode="numeric" autocomplete="off"></label>
                            <?php endif; ?>
                            <button type="submit">Post Comment</button>
                        </form>
@@ -178,7 +181,7 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
                <?php endif; ?>
            <?php else: ?>
                <section class="error-view">
-                    <h1><?= View::e($title ?? 'Error') ?></h1>
+                    <h1 id="page-title"><?= View::e($title ?? 'Error') ?></h1>
                    <p><?= View::e($message ?? 'Something went wrong.') ?></p>
                </section>
            <?php endif; ?>
@@ -196,7 +199,7 @@ $renderPagination = static function (array $pagination, callable $url): void { ?
                                $socialUrl = View::url(ltrim($socialUrl, '/'));
                            }
                            ?>
-                            <a href="<?= View::e($socialUrl) ?>" rel="me noopener" target="_blank"><?= View::e($entry['label'] ?? $network) ?></a>
+                            <a href="<?= View::e($socialUrl) ?>" rel="me noopener" target="_blank"><?= View::e($entry['label'] ?? $network) ?><span class="sr-only"> opens in a new tab</span></a>
                        <?php endforeach; ?>
                    </div>
                </section>