Create Issue templates for teams to be able to do an accessibility audit

[ExperimentsInHonesty]

Overview

We need to have templates for teams that will be doing accessabiity audits on their websites, so that all teams can be able to create issues easily and uniformly.

Action Items

• Identify prior templates created by TDM Calculator (resource 1.01)
  • find each template draft created by TDM calculator
  • copy each to a comment on this issue
  • revise
• identify missing templates
• create missing as drafts in comments on this issue

Resources/Instructions

• 1.01 Epic: WAVE Accessibility Assessment tdm-calculator#2410

Templates needed

• Epic: Find errors (review this Epic: WAVE Accessibility Assessment tdm-calculator#2410)
  • Individual issues for checking for errors on a specific page (Create Issue templates for teams to be able to do an accessibility audit #32 (comment))

[ExperimentsInHonesty]

Template Dev: WAVE Page Audit: [page-name]

• comes from here: Epic: WAVE Accessibility Assessment tdm-calculator#2410 (comment)
• status: hidden

Issue Template for WAVE Audits

Title

Dev: WAVE Page Audit: [page-name]

Labels

• deck: staging not for stakeholder
• feature: Accessibility
• level: easy
• role: all
• priority: MUST HAVE
• size: 1pt

Projects

P: TDM: project board

Relationships

Parent issue: #2410

Milestone

10 - Launch

---

Overview

We need to run the WAVE evaluation browser extension on [page-name] to audit the page for WCAG2.2 accessibility compliance.

Details

We will need to audit all user interactions on the page so that all possible states and user flows are compliant. Although no code changes are required to complete the audit, it is very important to complete all the steps in the action items and, at the conclusion, apply the correct label and set the correct status.

• Page URL: [insert-page-url-here]
  • Requires sign in: [true/false]
    • User Profile Required: [None/User/Admin/Security]
  • Can access page directly from URL: [true/false]

Action Items

• Review wiki page: Accessibility, How to run the WAVE browser extension (Resource 1.01.02)
• Install the WAVE browser extension
  • (suggested) pin to your browser's toolbar for quick access
• Open TDM WAVE Accessibility Audit Spreadsheet, 1. Page Log (Resource 1.02.01)
  • Choose the row that has your issue number and populate the following fields...
    • Populate Auditor cell with your GitHub handle
    • Populate Begin Date with today's date (YYYY-MM-DD)
  • Log in as the user indicated under Details and navigate to the page you will audit
    • Run the WAVE extension with no elements focused, or clicked
      • In TDM WAVE Accessibility Audit Spreadsheet, 2. Audit Log (Resource 1.02.02), create a row for every Error, Contrast Error, and Alert on the Details pane
        • populate Auditor with your GitHub handle
        • populate Page with your selected page from 1. Page Log
        • populate Error Title with the dropdown that matches the subtitle on the Details pane (see Resource 2.01.02)
        • double check that the Category field now matches the title on the Details pane (see Resource 2.01.01). If there's not a match, leave a comment with the actual title
        • populate the DOM snippet by pasting in the highlighted HTML snippet for the Code panel
        • leave Steps to Reproduce empty

• Form-Elements
  • For all form elements (e.g. text input, password fields, checkboxes), attempt to trigger validation error messages (e.g. missing input, password complexity, incorrect username or password)
    • In 2. Audit Log, create and populate row for every Error, Contrast Error, and Alert on the Details pane
      • populate Auditor with your GitHub handle
      • populate Page with your selected page from 1. Page Log
      • populate Error Title with the dropdown that matches the subtitle on the Details pane (see Resource 2.01.02)
      • double check that the Category field now matches the title on the Details pane (see Resource 2.01.01). If there's not a match, leave a comment with the actual title
      • populate the DOM snippet by pasting in the highlighted HTML snippet for the Code panel
      • in a new comment in this issue, write out all steps required to trigger the validation message
        • populate Steps to Reproduce with the link to this comment

• Table-Controls
  • For all table controls (e.g. dropdown menus, radio buttons, checkboxes, filters) click on the table control to trigger any popups, menu dropdowns, selection styles, etc.
    • In 2. Audit Log, create and populate row for every Error, Contrast Error, and Alert on the Details pane
      • populate Auditor with your GitHub handle
      • populate Page with your selected page from 1. Page Log
      • populate Error Title with the dropdown that matches the subtitle on the Details pane (see Resource 2.01.02)
      • double check that the Category field now matches the title on the Details pane (see Resource 2.01.01). If there's not a match, leave a comment with the actual title
      • populate the DOM snippet by pasting in the highlighted HTML snippet for the Code panel
      • in a new comment in this issue, write out all steps required to trigger the table control elements
        • populate Steps to Reproduce with the link to this comment

• Interactive-Elements
  • For all other interactive elements (e.g. search-boxes, custom input-fields, tooltips, info-buttons) attempt to interact with them so they reveal any informational text, popups, or validation errors
    • In 2. Audit Log, create and populate row for every Error, Contrast Error, and Alert on the Details pane
      • populate Auditor with your GitHub handle
      • populate Page with your selected page from 1. Page Log
      • populate Error Title with the dropdown that matches the subtitle on the Details pane (see Resource 2.01.02)
      • double check that the Category field now matches the title on the Details pane (see Resource 2.01.01). If there's not a match, leave a comment with the actual title
      • populate the DOM snippet by pasting in the highlighted HTML snippet for the Code panel
      • in a new comment in this issue, write out all steps required to trigger the table control elements
        • populate Steps to Reproduce with the link to this comment

Resources/Instructions

• 1.01 TDM Wiki Pages
  • 1.01.01 Accessibility Audits
    • 1.01.02 How to run the WAVE browser extension
• 1.02 TDM WAVE Accessibility Audit Spreadsheet
  • 1.02.01 1. Page Log
  • 1.02.02 2. Audit Log
  • 1.02.03 3. Solved Index
  • 1.02.04 4. Unsolved Index
  • 1.02.05 5. WAVE Error Index

Audit Instructions

2.01 WAVE Details pane (title and subtitle)

2.01.01 Title

2.01.02 Subtitle

2.02 Screenshots of WAVE tool with Register Page, No Interaction

Register Page, No Interaction

• Page URL: https://tdm-dev.azurewebsites.net/register
• Steps to Reproduce: n/a
• Error: Missing form label

2.02.01 Screenshot (w/o WAVE Annotations)

2.02.02 Screenshot (w/ WAVE Annotations)

2.02.03 Screenshot (click on first Missing form label)

2.02.04 Screenshot (open Code panel, click on first Missing form label)

2.02.5 HTML DOM Snippet from firstMissing form label

<input name="firstName" type="text" placeholder="First Name" class="form-control " value="">

[ExperimentsInHonesty]

Template: Epic

Include this

Linking tickets to Epic

• add a link to each page issue to this Epic issue in the sub issues section at the bottom of the top

You can also add issues to the sub issues in the epic right from the issue itself in the Relationship section on the left pannel

[ExperimentsInHonesty]

• Add this to the final individual project page issue template above, when it is done.

Project Page Details

• Project Page name: [INSERT PAGE NAME or "ALL"]

• Project Staging URL: [INSERT URL or "N/A"]

• Requires sign in: [TRUE OR FALSE]

  • Required User Role: [INSERT ONE OF: Visitor, Logged in user, Admin, Security Admin]
  • Can access page directly from URL: [TRUE OR FALSE]
  • Accepts URL parameters: [TRUE OR FALSE]

• update the resources sections to link to the new mkdocs wiki

[ExperimentsInHonesty]

left off reviewing epic at hackforla/tdm-calculator#2410 (comment)

[ExperimentsInHonesty]

Issue Template for Epic to apply solution

What does this template do?

This issue template creates an epic issue and will direct the person working on the epic issue in how to create child issues (using a template that is customized during the epic creation). The scope of work of the epic will fix a specific Alert/Aria/Contrast Error/Error found on your website.

When should this template be used?

• Only use this template if there is a solution in the index.
• If this is not the correct template, see WIKI and Issue templates for a list of other templates available.

Template

Labels

Add the following labels and any missing labels that apply

feature: Accessibility

p-feature: [REPLACE WITH PAGE NAME(s)]

Title

Epic: WAVE: [REPLACE WITH Alert/Aria/Contrast Error/Error]

Body

### Overview
We need to make issues that will apply a solution for [REPLACE WITH Alert/Aria/Contrast Error/Error] so that it can get fixed across the site.

### Details
Category: [REPLACE WITH ONE OF THESE CATEGORIES Alert/Aria/Contrast Error/Error]
Name: [REPLACE WITH NAME OF Alert/Aria/Contrast Error/Error]
(There is already a solution for this issue, it just needs to be applied to the pages)

known pages (there might be others):
1. [REPLACE WITH NAME OF PAGE NAME 1]
1. [REPLACE WITH NAME OF PAGE NAME N]

This epic will do the following
- create issues to fix any occurrences of this problem

### Action Items
- [ ] Go to the Solutions Index (resource 1.02) and add the link to the specific page for this problem 1.02.01
- [ ] Copy the issue template (resource 1.04)
- [ ] Use the template content to create a new issue(s) for the pages under Known pages above
- [ ] Customize the draft
   - [ ] Add the following labels
      - role: front-end
      - size: missing
      - p-feature: [REPLACE WITH FIRST PAGE NAME]
      - feature: Accessibility
      - level: missing
      - deck: add to staging
      - ready for dev lead
      - priority: MUST HAVE
   - Customize the draft issue resoures
      - [ ] In this issue use the content in resource Product Documentation 1.03.01 to update the draft's issue resource 1.02.01, 1.02.02
      - [ ] In this issue use the content in resource 1.01.01 (spreadsheet) to update the link to the spreadsheet in draft issue's resource 1.03
         - [ ] open the spreadsheet link and find the row number, and add it to the draft issues's resource 1.03.01
- [ ] Once all the issues are closed, run WAVE and check all other pages for this alert; ignore all other alerts.  Check user interactions on the page to ensure that the alert isn't hidden by an interaction. Check one of the following below:
   - [ ] No additional instances of this alert found
   - [ ] New instances of these alerts found
      - [ ] Make additional issues


### Resources
- 1.01 [TDM WAVE Accessibility Audit Spreadsheet, tab: 2. Audit Log](https://docs.google.com/spreadsheets/d/1qiAqR9LH-Gd4LO3aOs0yUy174o5LOmnuU6Bz671mKsY/edit?gid=0#gid=0)
   - 1.01.01 [TDM WAVE Accessibility Audit Spreadsheet, tab: 2. Audit Log, filter: [REPLACE WITH NAME OF FILTER FOR Alert/Aria/Contrast Error/Error]
- 1.02 [WCAG: Known Issues and Solutions](https://hackforla.github.io/accessibility/known-issues-and-solutions)
  - 1.02.01 https://hackforla.github.io/accessibility/known-issues-and-solutions/solutions-index/[REPLACE WITH PAGE NAME WITH DASHES]/
- 1.03 WIKI: Product Documentation: https://github.com/hackforla/tdm-calculator/wiki/Product-Documentation
   - 1.03.01 WIKI: Product Documentation, [REPLACE WITH PAGE NAME] page: 

#### 1.04 Issue Template
Title
```
Dev: fix [REPLACE WITH Alert/Aria/Contrast Error/Error] on [REPLACE WITH PAGE NAME] page
```
Body
````
### Overview
We need to fix the Alert: [REPLACE WITH Alert/Aria/Contrast Error/Error](s) on [REPLACE WITH PAGE NAME] so that page can be WCAG compliant.

#### Details
Category: [REPLACE WITH ONE OF THESE CATEGORIES Alert/Aria/Contrast Error/Error]
Name: [REPLACE WITH NAME OF Alert/Aria/Contrast Error/Error]
(The Accessibility wiki for this Alert has a solution)

Page that will be worked on:
[REPLACE WITH NAME OF PAGE NAME]

### Action Items
- [ ] Review wiki page: Accessibility, How to run the WAVE browser extension (Resource 1.01)
   - [ ] Install the WAVE browser extension
- [ ] Log in as the user indicated (resource 1.02.01) 
- [ ] navigate to the page you are going to fix (resource 1.02.02)
- [ ] Open the TDM WAVE Accessibility Audit Spreadsheet, for this Alert (resource 1.03) and find the row that relates to this  issues page.
- [ ] Run the WAVE extension with no elements focused, or clicked
- [ ] Find the Alert referenced in the Spreadsheet (1.03)
- [ ] This alert has been resolved on other pages, so review `Project Team Solution` section (resource 1.04.01.01)
- [ ] Apply solution
- [ ] Submit PR
- [ ] Add PR to spreadsheet in PR column next to Alert (resource 1.03)
- [ ] On this issue
   - [ ] Add labels: 
      - `ready for accessibility lead`
   - [ ] Change status to: `Technical Review`
   - to the epic #2897
     - [ ] Add the label `ready for product`
      - [ ] Add this comment 
         ```
          - [#REPLACE WITH THIS ISSUE NUMBER] is closed.  Please review to see if there are any remaining instances of this problem
         ```

### Resources/Instructions
- 1.01[How to run the WAVE browser extension](https://github.com/hackforla/accessibility/blob/main/docs/getting-started/wave-browser-extension.md)
- 1.02 Application details
   - 1.02.01 User Profile Required: [REPLACE WITH USER TYPE: visitor (not logged in)/user/admin/security admin/]
   - 1.02.02 Page URL: http://tdm-dev.azurewebsites.net/[REPLACE WITH PAGE URL]
      - Requires sign in: [REPLACE WITH TRUE OR FALSE]
      - Can access page directly from URL: [REPLACE WITH TRUE OR FALSE]
- 1.03 [TDM WAVE Accessibility Audit Spreadsheet, tab: 2. Audit Log, filter: Alert: [REPLACE WITH FILTER NAME]]
   -  Spreadsheet Row(s): [REPLACE WITH ROW NUMBERS]
- 1.04 [Accessibility Known Issues Index](https://github.com/hackforla/accessibility/blob/main/docs/known-issues-and-solutions/solutions-index/index.md)
    - 1.04.01 [WAVE Known Accessibility Issue: [REPLACE WITH ONE OF THESE CATEGORIES Alert/Aria/Contrast Error/Error] - [REPLACE WITH NAME OF Alert/Aria/Contrast Error/Error]]
        - 1.04.01.01 [WAVE Known Accessibility Issue: [REPLACE WITH ONE OF THESE CATEGORIES Alert/Aria/Contrast Error/Error] - [REPLACE WITH NAME OF Alert/Aria/Contrast Error/Error], project-team-solution]

Additional reading (optional)
- https://hackforla.github.io/accessibility/

#### Slides
- [Staging Deck](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg)
   - [Staging Deck, slide ]
- Release deck
   - [2026-01-20 Release deck, slide ]
````

#### Slides
- [Staging Deck](https://docs.google.com/presentation/d/1crZ3IxqA4hAu3qzD7ns93Ieuqjwh6wyEtuX_46cP-fg)
   - [Staging Deck, slide 2897] - N/A
- Release deck
   - [2026-01-20 Release deck, slide 2897] - N/A