| Product Name | 24/7 Office Hours v1.7.0 |
| Report Date | April 2026 |
| Product Description | Web-based AI chatbot platform for education. Provides instructor dashboards, student chat interfaces, knowledge base management, practice tests, anonymous chatbots, and course management. |
| Contact | bkihei@kennesaw.edu |
| Notes | This report covers the primary web application (instructor and student views), authentication pages, anonymous chat interface, and the public-facing website. Third-party embedded content (help bot iframe) is noted but outside direct control. |
| Evaluation Methods | Manual source code review of all HTML templates, CSS stylesheets, and JavaScript files. Static analysis of ARIA attributes, semantic structure, color contrast ratios, keyboard interaction patterns, and focus management. Review of responsive breakpoints and media query support. |
VPAT Version: 2.4 | Applicable Standards: WCAG 2.1 Level A & AA, Revised Section 508
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| 1.1.1 Non-text Content | Supports | All <img> elements have descriptive alt attributes. Decorative emoji icons use aria-hidden="true". SVG icons in buttons have accessible names via aria-label. Canvas-based engagement charts include aria-label with textual summaries. |
| 1.2.1 Audio-only and Video-only (Prerecorded) | Not Applicable | The application does not include prerecorded audio-only or video-only content. |
| 1.2.2 Captions (Prerecorded) | Not Applicable | The application does not include prerecorded multimedia content with audio. |
| 1.2.3 Audio Description or Media Alternative (Prerecorded) | Not Applicable | No prerecorded video content is present in the application. |
| 1.3.1 Info and Relationships | Supports | Semantic HTML landmarks are used throughout: <main>, <nav>, <aside>, <header>, <footer>. Heading hierarchy follows logical order. Data tables use <th scope="col">. Form inputs are associated with <label> elements. ARIA roles include role="dialog", role="log", role="alert", role="search", role="progressbar", and role="radiogroup". |
| 1.3.2 Meaningful Sequence | Supports | DOM order matches visual presentation order. CSS grid and flexbox layouts maintain logical reading sequence. Chat messages render in chronological order with role="log". |
| 1.3.3 Sensory Characteristics | Supports | Instructions and navigation do not rely solely on shape, size, visual location, or sound. Interactive elements are identified by text labels. |
| 1.4.1 Use of Color | Supports | Error flash messages use red color plus a distinct border and text description. Published/unpublished status uses both icons and color. Navigation links use text-decoration: underline to provide a non-color visual indicator. |
| 1.4.2 Audio Control | Not Applicable | The application does not auto-play audio content. |
| 2.1.1 Keyboard | Supports | All interactive elements are reachable via Tab. The chat interface provides comprehensive keyboard shortcuts: / or Ctrl+K for search, Arrow keys for message navigation, F6 to cycle between regions, Escape to dismiss overlays. |
| 2.1.2 No Keyboard Trap | Supports | Focus trapping is implemented correctly for modals using trapFocusInModal() and releaseFocusTrap() utilities. All modal dialogs release focus and return it to the trigger element on close. |
| 2.1.4 Character Key Shortcuts | Supports | Single-character shortcuts in the chat keyboard navigation manager are only active when focus is outside text input fields. |
| 2.2.1 Timing Adjustable | Supports | The application does not impose time limits on user interactions. Chat sessions persist. |
| 2.2.2 Pause, Stop, Hide | Supports | Animations respect prefers-reduced-motion: reduce. A "Stop generating" button is provided during AI response streaming. |
| 2.3.1 Three Flashes or Below Threshold | Supports | No content flashes more than three times per second. |
| 2.4.1 Bypass Blocks | Supports | A "Skip to main content" link is the first focusable element on every page. The chat interface adds additional skip links for messages, input, and search. |
| 2.4.2 Page Titled | Supports | All pages have descriptive <title> elements. Titles are dynamic where appropriate. |
| 2.4.3 Focus Order | Supports | Tab order follows the logical DOM sequence. No tabindex values greater than 0 are used. |
| 2.4.4 Link Purpose (In Context) | Supports | Links have descriptive text. Action buttons include aria-label attributes. External links include rel="noopener noreferrer". |
| 2.5.1 Pointer Gestures | Supports | The application does not require multipoint or path-based gestures. |
| 2.5.2 Pointer Cancellation | Supports | Click actions use standard browser event handling which fire on the up-event. |
| 2.5.3 Label in Name | Supports | Visible text labels match accessible names. Icon-only buttons use aria-label. |
| 2.5.4 Motion Actuation | Not Applicable | The application does not use device motion for any functionality. |
| 3.1.1 Language of Page | Supports | All HTML documents include <html lang="en"> on the root element. |
| 3.2.1 On Focus | Supports | Focusing any element does not trigger a context change. |
| 3.2.2 On Input | Supports | Changing form controls does not cause automatic context changes. |
| 3.3.1 Error Identification | Supports | Error messages are displayed via flash messages with role="alert" and aria-live="assertive". |
| 3.3.2 Labels or Instructions | Supports | All form fields have visible labels. Required fields use the HTML5 required attribute. |
| 4.1.2 Name, Role, Value | Supports | Custom interactive components use appropriate ARIA attributes for modals, expandable sections, chat areas, progress bars, star ratings, and search regions. |
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| 1.2.4 Captions (Live) | Not Applicable | The application does not include live audio or multimedia content. |
| 1.2.5 Audio Description (Prerecorded) | Not Applicable | No prerecorded video content exists in the application. |
| 1.3.4 Orientation | Supports | No CSS or JavaScript locks the viewport to a specific orientation. Responsive breakpoints adjust layout for narrow viewports. |
| 1.3.5 Identify Input Purpose | Supports | Login and signup forms use autocomplete attributes for email and password fields. |
| 1.4.3 Contrast (Minimum) | Supports | Primary text achieves approximately 16.5:1 contrast ratio. All text elements meet or exceed AA minimum ratios. Dark mode maintains strong contrast throughout. |
| 1.4.4 Resize Text | Supports | The application uses rem and em units. Content remains functional at 200% browser zoom. |
| 1.4.5 Images of Text | Supports | No images of text are used. The logo is an SVG file. All text content is rendered as actual text. |
| 1.4.10 Reflow | Supports | Content reflows to a single column at 320px width equivalent. No horizontal scrolling is required for primary content. |
| 1.4.11 Non-text Contrast | Supports | UI component boundaries meet the 3:1 minimum contrast ratio. Focus indicators use high-contrast outlines with box-shadow. |
| 1.4.12 Text Spacing | Supports | All line-height values use relative units. No !important rules block user overrides. |
| 1.4.13 Content on Hover or Focus | Supports | Dropdown menus appear on click (not hover-only) and can be dismissed. Status information is conveyed via aria-label attributes. |
| 2.4.7 Focus Visible | Supports | All focusable elements have visible :focus-visible styles. Dark mode provides adapted focus styles. High contrast mode enhances focus indicators further. |
| 2.5.8 Target Size (Minimum) | Supports | All interactive elements meet the 24x24px minimum target size. Send buttons are 48x48px. |
| 3.3.4 Error Prevention (Legal, Financial, Data) | Supports | Destructive actions require explicit confirmation via dialogs. No financial transactions occur in the application. |
| 4.1.3 Status Messages | Supports | Status messages use ARIA live regions. Flash messages use role="alert". Chat messages use role="log" with aria-live="polite". |
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| 302.1 Without Vision | Supports | Semantic HTML landmarks, heading hierarchy, ARIA roles, and live regions support screen reader navigation. All images have alt text. Dynamic content changes are announced via aria-live regions. |
| 302.2 With Limited Vision | Supports | Text can be resized to 200%. High contrast mode is supported. Dark mode provides an alternative color scheme. Content reflows at narrow widths. |
| 302.3 Without Perception of Color | Supports | Information is not conveyed by color alone. Error messages include text descriptions and borders. Navigation links use underlines as non-color visual indicators. |
| 302.4 Without Hearing | Supports | The application is primarily text-based. No audio content is used for conveying information. |
| 302.5 With Limited Hearing | Not Applicable | The application does not include audio content. |
| 302.6 Without Speech | Not Applicable | The application does not require speech input. |
| 302.7 With Limited Manipulation | Supports | Full keyboard accessibility is provided. No drag-and-drop interactions are required. Keyboard shortcuts enable efficient navigation. |
| 302.8 With Limited Reach and Strength | Not Applicable | This is a web application; physical reach and strength are not factors. |
| 302.9 With Limited Language, Cognitive, and Learning Abilities | Supports | Navigation is consistent across pages. Labels and instructions are clear. Error messages describe what went wrong. The interface uses familiar UI patterns. |
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| All Chapter 4 Criteria (402-415) | Not Applicable | This product is a web application and does not include hardware components. |
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| All Chapter 5 Criteria (501-504) | Not Applicable | This product is a web application accessed through standard web browsers. It is not native platform software. |
| Criteria | Conformance Level | Remarks and Explanations |
|---|---|---|
| 602.2 Accessibility and Compatibility Features | Supports | An Accessibility Statement page describes the accessibility features including skip navigation, keyboard navigation, screen reader support, reduced motion, high contrast, text resizing, and dark mode. |
| 602.3 Electronic Support Documentation | Supports | In-app documentation pages are accessible via standard web browsers. The help bot widget provides an accessible iframe-based assistant. |
| 602.4 Alternate Formats for Non-Electronic Support Documentation | Not Applicable | All documentation is electronic and web-based. |
| 603.2 Information on Accessibility and Compatibility Features | Supports | The Accessibility Statement page provides comprehensive information about available accessibility features and keyboard shortcuts. |
| 603.3 Accommodation of Communication Needs | Supports | The feedback form provides a text-based method for users to report accessibility barriers. |
All previously "Partially Supports" items have been remediated:
| Criterion | Previous | Current | Fix Applied |
|---|---|---|---|
| 1.4.1 Use of Color | Partially Supports | Supports | Added text-decoration: underline to top-right navigation links |
| 1.4.12 Text Spacing | Partially Supports | Supports | Converted all 19 fixed pixel line-height values to relative units across 7 files |
| 1.4.13 Content on Hover/Focus | Partially Supports | Supports | Added aria-label attributes to publish status badges |
| 2.5.8 Target Size | Partially Supports | Supports | Added min-width: 24px; min-height: 24px to icon buttons |
| 302.3 Without Perception of Color | Partially Supports | Supports | Same as 1.4.1 fix above |
KeyboardNavigationManager classprefers-reduced-motion and prefers-contrast media query supportprefers-reduced-motion, and prefers-contrast media queries added.role="dialog", aria-modal="true", aria-labelledby, and focus trap added.prefers-reduced-motion media query added.min-height to allow growth at high zoom levels.title attribute is correctly set.This report covers the accessibility conformance of the product as evaluated on the report date. Conformance may change as the product is updated. This document is informational and does not constitute a legal guarantee.