{
  "area-alt": {
    "title": "Image Map <area> Elements Lack Descriptive Text Labels",
    "summary": "Image maps on the site have clickable areas (<area> elements) without alternative text. This makes it impossible for screen reader users and others relying on assistive technology to understand what each region does.",
    "description": "Users who access the web through screen readers, voice navigation, or magnification tools depend on text alternatives to understand clickable elements. Without alt text on image map regions, these users are denied critical navigational context, making it harder or even impossible to complete tasks such as shopping, planning visits, or learning.",
    "severity": "critical",
    "type": "failure",
    "responsibility": ["developer", "content"],
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      },
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [],
    "supporting_links": [
      {
        "name": "MDN - <area> element",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/area"
      }
    ],
    "user_stories": [
      "Carlos, a retired teacher who uses a screen reader due to vision loss, is trying to navigate a museum's website to plan a family visit. The homepage features a clickable image map of the museum layout, but none of the clickable areas have alt text. Because of this, his screen reader announces only 'link' with no context, making it impossible to understand where each link goes. He feels frustrated and excluded, unsure how to proceed. If each <area> element had clear alternative text describing its destination, Carlos could explore the site independently and confidently plan the visit.",
      "Jenna, a college student with low vision, is using her tablet to browse a clothing store’s website. She taps on an interactive image map meant to help users shop by outfit, but the clickable areas don’t have alt text. Because of this, her screen magnifier shows only hotspots with no descriptive labels, forcing her to guess what each area leads to. It’s confusing and discouraging, especially when she ends up on unrelated product pages. If each <area> tag had meaningful alt text, Jenna could understand what she’s selecting and shop with confidence, just like any other customer.",
      "Malik, a delivery driver with a cognitive disability, is using a city's transit website to locate nearby parking zones through an image map. However, the interactive zones aren’t labeled with alt text, so he can't tell which area represents what. This makes the process slow and overwhelming, causing him to miss important info. If each clickable region had descriptive alt text, Malik could quickly and clearly identify the right parking zone and stay on schedule.",
      "Lana, a high school student with a learning disability, is browsing a university website with an image map showing different academic departments. Without alt text, each area just says 'link' on her screen reader, leaving her confused and anxious. She ends up skipping the page entirely. If the <area> elements included concise, meaningful labels, Lana could explore departments easily and feel more confident in her college search.",
      "Tom, a grandfather with low vision, wants to buy a gift online. He uses an online catalog that has a clickable image map of various product categories. But none of the clickable areas have alt text. He ends up clicking around aimlessly, feeling overwhelmed and disoriented. If the areas were labeled with text alternatives, Tom could find the right gift faster and enjoy the shopping experience.",
      "Aisha, a young professional who uses voice navigation due to a motor disability, tries accessing an office floor plan on a company site. The interactive map lacks alt text for <area> tags, making it hard for her software to target specific rooms. She feels excluded from planning her office setup. If each <area> had alt text, Aisha could interact with the map using voice commands effectively.",
      "Noah, a student with dyslexia, tries using a visual map on a science fair website to learn about the event layout. Since the image map areas don’t have alt text, his text-to-speech tool just reads ‘link’ repeatedly. It’s frustrating and discouraging. If each <area> tag had a simple label, Noah could easily follow along and prepare for the event.",
      "Priya, a job seeker with partial sight, uses a company website with a visual org chart in an image map format. But the areas don’t have alt text, making it hard for her to understand who does what. She feels left out and unsure how to contact the right person. With alt text in each <area>, Priya could navigate the chart confidently and apply with ease.",
      "Ethan, an older adult with macular degeneration, tries to explore a travel site’s destination guide through a world map image. Without alt text in the image map’s <area> elements, he struggles to figure out what each region leads to. It leaves him feeling stuck and frustrated. Adding alt text would let him explore locations independently and plan his dream vacation.",
      "Maya, a visually impaired artist, visits an online gallery that uses an image map to showcase artwork categories. Her screen reader can’t interpret the links without alt text, so she can't tell what each area displays. She feels disappointed and disconnected. If the <area> tags included descriptive labels, Maya could fully engage with the gallery content.",
      "Lucas, a teen with ADHD, wants to check out a gaming convention’s map online. The clickable areas are unlabeled, making him lose focus and patience quickly. He gives up trying to figure out where things are. Adding alt text to each <area> would give him structure and help him plan his visit effectively.",
      "Ella, a parent of a child with autism, uses an educational site that has an image map of subjects. But without alt text, she struggles to find the right area for her child’s needs. It’s stressful and time-consuming. With meaningful alt text in the map areas, Ella could easily navigate and support her child's learning.",
      "Jordan, a warehouse worker recovering from eye surgery, tries browsing a supplier site with an interactive equipment map. The <area> tags aren’t labeled, so he can’t use his screen reader to find the right tools. He ends up frustrated and gives up. With descriptive alt text, Jordan could access product info with ease during recovery.",
      "Sofia, a teacher using a tablet with a screen magnifier, explores a digital museum map with her students. The clickable image has unlabeled <area> elements, so she has to guess what each one means. This slows down the lesson and causes stress. If each area had alt text, Sofia could confidently guide her class.",
      "Mark, a wheelchair user who relies on a head pointer and screen reader, tries to book a seat on a theater's website using a seat map. The <area> tags on the map aren’t labeled, making it impossible to know which seats are accessible. He feels invisible. Adding clear alt text would empower Mark to book with confidence.",
      "Hannah, a history buff with low vision, visits a war memorial site that uses a map to link to different battle sites. The image map’s <area> tags lack alt text, so she can’t explore the content. It’s disappointing. Adding alt text would let her engage with the stories she loves independently.",
      "Zane, a freelance designer using a screen reader, checks a client’s draft of an image-map-based navigation menu. Without alt text, all he hears are generic ‘link’ announcements. He can’t review the user flow properly. If each <area> had descriptive text, Zane could give meaningful feedback.",
      "Nina, a retiree who’s new to tech and has low vision, browses a healthcare site’s visual clinic map. None of the map areas are labeled, so she’s lost and confused. It makes her feel helpless. Adding alt text to <area> elements would help her find services and feel more in control.",
      "Omar, a blind musician, explores a music festival site with an interactive map of stages and vendors. Without alt text on <area> tags, he can’t tell what’s where. It’s frustrating and makes the site unusable. If each area had descriptive text, Omar could plan his visit just like anyone else.",
      "Leah, a library assistant with a cognitive disability, tries to use a map on the library intranet to find supply rooms. The image map areas aren’t labeled, so she keeps getting lost. It makes her anxious and slows down her work. Adding meaningful alt text would help her navigate quickly and independently."
    ]
  },
  "aria-allowed-attr": {
    "title": "ARIA Attribute Not Allowed for Element’s Role",
    "summary": "Certain ARIA attributes are being applied to roles that don’t support them. This causes screen readers to misinterpret or skip key information, confusing users who rely on assistive technology.",
    "description": "ARIA attributes must only be used with roles that support them. When this guideline is not followed, screen readers can ignore or misinterpret the content, leaving users without critical context or interaction capabilities. This particularly affects users who rely entirely on assistive technologies to navigate and understand web content.",
    "severity": "critical",
    "type": "failure",
    "responsibility": ["developer"],
    "supporting_links": [
      {
        "name": "W3C - ARIA in HTML",
        "link": "https://www.w3.org/TR/html-aria/"
      },
      {
        "name": "W3C - ARIA Authoring Practices Guide",
        "link": "https://www.w3.org/WAI/ARIA/apg/"
      }
    ],
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA state or property is permitted",
        "link": "https://act-rules.github.io/rules/5c01ea"
      }
    ],
    "user_stories": [
      "David, a retired teacher who uses a screen reader due to vision loss, is trying to navigate a city's public transportation website to check bus schedules. Because a key navigation element uses ARIA attributes that aren't supported by its role, his screen reader either skips it or announces incorrect information. It leaves him confused and frustrated, unsure if he's missing important options. If developers used ARIA attributes only in roles that support them, David could confidently access all parts of the site and plan his trip independently.",
      "Maria, a college student with low vision, is filling out a scholarship form on a university portal. Because the form fields use ARIA labels that aren't allowed for their role, her screen reader doesn't announce field names correctly. She feels anxious, afraid of making mistakes on a critical application. If the developers used proper ARIA labels compatible with each element’s role, Maria could complete the form confidently and accurately.",
      "James, a warehouse worker with a hearing impairment, uses a screen reader to help with visual context. On a job portal, ARIA attributes used improperly on status updates make the screen reader output garbled. He gets frustrated and worries he missed application deadlines. If the ARIA roles and attributes were correctly paired, James would be able to navigate updates clearly and stay on top of job opportunities.",
      "Rita, a small business owner with glaucoma, is trying to manage orders on an e-commerce dashboard. Improper ARIA attributes on buttons confuse her screen reader, making critical controls unreadable. She feels overwhelmed and disempowered. If developers ensured ARIA attributes matched valid roles, Rita could run her business with greater ease and confidence.",
      "Omar, a university librarian who relies on keyboard navigation and screen readers, is browsing an academic journal site. Because interactive filters have roles that conflict with their ARIA attributes, he can't interact with them properly. He feels excluded and frustrated. If developers validated role-ARIA compatibility, Omar could use the filters just like sighted users.",
      "Linda, a grandmother with macular degeneration, is trying to read stories to her grandchildren on a kids' book site. Because the read-aloud button uses incorrect ARIA attributes, her screen reader doesn't pick it up. She feels disheartened. If ARIA attributes were correctly assigned for the button’s role, Linda could easily use the feature to share stories with her grandkids.",
      "Carlos, a software engineer with a cognitive disability, uses assistive tools to simplify web pages. On a tech blog, decorative elements have misleading ARIA roles and attributes. This creates a cluttered experience and distracts him. He feels mentally exhausted. If the site used accurate ARIA roles and attributes, Carlos could focus on content more easily.",
      "Emma, a student with dyslexia, relies on screen readers to review essays on her school portal. A sidebar labeled with incorrect ARIA tags doesn’t get read aloud properly. She ends up missing important guidance notes. If developers used ARIA labels permitted for the sidebar’s role, Emma could follow her teachers’ feedback smoothly.",
      "Tom, a chef recovering from a stroke who now uses voice and screen reader input, is exploring a recipe website. Due to incompatible ARIA roles and attributes, some recipe steps are unreadable. He gets discouraged when trying to cook independently. If ARIA were applied correctly, Tom could follow instructions confidently and enjoy cooking again.",
      "Sophie, a freelance photographer with partial vision, is trying to book a client session on a portfolio site. Date selectors have improper ARIA labels, so her screen reader skips them. She misses availability slots and feels professionally hindered. If developers used allowed ARIA attributes for calendar roles, Sophie could book with ease.",
      "Nathan, a visually impaired musician, is purchasing audio software from a vendor site. Modal windows use ARIA roles that don't support their assigned attributes, confusing his screen reader. He’s uncertain about pricing and features. If ARIA attributes were properly matched to roles, Nathan could understand product details and make informed purchases.",
      "Aisha, a journalist with tunnel vision, uses screen magnification and assistive reading tools. A news site uses ARIA states improperly in its tab panels, making article sections unrecognizable. She feels left out from exploring in-depth content. If developers used appropriate ARIA attributes for tab roles, Aisha could fully engage with the site.",
      "George, a retiree with early-stage Parkinson’s, uses a screen reader to help with motor and visual navigation. Online banking pages with mismatched ARIA attributes prevent him from confirming transactions. He becomes anxious about financial errors. If the ARIA usage followed correct role guidelines, George could manage his finances with peace of mind.",
      "Tina, a hearing-impaired parent using a screen reader for visual aid, is checking grades on her child's school portal. ARIA mislabeling in expandable menus causes the screen reader to ignore critical sections. She feels helpless and uninformed. If ARIA attributes were allowed for those roles, Tina could access important updates easily.",
      "Leo, a veteran with a traumatic brain injury, relies on screen reader support for clarity. On a health insurance site, improper ARIA roles in drop-down menus make it hard to compare plans. He becomes mentally fatigued and delays important decisions. With properly implemented ARIA support, Leo could explore options stress-free.",
      "Anika, a high school student with a reading disorder, uses screen readers to assist with comprehension. On her school’s event site, incorrect ARIA attributes on navigation links confuse the tool’s reading order. She feels left out of activities. If the ARIA attributes matched allowed roles, Anika could easily plan her social calendar.",
      "Raj, a taxi driver who recently lost his sight, is learning to use screen readers. A driver app dashboard has buttons with invalid ARIA roles, so he can’t log work hours properly. This creates income uncertainty. If the app followed ARIA standards, Raj could operate his account independently and securely.",
      "Mina, a single mom who’s blind, is applying for government assistance online. Form fields marked with ARIA attributes not allowed for their roles go unnoticed by her screen reader. She feels invisible and frustrated. If these attributes were correctly applied, Mina could complete applications and support her family without external help.",
      "Ethan, a non-verbal user with multiple disabilities, relies on screen readers and keyboard-only access. On a disability services portal, buttons misusing ARIA make navigation impossible. He ends up locked out of support resources. If developers ensured role-appropriate ARIA, Ethan could get the help he needs without barriers.",
      "Jia, an ESL speaker with low vision, uses screen readers for clarity. On an immigration site, mislabeled ARIA attributes on important alerts prevent her from understanding visa requirements. She becomes fearful and confused. If developers adhered to allowed ARIA roles, Jia could stay informed and take the right actions confidently."
    ]
  },
  "aria-braille-equivalent": {
    "title": "Missing Standard ARIA Labels for Braille-Specific Attributes",
    "summary": "Elements using braille-specific ARIA attributes are missing standard equivalents like aria-label, preventing screen readers from conveying necessary information to users who rely on speech output.",
    "description": "When aria-braillelabel or aria-brailleroledescription are used without a corresponding aria-label, aria-labelledby, or aria-roledescription, users who rely on non-braille screen readers are unable to perceive control labels or roles. This creates significant barriers to navigation and interaction. These users may miss form fields, buttons, or key actions entirely, leading to confusion, errors, or abandonment.",
    "severity": "serious",
    "type": "failure",
    "responsibility": ["developer", "content"],
    "supporting_links": [
      {
        "name": "MDN - aria-braillelabel",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-braillelabel"
      },
      {
        "name": "MDN - aria-brailleroledescription",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-brailleroledescription"
      },
      {
        "name": "MDN - aria-label",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label"
      },
      {
        "name": "MDN - aria-labelledby",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-labelledby"
      },
      {
        "name": "MDN - aria-roledescription",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-roledescription"
      }
    ],
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Thomas, a retired teacher who uses a braille display, is trying to fill out a form on a government services website. Because the site only uses `aria-braillelabel` and `aria-brailleroledescription` without providing non-braille equivalents like `aria-label`, his screen reader doesn't convey the field names. It makes him feel excluded and frustrated. If the website included both braille and non-braille ARIA attributes, Thomas could navigate and understand the form fields correctly.",
      "Amina, a college student who is blind, is trying to register for classes on her university’s portal. The site uses braille-specific ARIA labels without standard equivalents. Her screen reader doesn't announce the course names. She feels anxious about missing registration deadlines. If non-braille ARIA labels were added, she could confidently select her courses.",
      "Marcus, a bank customer who relies on a screen reader with a braille display, is checking his account on the bank's website. Key buttons use `aria-braillelabel` only, so his screen reader is silent on what they do. He worries about clicking the wrong thing. If `aria-label` were also present, Marcus would feel more secure handling his finances.",
      "Linda, a legal assistant with low vision who uses a braille display, is reviewing court documents in a web app. Without non-braille ARIA equivalents, her reader skips over important control labels. It causes delays in her work. Adding `aria-labelledby` alongside the braille attributes would let Linda work more efficiently.",
      "Jose, a small business owner who is blind, is updating product listings on an e-commerce platform. Missing `aria-label` attributes mean the controls are invisible to his screen reader. He feels frustrated and behind schedule. Including standard ARIA labels would help Jose manage his shop independently.",
      "Yuki, a high school student who is blind, is completing homework on a school website. The braille-specific roles aren't picked up by her screen reader. She feels embarrassed when she has to ask for help. Including non-braille ARIA equivalents would let Yuki study on her own with confidence.",
      "Ethan, a blind job seeker, is applying for positions through a hiring platform. The job filters and search controls are unlabeled for his screen reader. He misses out on narrowing down results. Adding `aria-label` would give Ethan the same control over his search as other users.",
      "Rosa, a museum archivist who uses a braille display, is cataloging artifacts in an internal system. The UI uses braille-only descriptions, so many controls appear blank. It slows down her workflow. Adding conventional ARIA attributes would ensure Rosa can work with full context.",
      "Nico, a blind artist using an online gallery builder, finds buttons labeled only with braille-specific roles. His screen reader doesn’t identify them. He’s unsure what each action does. Adding `aria-label` would empower Nico to confidently manage his portfolio.",
      "Karen, a senior citizen learning to bank online, uses a braille reader. Some navigation elements are unreadable due to missing standard ARIA roles. She feels disoriented and calls her son for help. Including `aria-labelledby` would let Karen explore the site independently.",
      "Leo, a blind chef accessing recipes through a food blog, can’t identify step-by-step instructions due to braille-only ARIA attributes. His screen reader skips crucial labels. He feels annoyed and loses time. Adding standard ARIA labels would help him follow along easily.",
      "Anika, a nonprofit director who uses a braille display, is creating donor forms. With braille-only attributes, her screen reader misses labels, risking form errors. She feels worried about data accuracy. Dual ARIA labeling would ensure clarity and reduce mistakes.",
      "Sam, a blind delivery driver, is trying to update his shift on a logistics app. Controls show up blank in his screen reader because of missing standard ARIA roles. He gets stressed over scheduling conflicts. Adding `aria-label` would let him update his shifts quickly.",
      "Haley, a blind parent using a school portal, can't read notifications due to braille-only roles. She feels left out of her child's education. Including both `aria-braillelabel` and `aria-label` would keep her informed and involved.",
      "Omar, a financial analyst who uses a braille display, accesses a trading platform with braille-only ARIA labels. Many controls are unrecognized. He fears making mistakes. Adding `aria-labelledby` would let Omar manage investments securely.",
      "Giulia, a blind tourist using a travel booking site, finds that filters and dates aren’t labeled in her screen reader. Braille-only roles exclude her. She feels overwhelmed and abandons booking. Adding `aria-label` would simplify her experience.",
      "Darnell, a coding bootcamp student with a braille display, accesses an online IDE. The toolbar buttons have only `aria-braillelabel`. He’s unsure what each one does. Including `aria-label` would help Darnell code effectively.",
      "Lena, a visually impaired nonprofit volunteer, uses a website with only braille role descriptions. Her screen reader fails to provide button purposes. She feels disempowered. Adding dual ARIA roles would restore clarity and control.",
      "Ben, a blind musician uploading tracks to a music-sharing platform, can't identify upload steps due to missing non-braille labels. He gets frustrated trying to share his work. Standard ARIA attributes would let Ben publish confidently.",
      "Tariq, a blind university applicant, struggles with an admissions portal using braille-only attributes. His screen reader can't interpret key actions. He fears missing deadlines. Including `aria-label` and `aria-labelledby` would let Tariq complete his application independently."
    ]
  },
  "aria-command-name": {
    "title": "Missing Accessible Names on ARIA Buttons, Links, and Menu Items",
    "summary": "Users relying on assistive technologies can’t interact with controls that lack accessible names. Buttons and links without labels cause confusion and prevent navigation.",
    "description": "ARIA elements like buttons, links, and menu items must have accessible names so assistive technologies can identify them clearly. Without these names, screen readers often say only “button” or omit them, making it hard or impossible to use. This disproportionately affects users with vision, cognitive, or motor disabilities who rely on voice commands or screen reading software.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Button has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/97a4e1"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - aria-label",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-label"
      },
      {
        "name": "W3C - ARIA Authoring Practices Guide",
        "link": "https://www.w3.org/WAI/ARIA/apg/"
      }
    ],
    "user_stories": [
      "Maria, a retired teacher with vision loss, is trying to navigate a community forum on her screen reader. Because the buttons don’t have accessible names, her device just announces 'button' repeatedly. It makes her feel lost and frustrated. If each button had a clear ARIA label, she could confidently explore and participate in discussions.",
      "Jamal, a busy father using voice control on his phone, wants to reorder items in a shopping app. The app’s drag-and-drop controls are unlabeled. Because of this, his voice assistant can’t identify them. It makes the task feel impossible. If developers added ARIA names like 'Move item up', he could complete his order hands-free.",
      "Linh, a college student with low vision, is using zoom tools on a university portal. Several links appear as icons with no text or accessible names. She can’t tell what they do. This slows her down and causes stress during registration. Adding ARIA labels like 'Course schedule' or 'Exam results' would let her navigate easily.",
      "Eli, a teenager with a cognitive disability, is trying to share a post on a music app. The share menu uses unlabeled icons. He keeps clicking the wrong ones and gets confused. This makes him feel left out. With descriptive ARIA names like 'Share to Instagram' or 'Copy link', he could participate like his peers.",
      "Fatima, a multilingual worker using a screen reader, is applying for jobs on a career site. Some of the buttons don’t have names, so her reader says 'button, button'. She can’t figure out which starts the application. It’s discouraging. If buttons were named 'Apply now' or 'Save job', she’d have better control.",
      "Omar, an older adult with Parkinson’s using voice navigation, wants to check his bank balance. The banking app's navigation menu has unlabeled items. He can’t activate them using voice commands. It makes him anxious about managing his money. Naming each menuitem with ARIA roles would empower him to bank independently.",
      "Grace, a high school student with dyslexia, is exploring a charity website. Several buttons show only icons with no labels. Her text-to-speech software can’t describe their function. This leads to mistakes and embarrassment. If buttons included accessible names, she’d understand their purpose and feel more confident.",
      "Noah, a delivery driver with a temporary hand injury, is trying to update his availability in a gig app using voice commands. But buttons lack accessible names, so voice control fails. This disrupts his work schedule. If the developer added clear ARIA labels, he could stay productive while healing.",
      "Tanya, a mom with limited tech skills and mild cognitive impairment, is booking a doctor’s appointment online. Unlabeled icons in the menu confuse her. She ends up clicking the wrong section. This causes delays and stress. Adding ARIA roles and names like 'Appointments' or 'Messages' would ease her experience.",
      "Zeke, a visually impaired gamer, is customizing settings in a game dashboard. The toggle switches for sound and notifications aren’t named. His screen reader can’t explain what they do. It’s frustrating and ruins the fun. Accessible names like 'Enable sound' or 'Turn on alerts' would make the interface inclusive.",
      "Ivy, a wheelchair user who relies on head tracking, is trying to upload documents to a university portal. The upload button is only an icon with no name. Her assistive tech can’t identify it. This prevents her from submitting work. Naming the button clearly with ARIA would remove this barrier.",
      "Mateo, a bilingual student using a screen reader in Spanish, wants to find his grades on the school portal. The link is just an icon with no ARIA label. His reader skips over it. This leaves him unsure and frustrated. With a labeled link like 'View grades', he’d find what he needs.",
      "Rachel, a nurse with mild memory loss, is logging into her hospital’s HR system. Several dashboard buttons are unlabeled. She forgets their function and hesitates. This adds stress to her already busy day. With ARIA labels like 'Pay stubs' or 'Schedule', she could work more efficiently.",
      "Leo, a remote worker with carpal tunnel syndrome, navigates using a keyboard. He hits a series of buttons in a project management app, but they aren’t labeled. He has no clue what they do. This slows him down and causes errors. Proper ARIA names would make keyboard navigation smoother.",
      "Sasha, a hearing-impaired designer using a screen reader for feedback, tries reviewing client comments on a design tool. Menu items for comment filtering are unlabeled. She can't access them. It limits her ability to collaborate. Adding accessible names would ensure she can filter and review with ease.",
      "Ahmed, an ESL learner with dyslexia, is using an education app that relies on icon-only buttons. His screen reader skips key actions. He feels excluded and disheartened. With meaningful ARIA labels, he’d engage with the learning tools like everyone else.",
      "Joy, a grandmother learning to use a recipe website, is trying to bookmark her favorite dishes. The bookmark button is an unlabeled icon. She gets confused and gives up. Adding an ARIA name like 'Save recipe' would help her feel successful and encouraged.",
      "Caleb, a high schooler recovering from surgery, uses voice commands to access a student portal. But voice control doesn’t recognize the unlabeled menu items. He misses important announcements. Clear ARIA labels would allow him to stay updated without physical effort.",
      "Aisha, a public librarian with glaucoma, is updating event listings on a library site. The 'add event' button is just a plus icon with no ARIA name. Her screen reader doesn’t detect it. This delays her work. Labeling the button would improve her efficiency.",
      "Ben, a busy parent using assistive touch on his phone, tries to reorder a grocery list in an app. Without ARIA names, he can’t tell what each control does. It’s irritating and wastes time. If drag controls had clear labels, he could organize his list effortlessly."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-conditional-attr": {
    "title": "Invalid ARIA Properties Applied to Incompatible Elements",
    "summary": "ARIA attributes are being used on elements that do not support them, which can confuse assistive technologies and hinder user access.",
    "description": "When ARIA attributes are applied to elements that do not support them, assistive technologies can skip content, misinterpret the page structure, or prevent user interactions. This creates confusion or frustration for users who rely on screen readers, voice navigation, or other assistive tools. Developers should reference the ARIA specification to ensure attributes match the roles of elements.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA state or property is permitted",
        "link": "https://act-rules.github.io/rules/5c01ea"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - ARIA Techniques",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Guides/Techniques"
      }
    ],
    "user_stories": [
      "Darnell, a blind podcaster, is trying to submit a form on a new audio-hosting site using his screen reader. Because an ARIA attribute is incorrectly applied to a non-interactive element, the screen reader skips over essential form fields. It makes him feel excluded and frustrated. If the ARIA roles matched the elements correctly, he could easily fill out the form like everyone else.",
      "Linda, a retired teacher with low vision, is browsing a community blog with her screen magnifier. Because the blog uses ARIA attributes not allowed on the current element roles, her screen reader announces confusing or missing labels. It makes her feel disoriented and unsure of where she is on the page. If developers used ARIA attributes that were valid for those roles, she could navigate confidently.",
      "Miguel, a college student with dyslexia, uses text-to-speech to help read long articles. On his university’s e-learning portal, improperly used ARIA attributes cause the reading tool to skip over navigation buttons. He misses important actions, which causes anxiety about missing deadlines. If ARIA roles and states were correctly used, he could follow content and instructions smoothly.",
      "Jasmine, a deaf UX designer, relies on visual cues and keyboard navigation to test interfaces. On a design tool’s help page, improper ARIA attributes prevent keyboard focus from working correctly. She feels professionally limited and annoyed. If the roles were semantically correct and followed ARIA rules, she'd be able to conduct her work independently.",
      "Robert, a warehouse worker with a cognitive disability, is ordering new boots on a store website. ARIA attributes are used incorrectly on filter dropdowns, making them unreadable by his assistive tech. It confuses him and he abandons the site. If filters were built with correct ARIA roles and properties, he could complete his purchase without stress.",
      "Priya, a legally blind lawyer, is checking case updates on her firm’s internal dashboard. Because some ARIA states are not permitted on the roles used, screen readers skip or misread those parts. She feels at a disadvantage compared to her sighted colleagues. If developers followed ARIA role specifications, she could stay up-to-date with her caseload.",
      "Sam, a teen with ADHD, is trying to register for a game tournament online. An ARIA attribute meant to indicate errors is misapplied, so error messages are not announced by his assistive tech. He becomes overwhelmed and gives up. If error states used valid roles and properties, he could complete registration easily.",
      "Karen, a grandmother with hearing loss and some motor difficulties, is navigating her health portal with a keyboard. Improper ARIA attributes on collapsible menus mean she can't open important sections with her keyboard. It makes her feel helpless. If ARIA was used correctly, she'd be able to access her health info easily.",
      "Nico, a nonbinary artist with low vision, is editing their gallery profile. Improper ARIA use causes elements to lack meaningful roles, so screen readers skip them. They feel excluded from managing their own work. If developers checked ARIA role compatibility, Nico could edit their profile confidently.",
      "Fatima, a software engineer who is blind, is reviewing product specs on a client site. The ARIA `aria-expanded` attribute is placed on a non-expandable element, confusing her screen reader. She wastes time debugging the interface. If the attribute were applied to the correct role, she'd navigate efficiently.",
      "Todd, an airline customer with tremors and low vision, tries to change his seat via a web app. Because an unsupported ARIA role is used on the seat map, his screen reader doesn’t recognize the options. He feels panicked about his upcoming trip. If roles and attributes were used as recommended, he could choose a seat stress-free.",
      "Emily, a teacher with dyslexia, is reading training materials on an education platform. Invalid ARIA attributes cause screen readers to behave unpredictably, sometimes skipping content. She becomes confused and wastes time re-reading. If ARIA were correctly used, she could rely on her tools to understand the material.",
      "Tariq, a mobility-impaired accountant, navigates with voice commands. When voice tools can't parse improperly used ARIA roles, he can't activate buttons or links. He feels restricted in his work. If ARIA conformed to role guidelines, Tariq could interact with the site using his voice reliably.",
      "Sue, a cancer survivor with memory issues, relies on clear feedback. A banking app misuses ARIA roles for form validation, so messages aren't announced. She submits incorrect forms and gets overwhelmed. If roles and properties were compatible, she'd feel reassured and capable.",
      "Jorge, a delivery driver with partial blindness, uses a screen reader while checking schedules. Because unsupported ARIA attributes are used on a calendar widget, it’s unreadable. He misses shifts. If developers used valid ARIA practices, he could plan his work correctly.",
      "Anika, a student with hearing and motor impairments, uses switch control to browse. A website’s navigation has ARIA attributes applied to the wrong elements, making some buttons unreachable. She feels like she’s hitting walls online. If roles and attributes were valid, she'd browse freely.",
      "Leo, a remote worker with anxiety and ADHD, uses assistive tools to stay focused. On a dashboard, invalid ARIA states cause notifications to disappear too quickly or not at all. He misses tasks, causing stress. If developers validated ARIA use, he'd stay on top of his work.",
      "Gwen, a pianist with glaucoma, browses concert listings with a screen reader. Improper ARIA use on the listing components means the titles aren’t read aloud. She feels like she’s missing out. If roles matched ARIA specs, she could enjoy choosing shows like anyone else.",
      "Marcus, a blind voter, tries to fill out an online ballot. An incorrect ARIA role on radio buttons causes screen reader confusion. He’s worried he’s not selecting candidates properly. If standard roles and ARIA attributes were used, he could vote with confidence.",
      "Alina, a deafblind user who relies on a braille display, can’t read modal content due to an unsupported ARIA role. It prevents the modal from receiving focus. She’s locked out of crucial information. If the modal had the correct ARIA structure, she’d have equal access."
    ],
    "responsibility": ["developer"]
  },
  "aria-deprecated-role": {
    "title": "Deprecated ARIA Roles Used",
    "summary": "Some interface elements are using ARIA roles that are no longer supported, causing issues with assistive technologies like screen readers.",
    "description": "Elements in the interface are currently using deprecated ARIA roles, which are no longer recognized by many assistive technologies. This causes confusion or miscommunication of content to users who depend on screen readers, voice navigation, or switch controls. Replacing these roles with valid, current alternatives ensures better accessibility and a more inclusive user experience.",
    "severity": "minor",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      },
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Role attribute has valid value",
        "link": "https://act-rules.github.io/rules/674b10"
      }
    ],
    "supporting_links": [
      {
        "name": "W3C - ARIA Deprecated Roles",
        "link": "https://www.w3.org/TR/wai-aria/#deprecated"
      }
    ],
    "user_stories": [
      "Liam, a blind podcast enthusiast who uses a screen reader, is trying to browse episode playlists on a podcast app. Because the developers used a deprecated ARIA role on the playlist elements, his screen reader either ignores the content or reads it incorrectly. It makes him feel excluded and frustrated, like he's missing out on new shows everyone else is talking about. If the developers replaced deprecated ARIA roles with current, valid ones, Liam could navigate the content properly and enjoy discovering new podcasts independently.",
      "Rosa, a retired teacher with low vision, is trying to book a museum tour using a cultural center's website. Because the site uses deprecated ARIA roles for the navigation menu, her screen reader skips over essential options. She feels confused and anxious about missing her chance to book. If the site updated its ARIA roles to valid ones, Rosa could confidently explore her options and plan her visit without needing assistance.",
      "Jake, a university student with dyslexia, relies on a screen reader to review his course materials. On the college’s learning portal, outdated ARIA roles make the reading order unpredictable. He often misses deadlines or misunderstand instructions. If these roles were modernized and correctly implemented, Jake could follow along with the course content without unnecessary stress.",
      "Angela, a grocery store cashier with hearing loss, is browsing a job portal using her screen reader. Because the website uses deprecated ARIA roles, she can't access the 'Apply' buttons properly. She worries about missing job opportunities. If the developers replaced the deprecated roles with valid semantic roles, Angela could apply for jobs with ease and confidence.",
      "Tim, a veteran with motor impairments, uses voice navigation software to browse a health services website. Deprecated ARIA roles confuse his software, making commands fail. It leaves him feeling helpless and frustrated. If the site used standard, up-to-date ARIA roles, Tim could manage his healthcare appointments independently.",
      "Priya, a college freshman with a visual impairment, is looking up exam dates on her school’s calendar tool. The calendar uses deprecated ARIA roles, causing her screen reader to skip over date cells. She feels nervous about missing key information. If the calendar used valid, current ARIA roles, Priya could keep up with her schedule like her classmates.",
      "Carlos, a delivery driver with ADHD, uses a food app to track his shifts. Because of deprecated ARIA roles, assistive technology reads out labels incorrectly. This confuses Carlos and sometimes leads to missed assignments. If the app used modern ARIA roles, Carlos could rely on clear cues to stay on top of his work.",
      "Mina, a freelance artist who is blind, is trying to update her portfolio on an art-sharing site. The outdated ARIA roles prevent her from accessing the image upload button. She feels disempowered and stuck. If the button used an appropriate ARIA role, Mina could share her artwork and grow her online presence.",
      "Dan, a retiree with Parkinson’s who uses switch controls, is trying to pay his bills on a banking site. Because of deprecated ARIA roles, some controls aren’t recognized by his assistive tech. This delays payments and causes him stress. If developers updated these roles to valid ones, Dan could manage his finances smoothly.",
      "Sara, a librarian with low vision, is using a government website to renew a permit. Her screen reader skips important sections because of deprecated ARIA roles in the layout. She feels frustrated and worries about making legal errors. Updating the site with correct ARIA roles would let Sara access all the necessary information.",
      "Omar, a teenager with autism who prefers text-to-speech tools, is trying to sign up for a coding camp. The registration page uses deprecated ARIA roles, making it hard to follow the form. He gets overwhelmed and gives up. If the site used proper ARIA landmarks and roles, Omar could register with confidence.",
      "Lucille, a senior with macular degeneration, is checking local news online. The article sections are labeled with deprecated ARIA roles, so her screen reader misidentifies them. She feels disoriented and discouraged. If the developers used valid ARIA labels, Lucille could stay informed just like everyone else.",
      "Isaac, a teenager recovering from a concussion, uses speech-to-text and screen reader tools. On his school’s e-learning platform, deprecated ARIA roles cause content to overlap or disappear. This affects his recovery and learning. With proper ARIA updates, Isaac could focus on healing while keeping up with school.",
      "Naomi, a single mom with dyslexia, uses an app to track her child’s school assignments. Deprecated ARIA roles break the tab navigation, and she misses important updates. She feels guilty and anxious. If developers modernized the roles, Naomi could stay engaged in her child’s education without added stress.",
      "George, a warehouse manager with hand tremors, uses keyboard navigation on his inventory system. Deprecated ARIA roles confuse focus states, so he accidentally deletes items. This affects his job performance. If the roles were updated, George could use the system accurately and efficiently.",
      "Fatima, a language learner with partial vision, uses magnification and screen reading together. A cooking blog’s interface uses deprecated ARIA roles, causing the screen reader to jump unpredictably. It leaves her feeling frustrated. With valid roles, Fatima could enjoy cooking new recipes with clarity.",
      "Ellie, a digital nomad with a hearing impairment, uses a screen reader to check travel deals. Because of deprecated ARIA roles, she misses key navigation prompts. She loses out on limited-time offers. If the site used standard roles, Ellie could make travel decisions quickly and independently.",
      "Marcus, a sports coach with color blindness and low vision, uses a website to schedule practices. The site relies on deprecated ARIA roles that don’t convey correct context. He ends up double-booking sessions. Updating to proper ARIA roles would help Marcus coordinate without confusion.",
      "Jenny, a blogger with a cognitive disability, finds it hard to stay focused when websites behave inconsistently. Deprecated ARIA roles on her publishing platform disrupt her editing flow. She feels defeated. If the platform used valid roles, Jenny could express herself more easily and maintain her blog.",
      "Raj, a software engineer who recently lost his sight, is trying to file taxes online. Outdated ARIA roles confuse his screen reader during form navigation. He feels anxious about errors. With updated and accurate ARIA roles, Raj could complete his taxes securely and independently."
    ],
    "responsibility": ["developer"]
  },
  "aria-hidden-body": {
    "title": "Page Content Inaccessible Because Body Is Marked as Hidden",
    "summary": "Setting aria-hidden=\"true\" on the <body> element hides the entire page from screen readers, making all content inaccessible to users who rely on assistive technology.",
    "description": "Applying aria-hidden=\"true\" to the <body> element causes screen readers to ignore the entire document, rendering all content invisible to users who rely on assistive technology. This creates a complete access barrier, particularly impacting blind or low vision users who need to navigate websites for essential services like education, healthcare, and employment. Removing this attribute from the body restores full access to content and functionality.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Lena, a college student who is blind, is trying to check her exam schedule on the university portal. Because the site has aria-hidden=\"true\" set on the body, her screen reader can’t read any of the content. It makes her feel excluded and frustrated. If the site removed aria-hidden from the body, Lena could access the schedule like everyone else.",
      "Paul, a retired teacher with low vision, is reading city council meeting notes on a government site. Due to aria-hidden=\"true\" on the body tag, his screen reader is silent. He feels helpless and ignored. If developers removed that attribute, Paul could stay informed and participate in civic life.",
      "Mei, a small business owner who is blind, is trying to file her taxes online. The platform’s screen content is unreadable because aria-hidden=\"true\" is applied to the whole body. She feels overwhelmed and anxious about missing deadlines. If that attribute were removed, Mei could complete her taxes independently.",
      "Carlos, a visually impaired music teacher, is accessing an online lesson platform. Since aria-hidden=\"true\" is set on the body, none of the instructions are read aloud. He’s left confused and unable to teach. If the attribute were removed, Carlos could engage fully with his students.",
      "Naomi, a blind grandmother, wants to send a birthday card using an e-card site. But aria-hidden=\"true\" on the body hides the entire page from her screen reader. She feels left out and disappointed. If developers fixed this, Naomi could share meaningful moments with family.",
      "Jared, a blind veteran, is checking for job openings on a hiring platform. Because of aria-hidden=\"true\" on the body, he hears nothing. It leaves him feeling invisible. Removing the attribute would allow Jared to explore opportunities and apply for work.",
      "Sofia, a blind high schooler, is logging into her school’s grading portal. With aria-hidden=\"true\" on the body, she can’t hear login instructions. She feels anxious about falling behind. If developers removed the attribute, Sofia could manage her schoolwork confidently.",
      "Ben, a blind Uber driver, is updating his profile in the app. But nothing reads aloud because aria-hidden=\"true\" is on the body. He feels stranded in the app. Removing the attribute would let Ben manage his account and stay connected to work.",
      "Tariq, a blind father, is trying to order groceries online. Because aria-hidden=\"true\" is set on the body, he can’t browse or checkout. He feels discouraged and helpless. If the attribute were removed, he could shop efficiently and care for his family.",
      "Aisha, a deaf-blind programmer, is trying to read documentation with a screen reader and Braille display. The content is hidden due to aria-hidden=\"true\" on the body. She feels blocked in her work. Removing that attribute would let her access critical resources.",
      "George, a blind retiree, wants to register for a virtual book club. But the whole page is silent due to aria-hidden=\"true\" on the body. He feels disconnected and unwelcome. Removing it would allow him to engage and socialize.",
      "Lily, a blind nurse, is checking hospital policy updates. The site shows nothing to her screen reader because of aria-hidden=\"true\" on the body. She’s frustrated and uninformed. Removing it would ensure she’s up to date on vital protocols.",
      "Oscar, a blind student, is accessing an e-learning module. Nothing reads out loud due to aria-hidden on the body. He’s confused and unable to complete assignments. If developers fixed this, he could learn without barriers.",
      "Dana, a blind chef, is reviewing a recipe site for tonight’s dinner. But aria-hidden=\"true\" on the body silences everything. She feels frustrated and stuck. Removing it would help Dana cook independently and confidently.",
      "Imran, a blind engineer, is trying to submit a project report on his company's portal. The site is completely silent due to aria-hidden=\"true\" on the body. He feels hindered and ineffective. If that was corrected, he could meet deadlines and contribute fully.",
      "Claire, a blind social worker, is checking emergency contact info for a client on a support portal. With aria-hidden=\"true\" on the body, nothing is accessible. She feels hampered and worried. Removing it would ensure she can respond quickly.",
      "Victor, a blind journalist, is browsing a news site. Since aria-hidden=\"true\" hides all content, he misses vital stories. He feels left out of the conversation. If the attribute were removed, Victor could stay informed and write with context.",
      "Rachel, a blind librarian, is using a cataloging system online. It’s unusable because aria-hidden=\"true\" makes the page unreadable. She feels ineffective at work. Removing that would let her serve the community efficiently.",
      "Eli, a blind teen gamer, is exploring a game’s companion website. The content is invisible to his screen reader due to aria-hidden=\"true\" on the body. He feels excluded from his gaming community. Removing it would let him participate fully.",
      "Nina, a blind art student, is browsing an online gallery for inspiration. But aria-hidden=\"true\" makes the content inaccessible. She feels disconnected from the art world. If fixed, she could enjoy and analyze the works like anyone else."
    ],
    "responsibility": ["developer"]
  },
  "aria-hidden-focus": {
    "title": "Hidden Elements Incorrectly Included in Keyboard Focus Order",
    "summary": "Elements marked with aria-hidden=\"true\" are still reachable via keyboard focus, creating confusion for users navigating with a keyboard or screen reader.",
    "description": "Elements marked as aria-hidden are meant to be invisible to both visual users and assistive technologies. When such elements are still part of the keyboard focus sequence, they become visible to screen reader or keyboard-only users, leading to confusion or repeated navigation. This breaks expected behavior and reduces usability.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Element with aria-hidden has no content in sequential focus navigation",
        "link": "https://act-rules.github.io/rules/6cfa84"
      }
    ],
    "user_stories": [
      "Leo, a college student with limited mobility, is trying to navigate a course registration portal using only his keyboard. Because some 'aria-hidden' elements are still focusable, his tab key lands on invisible content. It makes him feel frustrated and confused. If those hidden elements were removed from the tab order, he could move smoothly through the form without getting lost.",
      "Sophie, a job seeker with arthritis, is filling out an application on a hiring site using keyboard navigation. Because a hidden modal still contains focusable fields, her focus jumps unpredictably. It makes her anxious about missing important fields. If those fields were properly removed from focus, she'd feel more in control and confident.",
      "James, a screen reader user who lost his sight in his 40s, is browsing a travel site. Because a hidden sidebar has tabbable links, his screen reader lands on irrelevant information. This causes confusion and disrupts his experience. If those links were not focusable while hidden, he could navigate directly to the main content.",
      "Maya, a busy mom with temporary wrist injuries, is ordering groceries online using only her keyboard. Because a hidden menu retains focusable buttons, she ends up trapped in the wrong section. It makes her feel overwhelmed. If developers ensured 'aria-hidden' truly removed focusable elements, she could check out without stress.",
      "Ben, a retiree with Parkinson's using assistive tech, is trying to renew his driver’s license on a government portal. Because an offscreen navigation menu marked 'aria-hidden' still captures focus, he gets stuck in a loop. It makes him feel helpless. If the site respected the 'aria-hidden' setting, he could complete his task smoothly.",
      "Aisha, a visually impaired librarian, is browsing a book database with a screen reader. Because a hidden search filter is still reachable via tab, she gets sidetracked from her main task. It’s confusing and wastes her time. If those elements were excluded from keyboard focus, she could explore more easily.",
      "Marcus, a gamer with a spinal injury, is customizing his avatar on a gaming site. Because a hidden modal keeps focusable form elements, he ends up filling out the wrong form. It makes him feel defeated. If developers ensured hidden content can’t be focused, he’d feel more in control.",
      "Priya, a deaf user who relies on visual cues, is adjusting settings on a video platform. Because a hidden pop-up keeps the focus, keyboard navigation skips vital controls. She feels frustrated. If the hidden layer was excluded from tab order, she could access controls without confusion.",
      "Carlos, a delivery driver with limited dexterity, is scheduling deliveries using a logistics app. Because a hidden calendar retains active inputs, his keyboard focus gets misdirected. It causes delays and errors. If those inputs were truly hidden from focus, his workflow would be faster.",
      "Emma, a student with attention difficulties, is using an online learning portal. Because a hidden interactive tutorial still receives focus, she gets distracted and confused. It makes studying harder. If developers disabled focus within 'aria-hidden' content, she could stay focused on lessons.",
      "Tom, an office worker recovering from a broken arm, is using a government website one-handed. Because 'aria-hidden' dropdowns still receive focus, he navigates in circles. It’s exhausting. If hidden items were removed from the tab sequence, his experience would be much smoother.",
      "Nina, a senior with low vision, is shopping for a new phone online. Because hidden sections still accept tab focus, she’s led away from what she can see. It leaves her frustrated. If those elements were skipped in keyboard navigation, she could browse independently.",
      "Yuki, a college freshman using a screen magnifier, is registering for classes. Because focus jumps to hidden course descriptions, she loses track of where she is. It causes stress. If those elements were properly excluded from focus, she could stay oriented.",
      "Raj, an accountant using only a keyboard due to repetitive strain injury, is entering client data into a CRM. Because hidden fields remain in the tab order, he skips necessary fields unknowingly. It creates errors. If those fields were removed from focus, his work would be more accurate.",
      "Hannah, a part-time freelancer with dyslexia using a focus-enhancing browser plugin, is applying for gigs. Because hidden links receive focus, her plugin highlights irrelevant areas. It increases cognitive load. If those links were excluded from the tab order, she could navigate clearly.",
      "Liam, a blind high schooler, is using a tutoring platform. Because a hidden announcement banner still receives focus, his screen reader interrupts learning sessions. It’s distracting. If the banner was excluded from keyboard flow, he could learn uninterrupted.",
      "Joan, a retired teacher using a screen reader, is filing taxes online. Because a hidden FAQ drawer is focusable, she gets stuck reading hidden text. It makes her anxious. If those elements were skipped during tabbing, she could proceed confidently.",
      "Andre, a quadriplegic using a sip-and-puff device, is customizing a playlist on a music app. Because hidden elements capture focus, his device can’t advance smoothly. It makes listening frustrating. If focusable states matched visibility, he could navigate with ease.",
      "Grace, a young professional with mild cognitive impairment, is completing onboarding on an HR portal. Because hidden sections retain keyboard focus, she becomes confused about what’s expected. It delays her progress. If hidden content were unfocusable, she’d finish on time.",
      "Noah, a visually impaired writer, is editing posts on a blog platform. Because an offscreen toolbar marked 'aria-hidden' is still in the focus order, his screen reader constantly interrupts his writing. It’s distracting. If that toolbar were properly excluded from keyboard focus, he could concentrate better."
    ],
    "responsibility": ["developer"]
  },
  "aria-input-field-name": {
    "title": "ARIA Input Fields Missing Accessible Names",
    "summary": "Some input fields that use ARIA are missing accessible names, making them unusable for screen reader users. This causes confusion and prevents successful form completion.",
    "description": "ARIA input fields without accessible names result in users hearing generic or meaningless prompts like \"edit\" from their screen readers. This makes it hard to understand what information is expected, leading to user frustration or form abandonment. Screen reader users, voice control users, and others relying on assistive tech are especially impacted.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Form field has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/e086e5"
      }
    ],
    "supporting_links": [
      {
        "name": "W3C - ARIA Tutorials",
        "link": "https://www.w3.org/WAI/tutorials/forms/labels/"
      }
    ],
    "user_stories": [
      "Linda, a retired teacher with low vision, is trying to fill out a newsletter signup form on a community events website. Because one of the input fields lacks an accessible name, her screen reader just says 'edit' without any context. It makes her feel confused and unsure if she’s inputting her email or name. If the input field had a properly coded label, she could confidently complete the form.",
      "James, a university student who uses a screen reader, is trying to book tickets on a theater’s website. Because several ARIA input fields are unnamed, he can't tell what information is being requested. It’s frustrating and slows him down. If each field had a clear accessible name, he could navigate the form like anyone else.",
      "Mei, a busy mom who relies on voice input software due to a repetitive strain injury, is ordering groceries online. Because some ARIA fields are missing accessible names, her voice commands don’t work. It makes her feel powerless. If these fields were correctly labeled, she could shop using her voice with ease.",
      "Tomás, a delivery driver who recently lost his sight, is trying to schedule a package pickup using a courier app. Because the ARIA fields have no accessible names, his screen reader provides no useful guidance. It’s a barrier that makes him feel excluded. If all input fields had descriptive accessible names, he could complete the task independently.",
      "Ruth, an elderly woman learning to use a screen reader, is signing up for an online book club. Because the form’s ARIA input fields aren’t labeled properly, she hears blank or unclear prompts. It makes her anxious about making mistakes. If developers added accessible names, she’d feel more confident joining the group.",
      "Alex, a programmer with a hand tremor using speech recognition software, is trying to fill out a bug report form. Because fields lack ARIA labels, he can't reference them by name. It’s discouraging. If fields had accessible names, he could work more efficiently.",
      "DeShawn, a blind job seeker, is filling out an application on a job board. Because input fields are unnamed, his screen reader can't tell what to enter. It makes him worry about submitting incorrect info. If each field had an accessible name, he’d apply with confidence.",
      "Priya, a high school student with low vision, is entering a contest on a social media site. Because input fields aren’t labeled, she can't complete the form with her screen reader. It leaves her feeling left out. If ARIA fields had proper names, she could join in.",
      "Carl, an older veteran using assistive tech, is requesting medical records from a healthcare portal. Because the ARIA inputs are unlabeled, he’s unsure what to enter. It causes stress. If labels were accessible, he could access his records without assistance.",
      "Isabelle, a chef who lost her vision, is updating her food blog’s settings. Because the admin dashboard has ARIA inputs without names, her screen reader fails to guide her. It makes managing her site frustrating. If the fields were labeled, she could navigate freely.",
      "Nina, a student with dyslexia who also uses screen reader support, is registering for online classes. Because the ARIA input fields lack names, she can’t understand what info is needed. It makes her feel defeated. If proper labels were added, she’d be able to register on her own.",
      "Marco, a warehouse worker who recently became blind, is checking his benefits online. Because ARIA fields have no accessible names, his screen reader fails to guide him. It’s a barrier to his independence. Adding proper names would let him manage his benefits securely.",
      "Sofia, a young artist with motor impairments using voice control, is submitting a portfolio online. Because fields lack accessible ARIA names, she can’t use voice commands accurately. It delays her process. If labels were present, she could complete forms efficiently.",
      "Henry, a senior learning assistive tech, is subscribing to a digital magazine. Because input fields don’t have names, he hears meaningless labels from his screen reader. It makes him frustrated. Proper ARIA labels would give him clarity and control.",
      "Tariq, a new immigrant who relies on a screen reader while learning English, is registering for English classes online. Because form inputs are not named accessibly, he can’t complete the process. It leaves him feeling helpless. Properly labeled fields would enable his learning journey.",
      "Alina, a photographer with vision loss, is updating her portfolio site’s login. Because ARIA fields lack accessible names, her screen reader doesn’t guide her. She’s locked out. With correct labels, she’d regain control of her site access.",
      "Greg, a paralegal with motor disabilities using speech recognition, is submitting case notes through a legal software. Because fields have no accessible ARIA names, his commands don’t function. It hinders his workflow. Accessible names would restore his productivity.",
      "Fatima, a mother managing her child’s school account, uses a screen reader due to vision impairment. Because ARIA input fields lack names, she struggles with forms. It’s disheartening. With proper labeling, she could manage her child’s education with ease.",
      "Diego, a musician with limited vision, is trying to purchase concert tickets online. Because input fields don’t have accessible names, his screen reader gives no context. He feels blocked. If developers added names, he could enjoy events independently.",
      "Maya, a public health worker with vision loss, is inputting data into a government portal. Because of missing accessible names on ARIA fields, she can’t accurately submit reports. It undermines her work. Clear labels would empower her to serve her community better."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-meter-name": {
    "title": "ARIA Meter Elements Missing Accessible Names",
    "summary": "ARIA meter components are missing accessible names, making them unreadable to screen readers. This prevents users with visual impairments from understanding important progress indicators.",
    "description": "ARIA meters without accessible names do not convey any meaningful information to screen reader users. Visually, these elements may appear clear, but to users who are blind or have low vision, they are announced as generic or unknown objects. This leads to confusion and exclusion, especially in applications where tracking progress is essential—like fitness, education, finance, or work performance.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      }
    ],
    "act_rules": [],
    "supporting_links": [
      {
        "name": "W3C - ARIA Meter Pattern",
        "link": "https://www.w3.org/WAI/ARIA/apg/patterns/meter/"
      }
    ],
    "user_stories": [
      "Jonas, a college student who uses a screen reader due to blindness, is trying to track his progress on a fitness app. Because the ARIA meter showing his weekly goal completion lacks an accessible name, his screen reader skips over the meter or reads it as 'unknown element.' It makes him feel left out and uncertain about his progress. If the ARIA meter had a descriptive accessible name like 'Weekly Goal Completion,' he could easily understand how he's doing and stay motivated.",
      "Grace, a retiree with low vision, is reviewing her electricity usage on her utility provider’s website. Because the ARIA meter lacks a label, her screen reader can’t interpret what the gauge means. This leaves her unsure if she’s saving energy or not. If the meter had a clear name like 'Monthly Energy Usage,' she could understand and adjust her habits.",
      "Tariq, a software engineer who is blind, is checking his system’s performance on a devops dashboard. The ARIA meter shows CPU load but isn’t named, so his screen reader just says 'meter' with no context. This frustrates him because he can’t tell which metric is which. If the meter had an accessible name like 'CPU Load Meter,' he could monitor his systems independently.",
      "Nina, a high school student with a visual impairment, is trying to see her quiz score status on an educational app. Because the ARIA meter doesn’t have an accessible name, she can’t tell what the score indicator represents. It makes her feel lost and dependent on others. If the meter were labeled 'Quiz Completion Progress,' she’d feel more in control of her learning.",
      "Carlos, a delivery driver with blindness, uses an earnings tracker app to view his weekly income. The ARIA meter isn’t labeled, so the screen reader gives no meaningful output. He feels anxious about not knowing how close he is to his target. A label like 'Weekly Earnings Goal' would solve this.",
      "Lana, a pregnant mom using a health monitoring app, is trying to see her hydration levels. She uses a screen reader due to partial vision loss. The ARIA meter isn’t named, so it just reads as a blank or generic item. This adds to her stress. A clear label like 'Hydration Meter' would make a big difference.",
      "Derek, an office worker who lost his sight in an accident, is checking his progress in a wellness challenge through his company’s HR portal. The ARIA meter doesn’t have a name, so he has no idea what’s being tracked. He feels excluded. If the element were labeled 'Steps Toward Goal,' it would empower him to participate fully.",
      "Mei, a university student with low vision, is managing her workload on a student portal. She wants to track her study hours, but the ARIA meter has no accessible name. Her screen reader doesn’t help, leaving her unsure how much she has accomplished. If the meter had a name like 'Weekly Study Hours,' she’d be more productive.",
      "Ravi, a chef who is blind, is using a food delivery dashboard to track his kitchen’s output. The ARIA meter for order fulfillment isn’t labeled, so he can’t tell how they’re doing. It frustrates him and delays decision-making. Naming the meter 'Order Completion Rate' would solve this instantly.",
      "Beth, a social worker with a screen reader, is filling out performance reports on a government portal. The ARIA meter lacks an accessible name, so she can’t tell what it refers to. It makes her work harder than necessary. Adding labels like 'Casework Target Progress' would save time and reduce errors.",
      "Tom, a construction manager who is blind, is reviewing site performance metrics in an app. The ARIA meter meant to show 'Site Safety Score' isn’t labeled, so it’s useless to him. This puts him at a disadvantage. A proper label would help him act on safety issues.",
      "Kiana, a teen with low vision, is using a wellness app to improve her sleep. A meter shows progress toward a sleep goal, but her screen reader doesn’t recognize it due to a missing name. She feels left out of her own journey. A label like 'Sleep Goal Progress' would make it accessible.",
      "Ahmed, a small business owner who is blind, is managing ad campaigns on a marketing platform. The ARIA meter tracks engagement but isn’t named, so he can’t make informed choices. It costs him opportunities. If labeled 'Ad Engagement Meter,' he could improve his strategies.",
      "Jill, a gamer with vision loss, is reviewing her achievements in a game dashboard. The ARIA meter for experience points has no name, so she can’t track her level-ups. It diminishes her enjoyment. Adding a name like 'XP Progress' would fix this.",
      "Marco, a hospital admin who is blind, is checking resource usage on a facility dashboard. An unnamed ARIA meter shows bed occupancy, but it’s unreadable to his screen reader. It hampers his planning. A name like 'Bed Occupancy Rate' would restore clarity.",
      "Sofia, a fashion blogger with low vision, is reviewing her follower growth in an influencer app. The ARIA meter is visually appealing but has no name, so her screen reader ignores it. She misses key insights. A label like 'Follower Growth Meter' would help.",
      "Noah, a teacher with blindness, is checking student performance on an edtech platform. The ARIA meter for class progress has no name, making it inaccessible. This delays his feedback to students. If labeled 'Class Progress Meter,' it would streamline his work.",
      "Priya, a bank employee who uses a screen reader, is reviewing customer satisfaction scores on her internal dashboard. The ARIA meter is missing a name, rendering it meaningless to her. It makes her feel less capable. A label like 'Satisfaction Index' would enable her full participation.",
      "Omar, a city planner who is blind, is using a civic app to analyze traffic congestion. The ARIA meter for congestion level lacks a label, so he can’t interpret it. It impacts critical decisions. Adding a name like 'Traffic Load Meter' would resolve this.",
      "Ellie, a student with low vision, is using a scholarship portal to check her eligibility progress. The ARIA meter has no accessible name, leaving her in the dark. She feels anxious and uninformed. A label like 'Eligibility Completion' would give her clarity and confidence."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-progressbar-name": {
    "title": "ARIA Progressbar Lacks Accessible Name",
    "summary": "The ARIA progress bar does not include an accessible name, making it unreadable by assistive technologies. Users who rely on screen readers cannot understand what the progress bar is for.",
    "description": "ARIA progress bars without accessible names are announced generically as “progressbar” by screen readers, providing no additional context. This can lead users to feel confused, unsure whether an action is taking place or completed. For example, when uploading files or navigating multi-step forms, users need clear feedback like \"Uploading file\" or \"Step 3 of 5\" to stay oriented and confident.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      }
    ],
    "act_rules": [],
    "supporting_links": [
      {
        "name": "MDN - progressbar role",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Roles/progressbar_role"
      }
    ],
    "user_stories": [
      "Jamal, a high school student who is blind, is trying to track his exam upload progress on an education portal. Because the progress bar has no accessible name, his screen reader doesn’t announce what it is. It makes him feel frustrated and unsure if his work is being saved. If the progress bar had a clear ARIA label like 'Upload progress', he could confidently track the upload.",
      "Maria, a grandmother with low vision, is booking a vaccine appointment on a health site. Because the progress bar has no descriptive name, her screen reader just says 'progressbar' with no context. She feels confused and worries she’s not completing the steps correctly. If the progress bar was labeled 'Step 2 of 4: Choose Date', she would know where she is in the process.",
      "Dev, a freelance designer with dyslexia, is uploading large files to a client portal. The site uses an ARIA progress bar without a name. He relies on voice feedback but hears only vague tones. This makes him anxious about whether the upload is complete. If the progress bar included a label like 'Uploading design files', it would ease his workflow.",
      "Rita, a delivery driver with hearing loss, is filling out a form on a logistics site. The progress bar lacks an accessible name, and she uses screen readers for clarity. She misses that she's halfway through, which delays her job. If the bar was labeled 'Form completion: 50%', she could move forward confidently.",
      "Sam, a college student with a cognitive disability, is applying for financial aid. The site’s progress bar doesn’t explain its function. He gets stuck, unsure if he's done or waiting. This causes stress. If the progress bar said 'Processing your application', it would reassure him to wait.",
      "Lena, a retired nurse with glaucoma, is renewing her license online. Her screen reader doesn’t identify the progress bar because it's unnamed. She’s left wondering if her renewal is going through. If the progress bar had a label like 'Renewal in progress', she’d be more at ease.",
      "Omar, a recent immigrant with limited English, is submitting job applications online. The progress bar has no accessible name, so his translation tool can’t interpret it. He’s unsure what it’s tracking. If it said 'Resume upload status', his translation app could help him understand.",
      "Tyler, a new dad with a repetitive strain injury, uses voice navigation to manage forms. A progress bar without a name can’t be referenced by voice. He gets stuck and frustrated. If it was named 'Application progress', voice tools could let him check it hands-free.",
      "Chloe, a student with ADHD, uses screen readers to focus better. A silent, unnamed progress bar while uploading assignments leaves her confused and distracted. If the bar was labeled 'Upload in progress', she’d stay on track.",
      "Anand, a retiree learning tech, is registering for a community event. The progress bar lacks a label, and his screen magnifier shows no context. He feels unsure and keeps restarting. If the progress bar was named 'Step 3: Payment', it would guide him confidently.",
      "Grace, a busy single mom with hearing loss, is applying for housing aid online. The progress bar has no accessible label, so her screen reader gives no feedback. She doesn’t know if the system is working. If labeled 'Submitting documents', she’d be reassured to wait.",
      "Mike, a developer with a visual processing disorder, is buying concert tickets. He relies on ARIA labels to reduce visual overload. The unnamed progress bar forces him to guess if he’s done. If it was labeled 'Ticket selection step 2 of 3', he’d feel more in control.",
      "Eli, a warehouse worker with limited literacy, is filling out onboarding forms. The site uses a progress bar without descriptive text. He doesn’t know how many steps are left. If labeled '3 steps remaining', he’d know what to expect.",
      "Sofia, a teacher with tunnel vision, uses a screen reader to navigate forms. An unnamed progress bar provides no audible cue, leaving her unsure if her info is processing. If the bar was called 'Saving your responses', she’d be able to wait with confidence.",
      "Noah, a barista with dyslexia, uploads his resume via a job portal. The progress bar has no label, so voice tools don’t help. He’s unsure if his resume sent. If it said 'Resume uploading', his tools could narrate it properly.",
      "Isla, a high schooler with vision loss, is signing up for a music contest. The progress bar is unnamed and skipped by her screen reader. She feels uncertain and frustrated. If it was labeled 'Form progress: 60%', she’d know she’s on track.",
      "Ahmed, a veteran with PTSD, finds ambiguity in online forms triggering. An unnamed progress bar during a military benefits application adds stress. If it said 'Application step 2 of 5', it would provide grounding and clarity.",
      "Tina, a gig worker with low vision, is using a finance app to submit tax info. The app's progress bar isn’t labeled, and her screen reader skips it. She fears something went wrong. If the bar was labeled 'Uploading documents', she’d know it’s working.",
      "Luis, a bilingual parent using translation software, finds the unnamed progress bar unreadable. It doesn’t translate, leaving him confused mid-process. If labeled 'Progress: Document upload', it would be understandable across languages.",
      "Maya, a part-time student with a cognitive disability, gets overwhelmed by long forms. A clear, named progress bar would reassure her. Without it, she abandons tasks midway. If labeled 'Step 1 of 3: Contact Info', she’d feel guided and supported."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-prohibited-attr": {
    "title": "Invalid ARIA Attributes Applied to Non-Semantic Elements",
    "summary": "Some ARIA attributes are applied to elements that don't have roles that support them. This causes screen readers and assistive tools to misinterpret or ignore the content.",
    "description": "When ARIA attributes are applied to elements that don’t support them—such as using aria-selected on a <li> without a tab role—screen readers may ignore the state or convey misleading information. This results in a confusing or incomplete experience for users who depend on these tools.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA state or property is permitted",
        "link": "https://act-rules.github.io/rules/5c01ea"
      }
    ],
    "user_stories": [
      "Sofia, a blind podcast enthusiast, is trying to play episodes using a media website. Because the play button has an 'aria-pressed' attribute on a <span> without a role, her screen reader doesn't recognize it as a button. It makes her feel frustrated and excluded. If the site used a proper button element or added role='button', she could play content confidently.",
      "Marcus, a college student with low vision, is navigating a university portal. A section uses 'aria-expanded' on a plain <div> with no role, so his screen reader skips important state info. He misses key updates and feels overwhelmed. If developers applied a correct role like 'button' or used semantic HTML, he’d access everything clearly.",
      "Jill, a retired teacher with limited dexterity, is filling out an online form. A label has 'aria-checked' on a <div> not marked as a checkbox. Her voice control software doesn’t recognize the control, making submission impossible. She feels powerless. If the form used native checkboxes or correct roles, she could complete it easily.",
      "Omar, a visually impaired chef, is browsing recipes on a cooking app. Tabs use 'aria-selected' on <li> elements without roles. His screen reader misinterprets their function, causing confusion. He feels disoriented. If roles like 'tab' were applied properly, he'd navigate tabs without guessing.",
      "Leah, a deaf parent, is using a calendar site. The calendar uses 'aria-expanded' on <div>s without appropriate roles, so toggling events isn’t announced to her screen reader. She misses appointments and feels disorganized. If correct ARIA roles were implemented, she'd stay on top of events.",
      "Tom, a software engineer with a cognitive disability, is editing settings in an admin panel. The toggle switches use 'aria-checked' on non-interactive elements. His assistive tool skips these inputs, leaving him unable to confirm changes. He feels lost. Proper use of roles like 'switch' would help him stay in control.",
      "Nina, a teen with ADHD, is browsing an e-learning platform. Course cards use 'aria-hidden' incorrectly on active headings, hiding them from her screen reader. She gets confused about course titles and feels left behind. Correcting the misuse of ARIA would help her stay focused.",
      "George, an elderly man using a screen reader, is adjusting volume in a music app. Sliders use 'aria-valuenow' on <div>s without the 'slider' role. His reader doesn’t relay current volume, leaving him guessing. He feels annoyed. If sliders used valid roles, he'd adjust volume with confidence.",
      "Rina, a visually impaired artist, is updating her portfolio. The edit button has 'aria-pressed' on an anchor tag without a role. Her screen reader doesn’t treat it as a toggle, so she keeps re-clicking. She feels discouraged. Assigning role='button' would make her interface more usable.",
      "Leo, a college athlete recovering from a concussion, is reviewing schedules. Important headings have 'aria-hidden' improperly applied. His screen reader skips over sections, making planning difficult. He feels overwhelmed. If those ARIA attributes were removed or corrected, he’d follow along more easily.",
      "Grace, a busy single mom with low vision, is browsing online deals. The collapsible sections have 'aria-expanded' on spans with no interactive roles. Her screen reader ignores them, so she can’t access deal details. She feels excluded. With correct roles, she'd save time and money.",
      "Noah, a student with dyslexia using a text-to-speech tool, explores a course catalog. Navigation links have 'aria-current' on elements without roles, confusing the tool about current pages. He loses track of where he is. If roles like 'link' were added, his tool would work accurately.",
      "Ivy, a retired nurse with Parkinson’s, uses voice commands to operate an e-reader app. Buttons with 'aria-pressed' on plain divs are ignored, so she can’t bookmark passages. She feels defeated. If those buttons had proper roles or used semantic elements, voice tools would work correctly.",
      "Ali, a teen gamer with limited vision, is configuring his profile on a game site. Toggles use 'aria-checked' on non-checkbox elements, which his reader skips. He misses out on features. He feels frustrated. If developers used input elements or proper ARIA roles, he’d access all options.",
      "Maya, a graphic designer with colorblindness and screen reader usage, is viewing image galleries. Descriptions are hidden with 'aria-hidden' on active figure captions. Her screen reader skips vital info. She feels out of sync. If the attribute were removed or used properly, she'd enjoy the gallery fully.",
      "Jose, a bilingual learner using screen readers in English and Spanish, is navigating a job portal. Icons with state info misuse 'aria-selected' on <div>s. His tool can’t relay which job is active. He feels confused. If ARIA roles matched attributes, he'd follow the job status smoothly.",
      "Amara, a recent immigrant with limited tech experience, uses a text magnifier. Buttons styled with 'aria-pressed' on spans confuse her tool. She thinks nothing happened when clicking. She feels lost. If role='button' were added, her magnifier would track state changes clearly.",
      "Dylan, a remote worker with chronic fatigue, browses productivity apps using screen readers. Checklists misuse 'aria-checked' on untagged spans, skipping task status. He wastes time double-checking. He feels drained. Proper roles or inputs would help him conserve energy.",
      "Priya, a full-time caregiver with tunnel vision, explores a parent forum. Sections hide text with 'aria-hidden' on important content. Her screen reader misses key messages. She feels unheard. If ARIA were applied only where needed, she’d access all the community’s support.",
      "Henry, a visually impaired hobbyist coder, is browsing coding tutorials. Lesson steps use 'aria-current' on <li> elements with no list-related roles. His reader doesn’t announce current progress. He feels behind. If the correct list roles were used, he’d stay on track easily."
    ],
    "responsibility": ["developer"]
  },
  "aria-required-attr": {
    "title": "Missing Required ARIA Attributes on Elements with ARIA Roles",
    "summary": "Elements with ARIA roles are missing required attributes, causing confusion for users relying on screen readers or other assistive technologies.",
    "description": "Components such as modals, sliders, tooltips, or form inputs that implement ARIA roles must also include their associated required attributes. Omitting these attributes disrupts the user’s ability to understand what the component is and how to interact with it, leading to usability issues and potential abandonment of the task.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Element with role attribute has required states and properties",
        "link": "https://act-rules.github.io/rules/4e8ab6"
      }
    ],
    "user_stories": [
      "Maria, a grandmother with limited dexterity, is trying to select a delivery time on a grocery website. Because the ARIA role used for the time picker lacks necessary attributes, her screen reader doesn't announce available times. It makes her feel frustrated and helpless. If the component included all required ARIA attributes, she could confidently choose a delivery slot on her own.",
      "Darius, a blind university student, is trying to participate in a class forum using his screen reader. Because some interactive elements lack complete ARIA roles and properties, he can't tell which are buttons or links. This causes confusion and delays his assignments. If proper ARIA attributes were added, he could navigate and contribute without barriers.",
      "Leah, a deaf small business owner, is checking out customers on her e-commerce site. A modal dialog appears with missing ARIA attributes, so screen reader users can't identify it correctly. This leaves her anxious about her site's accessibility. If the modal had a proper ARIA role with labeled attributes, her customers could use it easily.",
      "Tom, a veteran with limited motor control, is booking a medical appointment online. Because the calendar has an ARIA role but is missing required states, he can't tell which days are selectable. This makes scheduling confusing and time-consuming. If the ARIA attributes were correctly implemented, he could book confidently.",
      "Sophie, a teenager with cognitive disabilities, is trying to follow instructions on a cooking app. A tooltip with essential steps doesn’t get announced due to missing ARIA attributes. She feels lost and demotivated. If the tooltip had the required ARIA roles and properties, she could complete the recipe independently.",
      "Raj, a visually impaired accountant, is filling out a tax form. Because a dropdown uses a custom ARIA role without required attributes, his screen reader can’t interact with it properly. This causes errors and wasted time. If the dropdown used valid ARIA attributes, he could complete the form efficiently.",
      "Nina, an artist with limited vision, is browsing an online art gallery. The image viewer uses ARIA roles but lacks required labels, so she can’t understand the context of what she’s viewing. She feels excluded from the experience. If the viewer included all necessary ARIA attributes, she could enjoy the artwork equally.",
      "Jorge, a retired teacher with Parkinson’s, is using a music streaming app. Because player controls use ARIA roles without states like 'pressed', he can't tell if shuffle is on. This makes him feel disoriented. If the controls had correct ARIA properties, he'd feel more in control of his experience.",
      "Camila, a busy mom with dyslexia, is trying to complete a form on a school portal. Interactive fields have ARIA roles but miss required names, so assistive tech can't describe them. She feels unsure and anxious. If the fields had accurate ARIA labels, she could complete the form with confidence.",
      "Ben, a game developer with a hearing disability, is exploring UI components for accessibility. He tests a slider that uses ARIA but lacks value attributes, making it uninformative for screen reader users. This frustrates him as a designer. If the slider had proper ARIA values, he could make it accessible for everyone.",
      "Angela, a freelance writer with limited sight, is navigating a blog dashboard. A custom menu uses ARIA but omits role-specific properties, so navigation is unclear. She ends up clicking wrong links. If each menu item included complete ARIA attributes, she could manage her content with ease.",
      "Malik, a father with a spinal injury, is reviewing his benefits on a government site. An expandable section uses ARIA roles without required properties, confusing his keyboard navigation. He feels stressed. If ARIA states like 'expanded' were correctly implemented, he could access the info smoothly.",
      "Tina, a college freshman with ADHD, is applying for internships on a career site. A job filter panel lacks necessary ARIA states, so she misses hidden options. She feels discouraged. If filters were properly labeled and announced, she could find more relevant jobs.",
      "Isaac, a retiree with glaucoma, is checking weather updates. The alert box uses ARIA but is missing required labels, so he doesn’t realize a severe warning is active. This endangers his safety. If the alert had the right ARIA attributes, he could stay informed and safe.",
      "Naomi, a middle schooler with a learning disability, is submitting homework on a classroom app. ARIA-implemented buttons are missing role descriptions, so her assistive tech skips them. She feels defeated. If buttons included proper ARIA naming, she could submit assignments without stress.",
      "Ethan, a delivery driver with partial blindness, is tracking packages in a logistics app. Because tabs use ARIA roles without the 'selected' attribute, he can’t tell which one he’s on. This causes delays. If the tabs included complete ARIA state attributes, he’d navigate faster.",
      "Grace, a retiree who uses a screen reader, is accessing her banking app. The transfer money form uses ARIA roles but omits essential labels, so she doesn't know where to input the amount. She feels nervous about making mistakes. If the fields had proper ARIA naming, she’d feel secure.",
      "Leo, a photographer with low vision, is setting privacy options on a photo-sharing site. A toggle switch has an ARIA role but lacks 'checked' status, so he doesn’t know if it's on or off. He worries about oversharing. If the toggle reflected its state with ARIA, he’d have peace of mind.",
      "Amanda, a yoga instructor with a visual impairment, is browsing class reviews. The rating widget uses ARIA but without value properties, so the star rating isn’t announced. She can’t gauge quality. If the widget had full ARIA values, she could choose classes confidently.",
      "Omar, a teenager recovering from eye surgery, is playing an educational game. Interactive puzzles use ARIA roles but lack required names and properties, so he struggles to understand game elements. He gets frustrated and gives up. If ARIA attributes were properly set, he’d stay engaged and learn better."
    ],
    "responsibility": ["developer"]
  },
  "aria-required-children": {
    "title": "ARIA Roles Missing Required Child Elements",
    "summary": "Some elements with ARIA roles are missing their required child roles, causing confusion for screen reader users. This makes key parts of websites inaccessible to people who rely on assistive technology.",
    "description": "Many interactive elements on web pages use ARIA roles to convey their purpose to assistive technologies. If these roles don’t include the required children, screen readers fail to relay accurate or complete information. This can affect everything from form completion to understanding multi-step processes.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA required owned elements",
        "link": "https://act-rules.github.io/rules/bc4a75"
      },
      {
        "name": "ARIA required context role",
        "link": "https://act-rules.github.io/rules/ff89c9"
      }
    ],
    "user_stories": [
      "Anita, a retired teacher who uses a screen reader due to vision loss, is trying to navigate a government benefits site. Because some ARIA roles on the site are missing the required child roles, her screen reader doesn’t announce key interactive elements properly. It makes her feel frustrated and unsure of what actions she can take. If developers ensured all ARIA roles included the proper required child elements, her screen reader could relay accurate information, making the experience clear and empowering.",
      "Ben, a college student with a congenital vision impairment, is applying for a summer internship on a job portal. Because the ARIA tabs used to organize the application steps lack the required child elements, his screen reader skips entire sections. This leaves him confused and worried he’ll submit an incomplete application. If the ARIA tabs were correctly structured with their required children, he’d be able to follow each step without missing crucial details.",
      "Clara, a mother with low vision, is shopping for groceries online. The collapsible menus for categories are built with ARIA roles but lack proper child components. Her screen reader announces the menu but doesn’t provide options to interact. She feels disoriented and gives up. If the developers used complete ARIA role hierarchies, Clara could browse the site independently.",
      "Darius, a young web developer who is blind, is reading tutorials on a coding site. However, some interactive code examples use ARIA roles without the required child roles, so his screen reader misses key information. He feels excluded from fully engaging with the content. If the components were built with all necessary ARIA children, he could participate equally in learning.",
      "Emily, a high school student with visual impairment, is signing up for an online art class. The registration form includes an ARIA group role but misses its child inputs. Her screen reader doesn’t detect the fields inside, making it impossible to complete the form. She feels discouraged. If the child roles were added correctly, she could sign up independently and confidently.",
      "Frank, a retired veteran who relies on a screen reader, is managing his prescriptions through a healthcare app. Because the navigation bar uses ARIA but is missing required submenu roles, he cannot access vital links. It causes stress and delays in managing his medications. If the navigation used proper ARIA structures, he could efficiently handle his prescriptions.",
      "Grace, a visually impaired chef, is reviewing recipes on a popular food blog. The site uses ARIA roles for the recipe steps but omits the necessary child roles. Her screen reader skips steps, leading to confusion. She feels frustrated and makes mistakes while cooking. If the ARIA roles included the proper children, she could cook along seamlessly.",
      "Hugo, a music teacher who is blind, is exploring a digital piano manual online. The ARIA accordion sections are incomplete without the required child panels, leaving out content his screen reader can’t access. He misses important setup steps and feels left behind. If developers implemented ARIA accordions fully, Hugo could access the entire manual clearly.",
      "Ivy, a visually impaired student, is accessing an academic portal. The dashboard uses ARIA widgets but lacks necessary nested roles. Her screen reader provides partial information, leaving her unable to find assignments. She feels anxious. If all widgets had the required ARIA children, she could manage her coursework independently.",
      "Jason, a blind entrepreneur, is reviewing analytics in a business dashboard. Some ARIA roles for graph navigation are missing key child elements, so he can't hear full chart descriptions. It hinders his decision-making. If the ARIA components were complete, Jason could understand his data just like his sighted peers.",
      "Kara, a marketing manager with vision loss, is trying to update her profile on a team platform. The ARIA form structure is broken—missing required children—so she can't locate fields with her screen reader. She feels disempowered. If developers ensured ARIA roles were properly nested, she could update her info effortlessly.",
      "Leo, a student with a congenital eye condition, is taking an online quiz. Because ARIA roles on the interactive elements don’t include all required children, his screen reader announces them incorrectly. He misunderstands the format and loses points. If developers fixed the ARIA structure, he could focus on answering questions correctly.",
      "Mina, a software engineer with vision impairment, is navigating a component library site. Demo components use ARIA roles but fail to include necessary child roles, making examples inaccessible. She feels excluded from her profession’s tools. If the ARIA roles were implemented completely, she could explore components like everyone else.",
      "Noah, a freelance writer with low vision, is exploring a publishing platform. Key ARIA roles used for article lists are incomplete, so his screen reader doesn’t announce headings or controls. He feels lost in the interface. If developers used all required child roles, he could manage his content easily.",
      "Olive, a blind community organizer, is accessing a local events calendar. The list uses ARIA list roles without the required child listitems, so events aren’t announced properly. She misses crucial info. If the ARIA structure was corrected, she could stay informed and active in her community.",
      "Paul, a retiree who is blind, is joining a virtual book club via a reading app. The app’s ARIA menus don’t include proper submenu roles, so he can’t find meeting links. It isolates him. If submenu roles were included, Paul could engage socially with ease.",
      "Quinn, a student with vision loss, is checking grades on a school portal. Grade tables use ARIA roles but lack required children, so the data isn’t read coherently by his screen reader. He feels uncertain about his progress. If ARIA roles were implemented correctly, he could track grades independently.",
      "Rita, a legal assistant with low vision, is browsing a case management tool. ARIA regions meant to organize case files omit required child roles, confusing her screen reader. She wastes time and risks misfiling. If developers fixed the ARIA structure, Rita could work more efficiently.",
      "Sam, a college instructor who is blind, is creating course modules in an LMS. The ARIA structure for drag-and-drop components is incomplete, so the screen reader can’t describe their function. He feels excluded from designing engaging content. With full ARIA child roles, Sam could create dynamic lessons.",
      "Tina, a visually impaired grandmother, is trying to RSVP for a family reunion via a community site. The ARIA form is missing child input fields, so her screen reader announces only part of the form. She worries about missing information. If the ARIA children were properly coded, she could submit her RSVP with confidence."
    ],
    "responsibility": ["developer"]
  },
  "aria-required-parent": {
    "title": "ARIA Roles Missing Required Parent Containers",
    "summary": "Some ARIA elements are missing their required parent roles, which causes assistive technologies to misinterpret the page structure. This leads to confusion for screen reader users.",
    "description": "When ARIA roles are used without their required parent containers, screen readers cannot interpret the intended structure of the interface. This results in disorganized or contextless announcements, frustrating users who rely on auditory cues to navigate. The issue affects usability across forms, navigation menus, lists, and more. Ensuring proper parent-child ARIA relationships will help provide a coherent experience for all users.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA required context role",
        "link": "https://act-rules.github.io/rules/ff89c9"
      }
    ],
    "user_stories": [
      "Lena, a college student who relies on a screen reader due to blindness, is trying to navigate a university portal to register for classes. Because some ARIA roles on the page are missing required parent elements, her screen reader doesn’t present the information in the correct structure. It makes her feel confused and anxious about missing deadlines. If the developers ensured that all ARIA roles were correctly nested within their required parent roles, Lena could navigate the portal confidently and complete her registration independently.",
      "Marcus, a retired teacher with vision loss, is using a local news app to read daily articles. Due to improperly nested ARIA roles, his screen reader announces elements out of context. This leaves him disoriented and frustrated. If developers ensured ARIA roles had their required parent containers, Marcus could enjoy reading the news without getting lost on the page.",
      "Jin, a freelance graphic designer with a cognitive disability, is using a portfolio site builder. Because of missing ARIA parent roles, assistive tools don't provide proper context for editable sections. This causes Jin to make errors in layout and feel overwhelmed. If the site used the correct ARIA parent-child structure, Jin could manage his projects with greater clarity and confidence.",
      "Aisha, a busy mom with partial blindness, is shopping for groceries on a mobile app. Because elements like ARIA menu items aren’t inside a proper parent menu, her screen reader reads them as isolated items. This makes her shopping experience slow and confusing. If the roles were correctly structured, Aisha could easily navigate categories and complete her order faster.",
      "Tom, a veteran who lost his sight, is checking his bank account online. Missing ARIA parent roles cause form elements to be announced without context, making it hard to complete transactions. He feels frustrated and insecure about managing his finances. With proper ARIA hierarchy, Tom could review his balance and pay bills confidently.",
      "Priya, a student with dyslexia who uses text-to-speech tools, is filling out a scholarship application. ARIA roles aren’t properly nested, so her tools skip important labels. She ends up submitting incomplete information and feels disheartened. If the form used correct ARIA parent-child roles, Priya could apply smoothly and focus on her goals.",
      "Luis, an accountant with low vision, is reviewing reports in a finance dashboard. Because ARIA table cells are not within a table role, screen readers can’t convey the structure. He feels annoyed and less productive. If developers used appropriate parent roles, Luis could interpret data efficiently.",
      "Nina, a small business owner with glaucoma, is using an appointment scheduling app. Improper ARIA nesting causes key navigation areas to be skipped. She misses available slots and feels discouraged. With correct ARIA parent relationships, Nina could manage her bookings with ease.",
      "Aaron, a teenager with blindness, is exploring college options on a school website. Without required ARIA parent roles, navigation menus don’t function well with his screen reader. He feels left out and stressed. If the roles were structured properly, Aaron could explore programs and plan his future.",
      "Gloria, a grandmother with macular degeneration, is trying to register for a virtual fitness class. ARIA roles are out of order, so form fields are not announced correctly. She feels flustered and gives up. With proper ARIA nesting, Gloria could sign up and stay active from home.",
      "David, a warehouse worker with vision impairment, is reporting a safety issue using a company intranet site. Because ARIA alert roles are used outside their required containers, his screen reader ignores them. He worries the alert isn’t submitted. With correct parent roles, David could confirm his message and stay safe.",
      "Emily, a high school teacher who is blind, is updating grades in a school platform. Some interactive elements are not announced because of missing ARIA parents. This makes her worry about making mistakes. With correct hierarchy, she could work efficiently and accurately.",
      "Ravi, a delivery driver with a learning disability, is using a logistics app to confirm deliveries. Missing ARIA structure causes the app to mislabel drop-down options. He feels uncertain and stressed. If ARIA roles were properly grouped, Ravi could complete his tasks without confusion.",
      "Tasha, a marketing analyst with tunnel vision, is analyzing customer feedback in a web dashboard. Improper ARIA nesting means the filters aren’t read out correctly. She ends up applying the wrong filters and feels frustrated. With proper ARIA role relationships, Tasha could gain insights faster.",
      "Isaac, a college student with visual impairment, is trying to join a class video call. ARIA dialog roles are missing required parents, making the join button unrecognizable to his screen reader. He feels left out. If the modal structure were correct, Isaac could participate on time.",
      "Yara, a nonprofit coordinator with low vision, is managing events on an organization’s website. Missing ARIA parents mean tooltips are not linked to their triggers. She gets confused about functions and wastes time. Proper ARIA nesting would allow Yara to work with clarity.",
      "Omar, a retiree with diabetic retinopathy, is filling out medical history on a clinic portal. Because ARIA list items are not inside list roles, the screen reader misreads instructions. He gets anxious about errors. Correct parent roles would let him review his details clearly.",
      "Sara, a freelance writer with visual processing disorder, is editing her blog. Some ARIA toolbar elements lack proper parent containers, so controls are inaccessible. She gets frustrated and loses work. Proper ARIA structure would help her format posts smoothly.",
      "Ben, a software tester who is blind, is auditing a travel booking site. Improper ARIA nesting causes inconsistencies in navigation, making it hard to report issues. He feels blocked. If roles followed ARIA guidelines, Ben could complete his review efficiently.",
      "Nadia, a project manager with a degenerative eye condition, is reviewing project tasks on a Kanban board. Because ARIA regions are misstructured, her screen reader fails to announce sections. She struggles to organize priorities. If ARIA roles were properly assigned, Nadia could manage her team effectively."
    ],
    "responsibility": ["developer"]
  },
  "aria-roles": {
    "title": "Invalid ARIA Role Attributes",
    "summary": "Some elements on the site are using invalid ARIA role values. These roles are not recognized by assistive technologies, causing key features to be ignored or misunderstood.",
    "description": "Assistive technologies like screen readers, screen magnifiers, and voice control systems rely on ARIA roles to understand web content. When elements use roles that do not exist or are not appropriate, users may be unable to interact with those elements. This issue creates barriers for a wide range of users, from those with vision impairments to those using alternative input devices.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Role attribute has valid value",
        "link": "https://act-rules.github.io/rules/674b10"
      }
    ],
    "user_stories": [
      "Linda, a retired teacher with a screen reader, is trying to check her pension balance on a government website. Because a key navigation link uses an invalid ARIA role, her screen reader skips it entirely. It makes her feel lost and anxious about managing her finances. If developers used only valid ARIA roles, she could navigate confidently and access her information without help.",
      "Marcus, a university student who is blind, is submitting an assignment on his school’s portal. The upload button uses an unrecognized role, so his screen reader doesn't identify it as clickable. This frustrates him and causes delays. If the role attribute used a valid value, Marcus could independently complete his tasks on time.",
      "Priya, a busy mom with low vision using a screen magnifier, is ordering groceries online. Because several items have ARIA roles that don’t exist, her assistive tech can't recognize them as selectable, making the process confusing. She feels stressed trying to buy essentials. If all role values were valid, her tech could properly interpret the interface.",
      "Tom, a deaf developer using keyboard navigation, is trying to adjust his account settings on a web hosting platform. The invalid ARIA role on the settings toggle prevents it from being focusable. He feels annoyed that he can’t use his usual tools efficiently. Valid ARIA roles would allow smoother keyboard interaction.",
      "Ella, a high school student with a cognitive disability, is registering for classes through her school’s website. The site uses a nonstandard role on the calendar picker, causing her screen reader to misinterpret the interface. She feels overwhelmed and confused. If the role were corrected, Ella could select her classes with less stress.",
      "Jorge, a delivery driver with dyslexia, uses text-to-speech tools to track his earnings. The dashboard uses a made-up ARIA role, so the tool doesn’t read part of his income summary. He feels unsure and disempowered. If developers adhered to valid roles, Jorge would understand his earnings clearly.",
      "Sandra, a senior with Parkinson’s using voice commands, tries to open a support chat on a health app. The chat button uses an invalid ARIA role, so her voice software doesn’t recognize it. She feels helpless and unable to ask for help. A valid role would let her activate it by voice.",
      "Tyler, a gamer with a mobility disability, is exploring a new game website. Because an important filter menu uses an unsupported role, it’s not reachable via keyboard. He feels frustrated missing key content. Using a valid ARIA role would restore full access.",
      "Amira, a chef with vision loss, uses a screen reader to browse recipes. A 'Save Recipe' button is marked with a role that isn’t valid, making it invisible to her screen reader. She misses important features and feels left out. If the button had a proper role, Amira could save recipes easily.",
      "Noah, a student with ADHD, is applying for internships through a job site. A form section uses an invalid ARIA role that disrupts screen reader flow. He feels distracted and overwhelmed. A valid role would help him stay focused and complete the form.",
      "Mei, a freelance artist who uses a Braille display, is checking messages on a creative platform. The chat component uses an incorrect role, so it doesn’t appear in her Braille feed. She feels isolated from her clients. Valid ARIA roles would keep her communication seamless.",
      "Ravi, a part-time tutor with low vision, accesses a lesson planner that misuses roles in its toolbar. His screen reader misinterprets the controls. He feels slowed down and inefficient. Correct ARIA roles would allow better planning and productivity.",
      "Julie, a customer with chronic fatigue, prefers keyboard navigation. On a shopping site, a modal with an invalid role doesn’t get announced or focused. She feels exhausted trying to figure out what changed. A proper role would announce the modal and reduce cognitive strain.",
      "Omar, a library volunteer with a hearing impairment, relies on captions and screen reader output. A book lookup tool misuses ARIA roles, making key elements unreadable. He feels discouraged doing his work. Valid roles would restore confidence and clarity.",
      "Clara, a new mom with vision impairment, tries to refill a prescription online. The form’s submit button is marked with an unrecognized role, so her screen reader skips it. She feels anxious about missing medication. A valid role would ensure critical actions are not overlooked.",
      "Daniel, an avid reader with dyslexia, uses read-aloud tools on a blog. Some post controls have custom ARIA roles that are invalid, making them unresponsive to his software. He feels excluded from interacting. Valid roles would restore full participation.",
      "Sophie, a college freshman with anxiety, uses accessibility features to stay organized. On her university portal, invalid ARIA roles in the navigation confuse her screen reader. She feels overwhelmed navigating her classes. Proper roles would offer her a calm, accessible structure.",
      "Kevin, a mechanic with low dexterity, uses switch controls to navigate apps. A car repair app has invalid roles on key actions, making them unreachable. He feels blocked and frustrated. Using standard ARIA roles would make his navigation tools work properly.",
      "Nina, an HR coordinator with a visual impairment, manages interviews on a hiring platform. Calendar slots use an unsupported role, making them invisible to her screen reader. She feels ineffective at her job. Valid roles would ensure she can schedule interviews accurately.",
      "Leo, a podcast producer who is blind, edits episodes using a web tool. The timeline markers use invalid ARIA roles, causing screen reader misbehavior. He feels slowed down in his workflow. Correct roles would let him edit with precision and confidence."
    ],
    "responsibility": ["developer"]
  },
  "aria-toggle-field-name": {
    "title": "ARIA toggle controls missing programmatic labels",
    "summary": "Without proper ARIA names, toggle buttons are announced as “button” or “switch” without context, making them unusable for people using assistive technology.",
    "description": "Accessible names are essential for interactive controls like toggle switches. Without them, assistive tech users cannot understand what a control does, which makes using forms and settings difficult or impossible. This affects people using screen readers, voice assistants, or keyboard navigation. Adding clear ARIA labels ensures these users can interact with toggles meaningfully and with confidence.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Form field has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/e086e5"
      }
    ],
    "user_stories": [
      "Maria, a retired teacher with low vision, is trying to subscribe to a newsletter on a lifestyle blog. Because the toggle for email updates has no accessible name, her screen reader only says 'button' with no context. It makes her feel unsure and excluded. If the toggle had a clear ARIA label like 'Subscribe to email updates', she could confidently complete the form.",
      "James, a delivery driver with dyslexia, is updating his notification preferences on a gig app. Because the toggle fields aren’t labeled, he can’t tell which option is on or off. It frustrates him and makes the settings feel inaccessible. If the toggles had visible labels and ARIA names, James could understand and control his preferences more easily.",
      "Lena, a college student who uses voice control, is trying to adjust privacy settings on a social media site. Because the ARIA toggles don’t have names, her voice assistant can’t select them. It makes her feel helpless. If each toggle had a programmatically labeled name, she could manage her account without needing a mouse.",
      "Ahmed, a blind accountant, is reviewing bank notification settings on a finance app. Because the toggles don’t have ARIA labels, his screen reader announces them as 'button, button'. He feels confused and worried about making mistakes. If the toggles were named, like 'Enable transaction alerts', he could manage his settings with confidence.",
      "Grace, a grandmother with limited tech experience and mild cognitive issues, is setting up a new health portal. Because the toggles for preferences don’t have labels, she doesn't understand what she’s agreeing to. She feels overwhelmed. If each toggle had both a visible and accessible name, Grace could proceed with less stress.",
      "Darnell, a veteran with a tremor and low vision, is managing his appointment reminders on a clinic app. Because the toggles have no accessible names, his screen reader gives no useful feedback. It makes him feel left out of digital care. If ARIA labels described the toggles, he could manage his schedule more independently.",
      "Tina, a high school teacher with hearing loss, is adjusting accessibility settings on a video learning platform. She uses screen reader backup, but the toggle for auto-captioning has no accessible name. It confuses her and delays her lesson prep. If the toggle were labeled 'Auto-caption videos', Tina could use the tool efficiently.",
      "Robert, a senior with limited mobility who uses a switch device, is trying to turn on dark mode in a news app. Because the toggle button lacks a name, his assistive device skips over it. He feels disempowered. If the toggle had an ARIA name like 'Enable dark mode', Robert could easily customize his view.",
      "Emily, a new mom navigating a parenting app with one hand and a screen reader, is setting notification filters. Because the toggles aren’t labeled, she can’t tell what she’s enabling. She feels frustrated and rushed. If each toggle had an ARIA name tied to its purpose, Emily could use the app with clarity.",
      "Raj, a software tester with low vision, is checking out accessibility features in a product dashboard. Because toggles are missing ARIA names, he can’t verify what they do with screen readers. He feels blocked in his work. If each toggle field had a descriptive name, Raj could test them effectively.",
      "Nina, a fashion blogger with dyslexia, is choosing alert preferences on a shopping app. The toggle fields are unlabelled, and the icons alone aren’t clear to her. It makes her anxious about missing updates. If the toggles had ARIA names and clear text labels, Nina could navigate with ease.",
      "Paul, a retiree who uses large text and screen reading, is trying to mute sounds in a meditation app. The toggle appears visually but isn’t labeled for assistive tech. He feels discouraged from using the app. If the ARIA name said 'Mute app sounds', Paul could control it independently.",
      "Jasmine, a marketing manager with low vision, is customizing team notifications on a project tool. Without accessible names on toggle switches, her screen reader offers no context. She feels slowed down in her work. If those toggles had descriptive ARIA labels, Jasmine could complete her setup efficiently.",
      "Carlos, a gamer with motor challenges who uses keyboard nav, is adjusting in-game alerts in a settings menu. Because the toggles aren’t labeled, tabbing through them gives no useful audio. He feels left behind. If ARIA labels described each toggle’s function, Carlos could make changes more smoothly.",
      "Anna, a visually impaired student, is using a library app to control email alerts for book returns. Without accessible names, the toggles are meaningless to her screen reader. It stresses her out. If each toggle had an ARIA name like 'Send return reminders', Anna could manage her preferences.",
      "Tim, a freelance writer with cognitive fatigue, is setting focus modes on a productivity app. The unlabeled toggle controls make him guess their function. It adds unnecessary strain. If those toggles had both visible and ARIA names, Tim could interact with them with more certainty.",
      "Monica, a busy mom with partial sight, is trying to control bedtime notifications on a parenting app. Because the ARIA toggle is unnamed, her reader only says 'switch'. She feels unsure if she’s helping or harming her child’s setup. If the toggle had a name like 'Enable bedtime alerts', Monica could act with confidence.",
      "Leo, a senior with age-related vision loss, is configuring home automation alerts on a smart home site. The toggle fields have no accessible names, so his screen reader can’t interpret them. He feels dependent on others. If the toggles were clearly labeled, Leo could manage his home independently.",
      "Aisha, a visually impaired entrepreneur, is setting up order notifications on an e-commerce dashboard. The toggle fields don’t have ARIA names, making screen navigation tedious and unclear. She feels held back in her workflow. If toggles had accessible names like 'Notify on new order', Aisha could stay on top of her business.",
      "Ken, a retiree learning screen reader navigation, is adjusting update settings on a weather app. The toggle lacks an accessible name, making it impossible for him to learn what it controls. He feels discouraged. If each toggle had a descriptive ARIA name, Ken could build confidence using the app."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-tooltip-name": {
    "title": "ARIA Tooltips Missing Accessible Names",
    "summary": "Tooltips that use ARIA attributes are missing descriptive labels, so screen reader users can't access the help text. This creates confusion and disrupts task completion.",
    "description": "Tooltips designed with ARIA attributes are missing accessible names, which means screen readers cannot communicate their content to users. This issue impacts blind and low vision users who depend on these cues to understand UI elements. As a result, users may feel confused or excluded when interacting with icons or buttons that rely on these tooltips for explanation. Adding descriptive ARIA labels ensures that tooltips are announced clearly, providing equal access to information.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "supporting_links": [
      {
        "name": "W3C - ARIA Tooltip Pattern",
        "link": "https://www.w3.org/WAI/ARIA/apg/patterns/tooltip/"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Maria, a retired teacher with low vision, is trying to understand the icons on a health insurance portal. Because the ARIA tooltips for the icons don't have accessible names, her screen reader just announces 'tooltip' without context. It makes her feel confused and frustrated, especially when trying to understand her benefits independently. If each tooltip had a clear and descriptive accessible name using ARIA attributes, she could confidently navigate the site and make informed decisions about her healthcare.",
      "Jason, a college student who is blind, is using an online learning platform to submit an assignment. The submission button has a tooltip meant to explain the deadline, but the ARIA tooltip lacks an accessible name. His screen reader can't announce the information, leaving him unsure about the deadline. This causes stress and uncertainty. If the tooltip included a proper ARIA label, he would feel reassured and better able to meet his academic obligations.",
      "Anita, a busy mom with low vision, is shopping for groceries online. When she hovers over icons meant to provide product details, the ARIA tooltips don't have accessible names. Her screen reader fails to explain the ingredients, making her feel frustrated and hesitant to purchase. If the site added descriptive labels to these tooltips, she could shop with confidence and make safe choices for her family.",
      "Tariq, a deaf web developer, is testing an app for accessibility. When inspecting tooltips using his screen reader, he notices that several ARIA tooltips are unlabeled. This oversight prevents screen readers from announcing the tooltip content, which he knows limits access for blind users. It makes him disappointed in the lack of inclusivity. If developers implemented proper ARIA naming, the tooltips would benefit all users, including those using assistive tech.",
      "Eleanor, a retired librarian with glaucoma, is renewing her driver’s license online. She relies on a screen reader, but the tooltip explaining document upload requirements is missing an accessible name. She's confused and unsure how to proceed. This makes her feel anxious and dependent. If the tooltip had a meaningful ARIA label, she could complete the renewal herself and maintain her independence.",
      "Luis, a small business owner with macular degeneration, is applying for a grant using a government website. Tooltip icons next to form fields are unlabeled, so his screen reader skips over important instructions. This creates delays and uncertainty. He feels discouraged by the lack of support. If those tooltips had accessible names, he could accurately complete the application and focus on growing his business.",
      "Sherry, a freelance writer with low vision, is checking her bank transactions online. Icons for transaction types have tooltips that aren't properly labeled for screen readers. She's left guessing the meaning, which leads to mistakes in tracking her finances. It causes stress and lack of trust in the service. Properly named tooltips would let her manage her money independently and with confidence.",
      "Omar, a recent graduate who is blind, is setting up a retirement account on a financial app. Tooltip explanations for complex terms lack accessible ARIA names, leaving him puzzled. He feels excluded and fears making poor decisions. If the tooltips used ARIA labels to convey information clearly, he could make informed financial choices like his sighted peers.",
      "Jill, a high school teacher with cataracts, is ordering school supplies online. When hovering over icons for shipping policies, her screen reader doesn't read the tooltip text due to missing labels. This leads to confusion and missed delivery dates. She feels inconvenienced. Adding accessible names to tooltips would help her stay organized and avoid unnecessary stress.",
      "Raj, a father of two who is blind, is using a parenting website to find childcare resources. Tooltip icons next to resource links don’t have descriptive ARIA names, so his screen reader skips them. He feels lost and frustrated. Adding proper labels would allow him to explore content with confidence and support his family better.",
      "Grace, a senior with macular degeneration, is using a patient portal to check her lab results. Tooltips next to medical abbreviations are unlabeled, so her screen reader doesn’t provide explanations. She feels anxious and uninformed. If these tooltips had accessible names, she could better understand her health data without needing assistance.",
      "Tommy, a teenager who is blind, is using a gaming platform to chat with friends. Tooltip icons for emoji and chat controls are missing accessible names. His screen reader can't announce what they do, making him feel left out. Proper ARIA labeling would allow him to fully participate in social interactions and enjoy the platform.",
      "Naomi, a project manager with low vision, is navigating a task management app. Tooltip icons meant to explain task status are not labeled for screen readers. She misses important context and feels inefficient. If those tooltips had ARIA labels, she could stay on top of her projects and work more effectively.",
      "Phil, an IT consultant with glaucoma, is exploring a client’s new software. Tooltip hints for icons are visually helpful but lack accessible names, leaving screen reader users confused. Phil feels concerned for his client’s users. By implementing proper ARIA tooltip names, the product would become more inclusive and user-friendly.",
      "Lena, a nonprofit volunteer who is blind, is using a donation tracking tool. Tooltip explanations for certain filters are not accessible, and her screen reader skips them. She’s frustrated and unable to properly categorize donations. If tooltips included clear, labeled ARIA names, she could use the tool efficiently and help her organization more.",
      "Drew, a journalist with low vision, is updating his profile on a news site. The settings icon includes a tooltip with important info, but it's not labeled for screen readers. He misses critical customization options and feels undervalued. Adding accessible names to tooltips would ensure equitable access to all users.",
      "Simone, a law student who is blind, is accessing her exam schedule on a university portal. Tooltip icons for course info are missing accessible names, and her screen reader announces nothing. She feels frustrated and disadvantaged. With descriptive ARIA labels, she could prepare effectively and focus on her studies.",
      "Bryce, a retiree with vision impairment, is comparing insurance quotes online. Tooltip explanations for plan features aren’t accessible, leaving him confused and hesitant. This causes stress about choosing the right coverage. If tooltips had ARIA names, he could make confident, informed decisions.",
      "Maya, a food delivery worker with low vision, is using an app to review customer instructions. Tooltip icons meant to explain symbols lack accessible names, so her screen reader can’t read them. She feels uncertain and rushed. Adding clear ARIA labels would improve accuracy and reduce delivery stress.",
      "Noah, a college sophomore who is blind, is applying for a scholarship. Tooltip descriptions next to eligibility criteria are not accessible, and his screen reader skips over them. He feels left out and fears disqualification. Accessible ARIA-named tooltips would ensure he understands all requirements and can apply fairly."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-valid-attr-value": {
    "title": "Invalid ARIA Attribute Values",
    "summary": "Some ARIA attributes are using values that are not valid, which causes assistive technologies like screen readers to misinterpret them.",
    "description": "Invalid ARIA attribute values prevent assistive technologies from recognizing the intended purpose or state of elements. This means that screen readers may skip important buttons or convey misleading information, leaving users like Erik unsure how to interact with the interface.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA state or property has valid value",
        "link": "https://act-rules.github.io/rules/6a7281"
      }
    ],
    "user_stories": [
      "Erik, a blind podcaster who navigates the web with a screen reader, is trying to book a recording studio on a venue’s website. Because an ARIA attribute on the booking button has an invalid value, his screen reader doesn’t announce it properly. It makes him feel frustrated and uncertain, unsure whether the button works or what it does. If developers used valid ARIA values that are recognized by assistive technologies, Erik could confidently complete his booking without assistance.",
      "Lena, a college student with dyslexia, is trying to sign up for an online newsletter. Because the form uses placeholder text instead of visible labels, she struggles to remember what each field is for once she starts typing. It makes her feel confused and hesitant. If the site provided persistent, clearly labeled form fields, Lena could sign up quickly without second-guessing herself.",
      "Tomás, a retired grandfather with low vision, wants to order groceries online. Because the text contrast on the checkout page is too low, he can’t easily read product prices. It leaves him feeling disoriented and worried he might overspend. If the text met WCAG color contrast standards, Tomás could shop confidently and independently.",
      "Nina, a deaf museum volunteer, is trying to watch a training video on the staff portal. Because the video lacks captions, she misses key instructions. It makes her feel excluded and less capable at work. If accurate captions were provided, Nina could fully understand the training and feel more valued as a volunteer.",
      "Raj, a delivery driver with limited mobility, is trying to update his availability using a scheduling app. Because the clickable targets are small and close together, he struggles to tap the right option. It frustrates him and slows down his day. If the app used larger, well-spaced touch targets, Raj could update his schedule with ease.",
      "Sophie, a high school student with ADHD, is applying for a summer internship online. Because the application page times out without warning, she loses her progress while reviewing her answers. It leaves her feeling defeated and stressed. If the site gave a timeout warning or auto-saved input, Sophie could complete her application successfully.",
      "Marcus, a freelance illustrator with color blindness, is exploring a design marketplace for new tools. Because key statuses are indicated only by color, he can’t tell if his purchases went through. It makes him feel confused and unsure. If icons or text labels were added alongside color, Marcus could clearly understand his order status.",
      "Alice, a retired teacher with arthritis, is browsing a news site on her tablet. Because the site requires precise gestures to open menus, she struggles to access different sections. It makes her feel physically strained and discouraged. If simpler, tap-friendly controls were implemented, Alice could navigate the site more comfortably.",
      "Omar, a job seeker with anxiety, is trying to register for a job fair online. Because of vague error messages when submitting his form, he doesn’t know what went wrong. It makes him feel overwhelmed and uncertain. If the form provided specific, clear error messages, Omar could fix issues quickly and submit with confidence.",
      "Claire, a stay-at-home mom with hearing loss, is trying to join a parenting webinar. Because the platform’s interface doesn’t indicate when someone is speaking, she finds it hard to follow discussions. It makes her feel left out. If speaker indicators or live transcripts were included, Claire could participate more actively.",
      "Victor, a gamer with limited dexterity, is customizing his profile on a streaming platform. Because drag-and-drop is the only way to rearrange panels, he struggles to complete the setup. It makes him feel restricted. If keyboard or button-based controls were also available, Victor could personalize his layout without difficulty.",
      "Maya, a teacher with vision loss, is reviewing student submissions on a learning platform. Because the platform uses icons without text labels, her screen reader doesn’t convey their meaning. It makes her feel inefficient and frustrated. If icons had proper ARIA labels, Maya could grade papers more effectively.",
      "DeShawn, a cashier with cognitive disabilities, is checking his work schedule online. Because the site uses dense tables without headings or cues, he can’t easily find his shifts. It makes him feel overwhelmed. If the tables were properly structured with headers and cues, DeShawn could check his schedule independently.",
      "Elise, a writer with migraines, is updating her portfolio website. Because it uses rapid animations and auto-playing content, she feels dizzy and has to stop. It makes her feel physically ill and frustrated. If the site respected reduced motion preferences and avoided autoplay, Elise could update her content comfortably.",
      "Andre, a warehouse worker with low vision, is checking his benefits on a company portal. Because the interface doesn’t support zoom without breaking layout, he can’t read critical information. It makes him feel helpless. If the site was responsive and zoom-friendly, Andre could access his benefits clearly and independently.",
      "Gloria, a grandmother with early-stage dementia, is trying to order her prescriptions online. Because the navigation changes every time she visits, she gets confused and often gives up. It makes her feel disoriented and anxious. If the site maintained consistent structure and cues, Gloria could reorder with confidence.",
      "Kenji, a tech-savvy retiree who is blind, is managing his bank account online. Because ARIA roles are used incorrectly, his screen reader skips key buttons. It makes him feel vulnerable and unsure about his finances. If proper ARIA roles were used, Kenji could safely manage his money without help.",
      "Zahra, a new mom with carpal tunnel syndrome, is signing up for a parenting class online. Because form fields don’t support autofill, she has to type the same information repeatedly. It causes physical discomfort. If the form supported browser autofill, Zahra could complete it faster with less pain.",
      "Leo, a marketing intern with dyscalculia, is trying to compare pricing plans on a software site. Because the numbers are densely packed without visual aids, he struggles to interpret them. It makes him feel anxious. If visual comparisons or charts were used, Leo could make decisions more easily.",
      "Beatriz, a small business owner with limited English proficiency, is registering for a vendor account. Because the language used is full of jargon and lacks translation, she doesn’t understand the terms. It makes her feel excluded and insecure. If plain language and translation options were provided, Beatriz could sign up with confidence."
    ],
    "responsibility": ["developer"]
  },
  "aria-valid-attr": {
    "title": "Invalid ARIA Attributes",
    "summary": "The site includes non-standard ARIA attributes like aria-clicked or aria-visible, which are not recognized by assistive technologies. As a result, users who rely on screen readers may miss important cues or actions.",
    "description": "ARIA attributes must conform to the WAI-ARIA specification to ensure assistive technologies interpret them correctly. When invalid attributes like aria-nextstep, aria-zoomed, or aria-clicked are used, screen readers either ignore them or miscommunicate their purpose. This disrupts user interactions—especially for critical actions like submitting forms or navigating menus—and can lead to errors or incomplete tasks. People who are blind or have low vision are particularly affected, as they rely entirely on semantic cues to navigate and understand the page.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "ARIA attribute is defined in WAI-ARIA",
        "link": "https://act-rules.github.io/rules/5f99a7"
      }
    ],
    "user_stories": [
      "Sandra, a retired teacher with vision loss, is trying to check out on an e-commerce site using her screen reader. Because a button has an invalid 'aria-clicked' attribute instead of 'aria-pressed', her screen reader doesn't announce its function. It makes her feel confused and unsure if she’s placed her order. If valid ARIA attributes were used, she could confidently complete her purchase without sight.",
      "Jamal, a college student who relies on a screen reader due to blindness, is filling out a scholarship form online. Because several form fields use non-existent ARIA attributes like 'aria-filled', he doesn't hear proper cues about what each field requires. It frustrates him and wastes time. If developers used only valid ARIA attributes, Jamal could fill out the form independently and efficiently.",
      "Nina, a visually impaired musician, is browsing a concert ticket website. A menu uses 'aria-expand' instead of 'aria-expanded', so her screen reader doesn't indicate whether the dropdown is open. She feels lost in navigation. If the correct ARIA property were used, Nina could easily understand and interact with the menu.",
      "Carlos, a delivery driver who is colorblind and uses a screen reader, is managing his work schedule on an app. A calendar component includes 'aria-available' instead of valid indicators, so he doesn’t get feedback about date availability. It leads to booking errors. If valid ARIA attributes were used, Carlos could clearly identify which dates are open.",
      "Mei, a restaurant manager with low vision, is editing her business profile on a platform. The 'save' button has 'aria-submit' instead of 'aria-pressed', causing her screen reader to ignore it. She fears her updates aren't being saved. If the correct ARIA attribute were used, Mei would receive clear feedback and feel more secure in her updates.",
      "Aiden, a teenager with dyslexia who uses text-to-speech tools, is trying to like a post on a social app. The 'like' toggle uses 'aria-liked'—an invalid attribute—so his assistive tech doesn’t acknowledge the button. It leaves him confused. If developers used standard ARIA roles and states, Aiden would interact with the app more easily.",
      "Fatima, a blind community organizer, is signing a petition online. The submit button has an invalid 'aria-complete' attribute, so her screen reader skips it. She misses the final step, which discourages her. If valid ARIA attributes were used, Fatima could successfully advocate for her causes without barriers.",
      "George, a retiree with macular degeneration, is managing his banking account online. A toggle switch uses 'aria-on' instead of 'aria-checked', so he can’t confirm if notifications are on. It makes him anxious about missing alerts. If standard ARIA attributes were used, George would have peace of mind.",
      "Tasha, a graphic designer with limited vision, is submitting a portfolio through a web form. Several fields misuse ARIA roles, like 'aria-requiredfield' instead of 'aria-required', causing her screen reader to miss important instructions. It leads to incomplete submissions. If correct ARIA attributes were used, Tasha could confidently showcase her work.",
      "Ethan, a visually impaired gamer, is configuring settings in an online game dashboard. One of the toggles has 'aria-activated' instead of a valid attribute. His screen reader doesn’t convey its status. It disrupts his gameplay. If valid ARIA states were used, Ethan could enjoy his games without confusion.",
      "Priya, a mom with vision impairment, is ordering groceries online. The 'Add to Cart' buttons use 'aria-added', which her screen reader can’t interpret. She’s unsure if her selections are being processed. If correct ARIA roles were used, Priya could shop confidently and efficiently.",
      "Leo, a blind software tester, is reviewing a new internal dashboard. Multiple widgets use invalid ARIA roles like 'aria-card' or 'aria-box', breaking compatibility with his screen reader. He can’t perform a proper audit. If only valid ARIA roles were used, Leo could provide accurate accessibility feedback.",
      "Isabel, a retired librarian with glaucoma, is registering for an online class. The 'continue' button uses 'aria-nextstep'—an undefined attribute—so her screen reader skips over it. She misses the deadline. If proper ARIA attributes were used, Isabel could register independently and on time.",
      "Miles, a programmer who is blind, is setting preferences on a development platform. An accordion control uses 'aria-collapsable', which doesn’t work with his screen reader. He can’t tell if content is expanded. If 'aria-expanded' were used instead, Miles could navigate content easily.",
      "Zara, a digital marketer with low vision, is trying to change her password. The site uses 'aria-visible' on modal pop-ups—an invalid attribute—so her screen reader doesn’t detect the password form. She feels frustrated and stuck. If developers used valid ARIA markup, Zara could complete essential tasks independently.",
      "Noah, a grad student with retinitis pigmentosa, is using a university portal to upload documents. Buttons labeled with 'aria-send' instead of 'aria-pressed' aren't recognized by his screen reader. He thinks the upload failed. If the ARIA roles were valid, Noah would avoid confusion and delays.",
      "Lena, a blind HR professional, is updating job listings on a hiring platform. Job status toggles use 'aria-open' rather than 'aria-expanded', so her screen reader doesn’t relay their state. She mismanages postings. If standard ARIA roles were applied, Lena could manage listings confidently.",
      "Drew, an artist with low vision, is browsing an online gallery. The image viewer uses non-standard ARIA attributes like 'aria-zoomed', which his assistive tech can’t interpret. He misses key functionality. If valid ARIA markup were used, Drew could fully enjoy the gallery experience.",
      "Chloe, a social worker with vision loss, is filling out a government benefits form. Misused ARIA attributes like 'aria-valid' instead of 'aria-invalid' cause screen reader miscommunication. She unknowingly submits incorrect info. If correct attributes were used, Chloe could apply with accuracy and confidence.",
      "Raj, a senior with glaucoma, is accessing a health portal to view test results. Important links use invalid ARIA roles like 'aria-link', making them invisible to his screen reader. He misses updates about his health. If valid ARIA roles were used, Raj could stay informed about his care."
    ],
    "responsibility": ["developer"]
  },
  "blink": {
    "title": "Avoid Using <blink> Elements",
    "summary": "Blinking text can distract or even harm users with ADHD, epilepsy, or sensory sensitivities. Replace <blink> elements with static or less intrusive alternatives.",
    "description": "The <blink> HTML tag creates rapidly flashing content, which can severely impact users with epilepsy, ADHD, anxiety, or cognitive conditions. These users may be distracted, overwhelmed, or even physically harmed by this motion. A static or non-animated presentation of the same content would allow for a more focused and accessible user experience.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.2.2 Pause, Stop, Hide",
        "link": "https://www.w3.org/TR/WCAG22/#pause-stop-hide"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - blink element",
        "link": "https://developer.mozilla.org/en-US/docs/Glossary/blink_element"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Elias, a student with ADHD, is trying to read an article. The blinking headline distracts him, making it hard to focus. If the site used static text instead, he could concentrate better.",
      "Maya, a teacher with epilepsy, visits a school site with blinking banners. The flashing triggers discomfort and forces her to leave. If the site avoided blink effects, she'd feel safer browsing.",
      "Jonas, a truck driver with cognitive fatigue, checks traffic updates on an app. Blinking alerts overwhelm him. A steady, non-blinking alert would be easier to process.",
      "Priya, a mom with anxiety, opens a parenting blog. Flashing promotions make her uneasy. Removing blink elements would create a calmer reading space.",
      "Terry, a senior with slow processing speed, reads the weather forecast. Blinking temperatures confuse him. A simple highlight would help him understand at his pace.",
      "Sasha, a writer with dyslexia, tries to read a news page. Blinking ads constantly pull her eyes away. If animations paused or stayed static, she'd stay focused.",
      "Luis, a café owner with migraines, looks at an ordering site. Blinking deal banners trigger a headache. Static graphics would let him use the site pain-free.",
      "Anya, a student with autism, browses a study site. Blinking text causes sensory overload. If the content was still, she could focus and feel more in control.",
      "Rob, a firefighter with PTSD, sees a flashing site alert. The blink effect startles him. A still, colored banner would get the message across without distress.",
      "Nina, a nurse with vision sensitivity, checks hospital policies online. Blinking bullet points strain her eyes. If bullets were solid, she could read comfortably.",
      "Kyle, a barista with ADHD, uses a rewards app. Blinking points notifications make it hard to navigate. A static count would reduce distraction and stress.",
      "Farah, a college admin with epilepsy, opens a staff dashboard. A blinking icon near the top causes nausea. Removing the blink would help her stay on task.",
      "Leo, a retired engineer with cognitive decline, reads local news. Flashing text confuses him. A static, high-contrast headline would be clearer and easier to follow.",
      "Tina, a travel agent with anxiety, uses a booking platform. Flashing deals stress her out. Calmer visuals would help her feel in control.",
      "Omar, a gamer with autism, visits a game site with blinking tips. It’s too much stimulation. A toggle to pause motion would let him stay engaged.",
      "Clara, a baker with ADHD, checks recipes on a site with blinking steps. She loses track of instructions. Still content would keep her focused.",
      "Eli, a high schooler with migraines, browses for textbooks. Blinking sales ads cause pain. If ads were still, he could browse longer.",
      "Naomi, a web designer with epilepsy, researches trends. A blinking cursor demo triggers discomfort. A simple animation-free option would be safer.",
      "Hank, a musician with dyslexia, reads gear reviews. Flashing “best pick” tags break his reading flow. Static labels would let him follow along smoothly.",
      "Jade, a nonprofit director with ADHD, reviews reports. A blinking notice distracts her from key data. Still alerts would help her focus on decisions."
    ],
    "responsibility": ["developer"]
  },
  "button-name": {
    "title": "Buttons Lack Descriptive Text Labels",
    "summary": "Buttons without accessible names or labels make it difficult for many users to navigate apps and websites confidently. This can lead to confusion, errors, and frustration.",
    "description": "Buttons without accessible names or labels are a critical barrier for users with disabilities, including blindness, low vision, dyslexia, or cognitive impairments. Without meaningful text, users may guess button functions or avoid them altogether. This leads to mistakes, delays, and a sense of frustration or exclusion. Ensuring every button has a clear, descriptive name allows users to confidently complete tasks.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Button has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/97a4e1"
      },
      {
        "name": "Menuitem has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/m6b1q3"
      }
    ],
    "user_stories": [
      "Linda, a retired grandmother with low vision, is trying to reorder her prescription using her pharmacy's app. Because the app has unlabeled icon buttons, she can't tell which one confirms her refill. It makes her feel frustrated and anxious about missing her medication. If all buttons had descriptive text labels, she could confidently complete her order.",
      "Jake, a college student with dyslexia, is using a campus meal app to choose dinner options. Because some buttons just show icons without text, he has to guess their function. It stresses him out and slows him down during busy lunchtime. If each button had a clear label, Jake could navigate the app quickly and independently.",
      "Sofia, a young mom who uses a screen reader due to blindness, is trying to submit a form for school enrollment on her district’s website. Because the submit button lacks an accessible name, her screen reader just says 'button.' She feels helpless and unsure if she completed the task. If the button was labeled 'Submit Application,' Sofia could proceed with confidence.",
      "Thomas, a rideshare driver with motor tremors, is trying to report a lost item in his app. The action button is only an icon and has no text or tooltip. He accidentally taps the wrong one, making the process longer and more confusing. If the button had a clear label like 'Report Lost Item,' Thomas could act more efficiently.",
      "Mei, a multilingual learner, is booking a doctor appointment online. Some navigation buttons are unlabeled icons. She doesn’t understand their meaning and worries about booking incorrectly. If each button had a simple, readable name like 'Next' or 'Confirm,' Mei could use the site without fear of making a mistake.",
      "Carlos, a retiree with mild cognitive impairment, is managing his finances through a banking app. The 'Transfer Funds' function is represented by a vague symbol without a label. He feels lost and anxious. If the button had a visible and descriptive text label, Carlos could manage his money with confidence.",
      "Nina, a deaf graphic designer, is trying to post her portfolio on a freelancing site. The upload button is just a cloud icon, and she misses it entirely. She feels overlooked and professionally disadvantaged. If the button had a clear label like 'Upload Portfolio,' Nina could showcase her work easily.",
      "Jared, a teenager with ADHD, is checking his test results on a school app. Because the buttons are unlabeled icons, he gets distracted trying to interpret them. It makes him feel overwhelmed and frustrated. If the app used clearly labeled buttons like 'View Results,' Jared could stay focused and get his information faster.",
      "Fatima, a refugee learning English, is applying for a housing voucher online. The 'submit' button is a generic arrow icon with no label. She hesitates, unsure if it's the final step. This causes stress and delays. If the button were labeled 'Submit Application,' Fatima would feel more secure completing the process.",
      "Liam, a software tester with vision impairment, is evaluating an e-commerce site. Some cart and checkout buttons have no accessible names. His screen reader skips them or reads 'button.' It’s discouraging and hinders his job. If all buttons were properly labeled, Liam could perform his work accurately and efficiently.",
      "Diane, a senior with hand tremors, is using a food delivery app. She tries to cancel an order, but the cancel button is an unlabeled 'X.' She accidentally clicks the wrong icon and ends up placing a duplicate order. If the button had a text label like 'Cancel Order,' Diane could avoid mistakes.",
      "Omar, a grocery store clerk who relies on a screen reader, is checking his work schedule in a company portal. The navigation buttons are just icons, so the screen reader reads them as 'button, button.' He feels lost and wastes time. If each button had a proper accessible name, Omar could access his schedule independently.",
      "Yuki, a recent immigrant with basic digital skills, is renewing her driver's license online. She encounters a page with icon-only buttons. She's afraid to click the wrong thing and make a legal error. If buttons were labeled with text like 'Next Step' or 'Submit Renewal,' Yuki could complete the form with confidence.",
      "Alan, a visually impaired accountant, is approving expenses using his firm's portal. The approval button lacks an accessible name, so his screen reader can’t identify it. He feels frustrated and slows down. If the button had a proper label like 'Approve,' Alan could work productively.",
      "Ravi, a student with autism, is navigating a course registration platform. He relies on predictable cues, but some buttons are icons with no text. He feels anxious and unsure what action they trigger. If the platform used consistent, labeled buttons like 'Register' or 'Drop Course,' Ravi would feel in control.",
      "Monica, a barista with low vision, is checking her shift schedule on a mobile app. The navigation arrows have no text or labels. She often gets lost and has to start over. If the app used labeled buttons like 'Previous Week' and 'Next Week,' Monica could find her schedule quickly.",
      "Ben, a freelancer with dyslexia, is trying to withdraw funds from a freelance platform. The button for withdrawal is just a bank icon with no text. He hesitates, unsure if it's the right action. If the button had a clear label like 'Withdraw Funds,' Ben could act confidently.",
      "Salma, a teacher with limited mobility, is using a stylus to fill out forms on her school portal. Because some buttons are unlabeled and close together, she often taps the wrong one. It wastes time and causes frustration. If buttons were clearly labeled and spaced, Salma could use the site with ease.",
      "Noah, a warehouse worker with color blindness, is reporting an issue on his HR app. The only indicator is a colored button without a label. He can’t tell what it means and avoids clicking it. If the button had a clear text label like 'Report Problem,' Noah would feel empowered to speak up.",
      "Grace, a librarian with hearing loss, is updating event listings on her library’s website. The publish button is an icon without a tooltip or label. She misses it entirely and thinks the event isn’t saving. If the button had a visible label like 'Publish Event,' Grace could post updates smoothly."
    ],
    "responsibility": ["developer", "content"]
  },
  "bypass": {
    "title": "No Mechanism to Bypass Repeated Navigation Blocks",
    "summary": "Without a 'skip to content' link or landmarks, users must go through the same menus repeatedly, wasting time and effort.",
    "description": "Navigation-heavy pages without skip links or landmarks force users with disabilities to repeatedly engage with the same elements. This makes basic tasks like reading, shopping, or completing forms much more difficult, slowing down workflows and increasing cognitive load.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.4.1 Bypass Blocks",
        "link": "https://www.w3.org/TR/WCAG22/#bypass-blocks"
      }
    ],
    "act_rules": [
      {
        "name": "Bypass Blocks of Repeated Content",
        "link": "https://act-rules.github.io/rules/cf77f2"
      }
    ],
    "user_stories": [
      "Carla, a retired teacher with arthritis, is trying to read news articles on a website. Because of repeated navigation menus at the top of every page with no skip option, she must tab through dozens of links. It makes her frustrated and tired quickly. If a 'skip to main content' link were available, she could get straight to reading without physical strain.",
      "James, a blind graduate student, is using a screen reader to access a university library portal. Because there’s no way to bypass repeated navigation, he has to listen to the same menu items on every page. It wastes his time and affects his focus. If headings and landmarks were properly used, he could navigate efficiently.",
      "Mina, a busy mom with ADHD, is trying to order groceries online. Because she can't jump directly to the product listings, she gets distracted navigating through promotional banners and menus. It makes her give up before completing her order. If there were a 'jump to products' link, she could stay on task and finish shopping.",
      "Leo, a freelance writer with a motor disability, is updating his blog. Because he uses keyboard-only navigation and there’s no bypass link, scrolling through headers and ads on each admin page is exhausting. It makes his workflow slow and discouraging. If a bypass option existed, he could manage his site more comfortably.",
      "Sonia, an elderly user with cognitive challenges, is trying to check her bank statement. Because the site repeats menus and icons without a direct path to content, she gets confused and clicks the wrong links. It makes her anxious about online banking. If the interface had clear content sections and skip links, she’d feel more secure.",
      "Andrés, a deaf museum curator using captions and keyboard navigation, visits an art exhibit website. Because he can’t skip long carousels and menus, he struggles to reach exhibit details. It’s annoying and inefficient. If a 'skip to content' button existed, he’d get to what he needs quickly.",
      "Tina, a delivery driver with low vision, checks a logistics dashboard. Because of repeated toolbars and no clear landmarks, screen magnifiers force her to scroll too much. It makes her miss important updates. If regions were marked with landmarks and headings, she’d get the info she needs faster.",
      "Hassan, a student with dyslexia, is browsing for scholarships on an education portal. Because he has to read the same navigation content repeatedly, he loses track of what he’s doing. It causes frustration and slows his progress. If the site had a 'skip navigation' link, he’d focus better on the main text.",
      "Claire, a new parent juggling a newborn, wants to quickly book a pediatric appointment online. Because the site lacks a skip function, she’s delayed by header content and promos. It adds stress during a busy moment. If a direct content jump were possible, she’d complete her task faster.",
      "Marcos, a developer using assistive tech for temporary hand injury, tries to access documentation. Without a way to bypass the menu each time, his wrist gets strained. It’s demotivating to work this way. If the docs site offered a keyboard shortcut to main content, it would ease his workflow.",
      "Priya, a teacher using a screen reader, logs into a school grading portal. Each page repeats complex menus without a way to skip them. It slows her grading and makes her anxious about deadlines. If there were accessible landmarks, she’d save time and feel more in control.",
      "Ben, a retiree with Parkinson’s disease, wants to explore volunteer opportunities. Because he can't bypass navigation-heavy pages, his tremors make it hard to interact repeatedly. It makes him feel excluded. If a 'skip to opportunities' feature existed, he'd participate more easily.",
      "Fatima, a graphic design student with visual processing disorder, checks online class forums. Without a bypass option, the repeated header distracts her every time. It lowers her comprehension. If she could jump straight to discussion threads, she’d be able to follow conversations better.",
      "Gary, a musician with repetitive strain injury, uses only voice commands on a music licensing site. Because he can’t skip menus, he needs multiple commands to reach content. It’s frustrating and time-consuming. If the site supported skip links or clear landmarks, he’d navigate with fewer commands.",
      "Linh, a visually impaired user, accesses recipes on a cooking site. Each recipe page forces her through sponsor ads and menus without a skip mechanism. It disrupts her cooking flow. If content had landmarks or skip links, she’d cook more smoothly.",
      "Julian, a visually impaired accountant using a screen reader, reviews client invoices online. Repeated menu content on every page with no way to skip it wastes his time. It makes his job harder. If a bypass tool were provided, he’d be more efficient.",
      "Nina, a social worker with attention difficulties, fills out forms on a government site. Each page loads with repeated header and sidebar content. It breaks her focus. If there were a way to skip to the form itself, she’d complete applications faster and with fewer mistakes.",
      "Omar, an online seller with limited mobility, edits product listings. Because he has to tab through repeated site controls every time, his hands tire quickly. It’s discouraging. If a 'skip to editing' function existed, he’d manage his shop with less strain.",
      "Keisha, a nurse recovering from surgery and using voice control, accesses health records. Without a skip option, her commands become repetitive and inefficient. It leads to fatigue. If the app allowed jumping to the content area, she’d retrieve data more comfortably.",
      "Eli, a student with a cognitive disability, reads study materials on a learning platform. Repeated menu items distract and confuse him on every page. It lowers his retention. If the site offered a simple way to go straight to learning content, he’d focus and learn better."
    ],
    "responsibility": ["developer"]
  },
  "color-contrast": {
    "title": "Low Contrast Between Text and Background",
    "summary": "Some text elements on the site have insufficient contrast with their background, making them hard to read. This can hinder users with visual impairments.",
    "description": "Poor contrast between text and background makes digital content inaccessible to a wide range of users, including those with vision impairments. It can cause users to miss key information, misunderstand labels, or abandon tasks altogether. This issue not only undermines usability but also prevents users from participating equally in digital experiences.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "1.4.3 Contrast (Minimum)",
        "link": "https://www.w3.org/TR/WCAG22/#contrast-minimum"
      }
    ],
    "act_rules": [
      {
        "name": "Text has minimum contrast",
        "link": "https://act-rules.github.io/rules/afw4f7"
      }
    ],
    "user_stories": [
      "Ava, a retired teacher with low vision, is trying to read an article on a health blog. Because the text is a light gray on a white background, she struggles to make out the words clearly. It makes her feel frustrated and excluded, like the information isn’t meant for her. If the website used higher contrast colors that meet WCAG 2 AA standards, she could comfortably read the content and feel empowered to make informed health decisions.",
      "Jake, a university student with color blindness, is trying to check his course deadlines on the student portal. Because important dates are highlighted using red text on a green background, he can’t distinguish them. It makes him anxious about missing deadlines. If the site used high-contrast colors that are distinguishable for colorblind users, he could easily keep track of his assignments.",
      "Lila, a working mom with low vision, is ordering groceries online late at night. The product labels use pastel colors on a white background, making it hard to differentiate between items. It causes eye strain and slows her down. If the app used darker, contrasting colors for text and backgrounds, she could shop more efficiently and confidently.",
      "Marcus, a warehouse worker with partial sight, is trying to clock in using his company's scheduling app. Because the login button has low contrast with the background, he has trouble finding it. This delay makes him worry about being marked late. If the button had a bold color contrast, he could clock in quickly without stress.",
      "Tina, a grandmother with cataracts, is browsing a gift shop website to buy her grandson a birthday present. The navigation menu is in pale yellow over a white background. She can’t read it easily and feels discouraged. If the site used dark, high-contrast colors, she could navigate the store and choose a gift with confidence.",
      "Eli, a high school student with low vision, is using a math homework app. Instructions are in light blue on a gray background, making them nearly unreadable. This makes him feel helpless and fall behind in class. If the app ensured sufficient text contrast, he could stay engaged and complete his assignments independently.",
      "Naomi, a freelance designer with color vision deficiency, is updating her profile on a freelance job site. Success messages appear in green on a dark green background, so she doesn’t know if her changes saved. It leads to confusion and duplicate work. If the site used distinct contrast in its notifications, she could trust the interface.",
      "Samir, an older adult learning tech skills, is trying to register for an online workshop. The form labels are in pale gray text on a white form. He struggles to understand what to input and feels embarrassed. If the form had stronger text contrast, he could register with ease and build his confidence online.",
      "Olivia, a part-time writer with glaucoma, is reading submission guidelines on a publishing platform. The key info is in light text over an image background, which she can barely read. She feels discouraged from submitting her work. If the site used solid backgrounds with clear contrast, she could engage fully and feel included.",
      "Ben, a software engineer with low contrast sensitivity, is reviewing documentation on a developer portal. Code samples are in light-colored text on a dark background, making them hard to read for hours at a time. It causes eye fatigue. If the portal allowed users to customize or ensure strong contrast themes, he could work more comfortably.",
      "Janelle, a busy parent with mild visual impairment, is using a budgeting app. The spending categories are labeled in light green on white, which makes them hard to tell apart. This leads to budgeting errors and stress. If the app used high-contrast text and icons, she could manage finances with clarity.",
      "Connor, a student with dyslexia and low vision, is trying to review lecture slides uploaded as PDFs. Many slides use light text on pastel backgrounds. It makes reading exhausting and discouraging. If the slides followed accessible color contrast standards, he could focus on learning rather than struggling to decipher content.",
      "Fatima, a customer support agent with early-stage macular degeneration, is trying to respond to support tickets. Her company’s help desk software displays customer info in faint gray on a white card. She has to squint and risks making mistakes. If the interface used bolder, contrasting text, she could do her job accurately and without strain.",
      "Leo, a high school coach with vision loss in one eye, is checking team scores on a sports site. The scoreboard uses light blue against a white background, which he can barely read outdoors. He feels left out from following his team. If the site used high-contrast score displays, he could stay connected with the team.",
      "Grace, a barista studying online, is using an e-learning platform with modules that use white text on pale backgrounds. She can’t read the content easily, even at full brightness. It makes her feel frustrated and like she’s falling behind. If the platform used stronger color contrast, she could learn without unnecessary barriers.",
      "Luis, a retired veteran with visual impairments, is checking his health portal for lab results. The labels are in light blue on a light gray background. He can’t confidently read his own medical data and feels disempowered. If the portal used darker, high-contrast text, he could access his results independently.",
      "Yuki, a chef with low vision, is trying to renew her food safety certification online. The instructions are in thin, low-contrast font that’s hard to read. She feels anxious about making a mistake on the test. If the text used thicker fonts with strong contrast, she could complete the renewal process confidently.",
      "Andre, a commuter with tunnel vision, is checking train times on a transit app. The schedule uses small, low-contrast gray text. He misses his train while trying to decipher the schedule. If the app used bold, high-contrast text, he could check his train quickly and travel stress-free.",
      "Priya, a busy consultant with aging eyes, is reviewing a contract on a legal document platform. Key clauses are in light gray italics, making them hard to read. She worries about missing important terms. If the platform used high-contrast formatting for all text, she could review documents accurately and with peace of mind.",
      "Derek, a high school teacher with diabetic retinopathy, is entering grades on the school’s online system. The data fields have labels in soft colors on white, and he has to zoom in constantly. It slows him down and causes eye strain. If the system used accessible contrast ratios, he could work faster and more comfortably."
    ],
    "responsibility": ["developer", "design"]
  },
  "definition-list": {
    "title": "Definition Lists Not Using Proper <dt> and <dd> Structure",
    "summary": "Definition lists on the site are not using the correct HTML structure, making it hard for screen reader users to understand the relationship between terms and definitions.",
    "description": "The website does not follow semantic HTML best practices for definition lists, using <dl> elements without correctly pairing them with <dt> and <dd> elements. This disrupts how assistive technologies interpret and present information. As a result, users who are blind or visually impaired may not understand the relationship between terms and definitions, which can impact tasks like studying or preparing lessons.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - dl element",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dl"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Marcus, a blind high school teacher, is trying to read a glossary of educational terms on a curriculum website using his screen reader. Because the <dl> elements are incorrectly structured—missing <dt> and <dd> tags or placed in the wrong order—his screen reader reads the list as a jumbled string with no clear relationship between terms and their definitions. It makes him feel frustrated and excluded, especially when preparing lessons for his students. If the glossary used proper semantic HTML with correctly paired <dt> and <dd> elements, Marcus could easily navigate and understand the terms, helping him plan more effectively.",
      "Lena, a college student with dyslexia, is trying to sign up for a university event on the student portal. Because the labels on form fields aren't associated correctly, her screen reader skips important information or reads fields out of order. This leaves her confused and anxious about submitting incorrect details. If form fields used proper <label> elements with matching 'for' attributes, Lena could fill out forms independently and confidently.",
      "Jorge, a delivery driver with color blindness, is checking traffic alerts on a logistics app. Because status indicators rely solely on color (red for closed, green for open), he can't tell which routes are blocked. This slows him down and risks delays. If the app added text labels or icons along with color, Jorge could make quicker decisions and stay on schedule.",
      "Priya, a retired librarian with arthritis, is browsing a local museum’s site to book tickets. Because clickable targets like links and buttons are very small and closely spaced, she struggles to tap them accurately on her tablet. It makes her feel clumsy and discouraged. If buttons were larger and spaced adequately, Priya could navigate with ease and enjoy her outing.",
      "Ahmed, a deaf software engineer, is trying to follow a product tutorial on a tech website. Because the video lacks captions or a transcript, he misses all the spoken instructions. He feels left out of learning opportunities. If the video had accurate captions or a downloadable transcript, Ahmed could follow along just as well as hearing users.",
      "Gloria, a grandmother with low vision, wants to order groceries online. Because the website uses low-contrast text for product descriptions, she struggles to read what she's buying even with her screen magnifier. This makes her anxious about buying the wrong items. If the site used higher contrast text and scalable fonts, Gloria could shop confidently.",
      "Tariq, a teenager with ADHD, is filling out a multi-step application form for a summer program. Because there are no clear progress indicators or save options, he gets overwhelmed and loses track of where he is. This causes him to abandon the form entirely. If the form included a progress bar and auto-save, Tariq could complete it at his own pace.",
      "Mia, a barista with limited hand mobility, is trying to apply for a job on a café's hiring site. Because the navigation requires drag-and-drop to rearrange availability times, she can't use her adaptive keyboard to complete the form. She feels excluded from opportunities. If the site offered alternative input methods, Mia could apply independently.",
      "Noah, a high school senior with a learning disability, is reviewing scholarship options on a financial aid website. Because the language is filled with jargon and long paragraphs, he finds it difficult to understand. He feels discouraged and avoids applying. If the site used plain language summaries and bullet points, Noah could better navigate his options.",
      "Sofia, a marketing manager who uses screen magnification, is reading a news article on her favorite site. Because pop-up ads keep appearing and shifting the content, she loses her place constantly. It leaves her frustrated and disoriented. If the site used static content layouts or delayed ad loading, Sofia could read smoothly.",
      "Ben, a musician with hearing loss, wants to explore new genres using a music discovery app. Because genre filters use only subtle audio cues and no visual labels, he can’t tell what he’s selecting. He feels lost and disengaged. If the app included visual feedback or icons alongside sound, Ben could discover new music more easily.",
      "Nina, a freelance writer with a cognitive disability, is trying to manage deadlines on a project management platform. Because the calendar view is cluttered and lacks headings, she can’t understand which tasks belong to which day. She ends up missing deadlines. If the layout used clear headings and collapsible sections, Nina could organize her work better.",
      "Derek, a senior with early-stage Parkinson’s, is filling out a payment form. Because there's a short time limit without a warning, his tremors make him restart repeatedly. This causes frustration and stress. If the site offered an option to extend or disable the time limit, Derek could complete his task calmly.",
      "Jasmine, a student with anxiety, is joining an online exam. Because the instructions are buried under several links and not summarized clearly, she panics trying to understand the setup. She fears making technical mistakes. If the platform provided a concise, accessible checklist at the top, Jasmine could start with confidence.",
      "Ravi, a photographer with low vision, is uploading his portfolio to a gallery site. Because image upload buttons lack alt text or labels, his screen reader skips them. He can’t tell where to click. It makes him feel helpless. If buttons included proper labels and alt text, Ravi could share his work independently.",
      "Hannah, a busy parent who uses voice control, is trying to schedule a doctor’s appointment on a healthcare portal. Because buttons and menus don’t have accessible names, her voice commands don’t work. This leads to delays and frustration. If the site followed ARIA standards and labeled all elements clearly, Hannah could book using voice alone.",
      "Leo, a college student with visual processing issues, is reading an online textbook. Because there’s no option to adjust line spacing or text size, he gets fatigued quickly. It affects his ability to study. If the platform offered customizable text presentation, Leo could read for longer and retain more.",
      "Yara, a multilingual immigrant with limited English, is applying for housing assistance. Because the site offers no translation or simplified language options, she can’t complete the form. She feels invisible and unsupported. If the site included language toggle features and simplified English, Yara could access help she needs.",
      "Oscar, a senior citizen who uses a screen reader, is trying to donate to a charity website. Because the donation buttons are mislabeled or repeated with unclear context, his screen reader just reads 'button' over and over. It confuses him and stops the process. If each button had unique, descriptive labels, Oscar could donate with confidence.",
      "Kim, a gamer with motor impairments, is adjusting settings on a game launcher website. Because sliders and toggles require precise mouse control without keyboard alternatives, she can't adjust the volume or brightness. She feels locked out. If the settings allowed keyboard navigation or numeric input, Kim could customize the game experience independently."
    ],
    "responsibility": ["developer"]
  },
  "dlitem": {
    "title": "Missing <dl> Container for <dt> and <dd> Elements",
    "summary": "Definition terms and descriptions are not grouped correctly, making it hard for assistive technologies to interpret the content.",
    "description": "Using <dt> and <dd> elements outside a <dl> disrupts the semantic meaning and causes screen readers to misinterpret the relationship between terms and definitions. This leads to a confusing user experience, especially for users with visual, cognitive, or reading impairments. Fixing the structure by wrapping them in a <dl> will help users better understand the content.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - dl element",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/dl"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Marta, a university researcher with a screen reader, is trying to understand the definitions listed on an academic resource site. Because the site uses <dt> and <dd> tags outside of a proper <dl> container, her screen reader doesn't announce them as related terms and definitions. It makes her feel frustrated and unsure about the accuracy of the content. If developers enclosed these elements in a <dl> structure, she could confidently navigate and understand the information just like sighted users.",
      "Derek, a visually impaired accountant, is reviewing product specs on a tech supplier's site. Because the definition list isn’t properly wrapped in a <dl> tag, his screen reader reads the items as random, unconnected text. It leaves him confused and wastes valuable time. If the structure followed semantic HTML with a proper <dl>, he could understand which descriptions match which terms instantly.",
      "Jasmine, a college student with dyslexia, is trying to study biology terms on an educational app. Because the definition terms and descriptions aren’t grouped in a proper <dl>, the layout appears chaotic and lacks logical structure. It makes it harder for her to associate terms and definitions, adding to her stress. If the content used semantic HTML, screen readers and styling tools could present the info more clearly.",
      "Carlos, a customer support agent with low vision, is reading FAQs on his company portal. The site lists terms and descriptions using <dt> and <dd> without a <dl> container, breaking the visual and structural flow. This causes him to misinterpret information, risking incorrect responses to clients. If developers used a <dl> element, screen magnifiers and readers would present the information coherently.",
      "Nina, a retiree learning online cooking, is trying to match ingredients with their descriptions. Without a proper <dl>, the info appears disorganized on her tablet’s screen reader. She feels disoriented and hesitant to continue the lesson. If the site used correct semantic grouping, she could follow along with confidence.",
      "Aiden, a software tester with ADHD, is referencing a glossary on an internal tool. Because the page doesn't use a proper <dl> structure, the visual layout lacks grouping, making it hard to focus. He becomes overwhelmed and disengages. If the page used semantic containers, visual cues and assistive tools could help maintain his attention.",
      "Lena, a freelance writer with a cognitive disability, is exploring a website’s glossary. The terms and definitions are unstructured due to missing <dl> tags, making it difficult for her to process the information logically. She feels discouraged. If properly formatted, the consistent structure would reduce cognitive load and improve understanding.",
      "Sam, a high schooler with a screen reader, is reviewing a math glossary online. The incorrect HTML structure causes the screen reader to skip or jumble term-definition pairs. He misses key information and feels frustrated. With a <dl> element, screen readers could convey the data in a meaningful way.",
      "Gina, a librarian using assistive tech, is browsing a digital catalog. Because the site omits a proper <dl> for term-description pairs, her screen reader reads content in an incoherent sequence. She becomes confused about book categories. If the elements were inside a <dl>, she’d understand the relationships clearly.",
      "Ben, a museum curator with limited vision, is exploring artist bios online. Without a proper <dl>, descriptions and names are detached, disrupting his workflow. He feels inefficient. Semantic HTML would enable screen readers to convey these pairs correctly.",
      "Imani, a new mom multitasking with a voice assistant, is trying to learn parenting terms on a website. Due to the broken structure of <dt> and <dd> outside a <dl>, the assistant reads the info out of order. She misses key points and feels overwhelmed. With proper markup, voice tools could narrate terms and definitions correctly.",
      "Noah, a young coder with autism, relies on structured layouts to understand web content. On a coding tutorial site, glossary entries lack a <dl> structure, causing visual disorganization and confusion. He loses focus quickly. A semantic layout would support clearer comprehension and retention.",
      "Priya, a small business owner using a screen reader, is scanning financial terms on a bank website. The lack of a proper <dl> causes unrelated content to be read together. She becomes frustrated by the inefficiency. If the site used structured HTML, she could easily scan and absorb key terms.",
      "Eli, a college senior with color blindness, is studying economics terms. Without a <dl>, terms and definitions are only separated by color cues, which he can’t distinguish. He ends up misreading definitions. Using semantic HTML with a <dl> would allow structural cues beyond color.",
      "Maya, a teacher using an iPad and screen reader, is reviewing learning resources. The definitions list is misstructured without a <dl>, so her screen reader can't present the context. She struggles to prepare lesson materials. A properly used <dl> would ensure accessibility across devices.",
      "Logan, a senior with arthritis using a keyboard, is navigating a health glossary. Improper markup forces him to tab through unrelated content, making his hands ache. A well-structured <dl> would improve keyboard navigation and reduce physical strain.",
      "Zoey, a teenager learning a new language, is using a vocabulary app. The app doesn’t group translations properly in a <dl>, making it hard for her to match words with meanings. She gets discouraged. Semantic markup would help her learn more effectively.",
      "Omar, a truck driver with limited literacy, is using a training site with audio tools. The broken structure of definitions makes narration confusing. He feels lost and gives up. Using <dl> would allow narration tools to present content in a logical flow.",
      "Rachel, a part-time editor with migraines, struggles with cluttered layouts. On a publishing tool, lack of semantic grouping in a glossary adds to visual noise. She feels drained. A structured <dl> layout would offer a cleaner, more digestible view.",
      "Leo, a job seeker with memory challenges, is reviewing job descriptions. Without <dl> grouping, related terms and duties are jumbled. He feels overwhelmed and unsure what roles entail. A clear semantic structure would aid comprehension and confidence."
    ],
    "responsibility": ["developer"]
  },
  "document-title": {
    "title": "Missing or Empty Page Title Element",
    "summary": "A missing or empty page title can confuse users, especially those using screen readers or multiple tabs. The document must include a descriptive <title> element.",
    "description": "Every HTML document should include a meaningful and concise <title> element to help users orient themselves. When this is missing, it significantly reduces the usability of the site for all users, particularly those relying on screen readers or browser history features.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.4.2 Page Titled",
        "link": "https://www.w3.org/TR/WCAG22/#page-titled"
      }
    ],
    "act_rules": [
      {
        "name": "HTML page has non-empty title",
        "link": "https://act-rules.github.io/rules/2779a5"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - title element",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/title"
      }
    ],
    "user_stories": [
      "Thomas, a retired teacher with memory challenges, is trying to revisit an article he liked using his browser history. Because the website's page title is missing or empty, he sees only vague or duplicate entries in his tab list and browser history. It makes him feel frustrated and lost, as he can't easily find the content again. If each page had a clear, descriptive title in the <title> element, he could quickly identify and return to the page he wants without confusion.",
      "Maria, a busy single mom, is juggling several open tabs while shopping online for school supplies. Because some store pages use generic or missing titles, she can’t tell which tab is which. It makes her feel overwhelmed and wastes her time. If each tab had a meaningful page title, she could easily switch between tabs and complete her purchase faster.",
      "Jamal, a college student with ADHD, is working on a research paper with multiple browser tabs open. Because many academic sources have blank or repetitive titles, he keeps losing track of which tab is which. It makes him feel anxious and scattered. If websites used specific titles for each page, Jamal could stay organized and focused.",
      "Linda, a blind screen reader user, is exploring recipes online. Because some pages lack proper titles, her screen reader announces vague or irrelevant information. It makes her feel confused and unsure if she’s on the right page. If each page had a unique and accurate title, she could navigate more confidently.",
      "Carlos, a delivery driver using voice navigation on his phone, is trying to find a restaurant’s menu. Because the mobile site lacks a proper title, his voice assistant can’t accurately list it. It makes him feel annoyed and slows him down. If the site had a clear title, voice tools could better guide him.",
      "Naomi, a researcher with a visual processing disorder, is organizing sources for a project. Because several sites she uses don’t have distinct page titles, her bookmarks all look the same. It makes it hard for her to reference and cite them correctly. If the titles were unique and descriptive, she could manage her work more efficiently.",
      "Greg, a senior with mild cognitive decline, is browsing for travel deals. Because many pages use the same default title like 'Home' or 'Welcome', he can't remember which page had the good offer. It makes him feel disoriented. If each page had a specific title like 'Deals to Florida', he could better retrace his steps.",
      "Amy, a high school student with dyslexia, is working on a science project and bookmarking resources. Because the website titles are missing or unclear, all her bookmarks look the same. It makes it frustrating to revisit the right sources. If each page had a clear, specific title, she could find what she needs more easily.",
      "Malik, a customer support agent with partial sight, is multitasking between CRM tabs. Because some web apps don’t update titles dynamically, he can’t tell which tab has the active case. It wastes time and leads to errors. If the page titles updated to reflect active content, he could work faster and more accurately.",
      "Rachel, a visually impaired artist using a screen reader, is exploring an online gallery. Because the titles of artwork pages are missing or generic, her screen reader provides little context. It makes the experience less immersive. If each artwork page had a descriptive title, she could enjoy and understand the content more fully.",
      "Henry, a retiree learning to use the internet, is managing his banking online. Because the bank’s web pages all have the same title, he gets confused when switching tabs. It makes him anxious about making mistakes. If each page had a distinct title like 'Transfer Funds' or 'Account Summary', he’d feel more confident.",
      "Sasha, a non-native English speaker, is using translation tools to read an article. Because the page lacks a proper title, the translator doesn’t give useful context. It makes comprehension harder. If the title were clear and informative, it would help Sasha understand the purpose of the page more quickly.",
      "Ben, a freelance writer with executive function challenges, is drafting an article and researching online. Because several resource pages have blank or misleading titles, he keeps reopening the same links. It makes him feel stuck. If page titles clearly indicated their content, he could work more efficiently.",
      "Olivia, a teenager with autism, is exploring a fashion website. Because the tabs just say 'Shop' or 'Page 1', she gets overwhelmed trying to find where she left off. It disrupts her shopping experience. If the pages had descriptive titles like 'Summer Dresses - Size M', she could navigate calmly.",
      "Dinesh, a software tester with low vision, is comparing two admin dashboards. Because both dashboards have identical titles, his magnifier tool doesn’t help differentiate them. It slows down his testing. If the titles reflected current user roles or page contexts, he could switch between them with confidence.",
      "Ellie, a project manager with a hearing impairment, is using a task tracker app with voice-over support. Because some modals and pages don’t have titles, her assistive tech reads incomplete info. It’s frustrating and inefficient. If every view had a unique title, she’d manage tasks more smoothly.",
      "Leo, a college freshman with working memory issues, is studying from multiple open tabs. Because many educational sites use 'Home' or 'Dashboard' as their titles, he can’t tell them apart. It’s mentally taxing. If titles described the course or topic, he’d stay better organized.",
      "Priya, a nonprofit coordinator using screen magnification, is drafting a grant using browser-based tools. Because her tab titles are non-descriptive, she keeps clicking the wrong one. It wastes valuable time. If titles were tailored to each stage or document, she could work more productively.",
      "Sam, a gamer with dysgraphia, is reading patch notes across several game forums. Because each site just uses 'Forum' or 'Post' as titles, his bookmarks are jumbled. It’s hard for him to revisit the right one. If each title included the game and patch version, he’d navigate better.",
      "Alina, a stay-at-home parent with limited tech experience, is planning a birthday party online. Because event pages have empty or identical titles, she gets confused switching tabs. It makes her feel discouraged. If titles reflected content like 'Party Supplies' or 'Invitation Designs', she’d feel more in control."
    ],
    "responsibility": ["developer", "content"]
  },
  "duplicate-id-aria": {
    "title": "Duplicate ID Values in ARIA Labels",
    "summary": "Duplicate IDs in ARIA labels cause confusion for screen reader users, who depend on accurate label-to-field associations to understand and complete tasks.",
    "description": "Duplicate ID values referenced in ARIA labels or roles can cause screen readers to misidentify which label applies to which input. As a result, users who depend on these tools may feel confused, overwhelmed, or discouraged. Ensuring each ID is unique allows for clear, consistent interactions and supports user autonomy.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Id attribute value is unique",
        "link": "https://act-rules.github.io/rules/3ea0c8"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - aria-labelledby",
        "link": "https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Reference/Attributes/aria-labelledby"
      }
    ],
    "user_stories": [
      "Elliot, a customer service representative who uses a screen reader, is trying to submit a help ticket on the company intranet portal. Because of duplicate ID values in ARIA attributes, the screen reader reads out conflicting or repeated labels, making it hard to tell which input fields correspond to which labels. It makes him feel frustrated and slows down his work. If every ID attribute used in ARIA roles and labels were unique, Elliot could clearly understand each field and submit the form quickly without confusion.",
      "Jasmine, a college student with low vision, is trying to register for classes on her university's portal. Because of duplicate ID values tied to ARIA labels, her screen reader announces the same label for multiple dropdowns. She feels anxious about selecting the wrong course section. If unique IDs were used for each labeled element, Jasmine could confidently choose the correct options.",
      "Marcus, a father with dyslexia, is filling out a medical history form online. Because multiple fields share the same ARIA ID, the label isn’t clearly associated with the correct input, which confuses him. It makes him feel overwhelmed and unsure if he's completing the form accurately. If every field had a unique ID referenced by its label, Marcus could focus better and finish the form with confidence.",
      "Grace, a retiree who relies on a screen reader, is applying for a public service on a government website. Because duplicate IDs are used in ARIA roles, the screen reader mixes up the form field labels. She feels lost and eventually gives up. If each ID used for ARIA roles and labels were unique, Grace could navigate the form without confusion and complete her application.",
      "Liam, a visually impaired high school student, is trying to submit homework on his school’s learning management system. Because multiple elements reference the same ARIA ID, his screen reader misidentifies the submit button. He feels discouraged and fears missing his deadline. If unique IDs were assigned, Liam could successfully interact with the interface and meet his submission requirements.",
      "Tina, an older adult with hearing loss who uses captions and voice commands, is navigating a shopping app. Because ARIA labels reference duplicate IDs, her voice assistant misidentifies UI elements, leading her to select the wrong options. She feels confused and hesitant to complete her purchase. If every ID were unique, Tina could shop independently and accurately.",
      "Ravi, a software tester with low vision, is trying to check a form on a QA website. Because ARIA attributes reuse the same ID, his screen reader skips over or misreads form labels. He feels frustrated and unable to verify accessibility. If the IDs were made unique, Ravi could accurately test the site and provide proper feedback.",
      "Elena, a freelance writer with ADHD, is signing up for a newsletter. Because form labels reference a reused ID, she’s unsure which label belongs to which input and has to re-read several times. She feels irritated and distracted. If each input had a distinct ID connected to its label, Elena could complete the task quickly and easily.",
      "Noah, a visually impaired musician, is uploading new tracks to a streaming platform. Because ARIA labels point to duplicate IDs, his screen reader gives unclear cues about where to input song details. He feels annoyed and fears mislabeling his music. If IDs were unique across ARIA attributes, Noah could upload and manage his content correctly.",
      "Zara, a busy mom using a tablet with voice assistance, is booking a doctor appointment. Because the ARIA IDs are duplicated, the voice assistant cannot clearly identify form fields. She feels frustrated and delays the booking. If the site ensured unique ID values, Zara could book appointments quickly and stress-free.",
      "Devon, an accountant with low vision, is updating client records on an internal web dashboard. Because multiple fields share the same ARIA ID, the screen reader announces the wrong labels. He feels uncertain and worried about data errors. If IDs were unique, Devon could input accurate client details with confidence.",
      "Hannah, a university librarian using screen magnification, is reviewing book entries in a catalog system. Because ARIA labels reuse ID values, magnification tools show mismatched labels, causing confusion. She feels disoriented and wastes time. If every label had a unique ID, Hannah could navigate the catalog efficiently.",
      "Carlos, a rideshare driver who uses voice navigation, is updating his vehicle info in the driver app. Because of duplicated ARIA ID values, the voice system misreads the form labels, leading him to input data in the wrong fields. He feels annoyed and has to start over. If each label used a unique ID, Carlos could complete updates correctly the first time.",
      "Nina, a freelance graphic designer with color blindness and a screen reader, is trying to purchase fonts online. Because ARIA attributes reference duplicate IDs, the product descriptions get mixed up. She feels unsure about what she's buying. If unique IDs were used for each label and control, Nina could browse and buy confidently.",
      "Omar, a visually impaired chef, is entering ingredients into a recipe management app. Because ARIA IDs are not unique, the screen reader groups the wrong labels with input boxes. He feels confused and slows down his workflow. If IDs were unique, Omar could accurately input recipe details.",
      "Lisa, a retired teacher with hearing and vision impairments, is trying to pay bills through her bank’s website. Because of duplicate ARIA ID references, the screen reader and voice assistant provide conflicting information. She feels stressed and unsure if the payment went through. If ARIA attributes used unique IDs, Lisa could manage her finances independently.",
      "Jorge, a museum curator with dyslexia, is adding exhibit details to a content management system. Because of shared ARIA IDs, label-text associations are incorrect, making the form hard to understand. He feels distracted and makes input errors. If unique IDs were applied, Jorge could clearly enter and organize exhibit data.",
      "Mei, a part-time student with vision loss, is filling out a feedback form after a class. Because ARIA roles share the same ID, her screen reader skips some labels or misreads them. She feels excluded and unheard. If the form used unique IDs, Mei could provide meaningful feedback independently.",
      "Sam, a delivery driver with hand tremors who uses voice input, is editing his availability in an app. Because of duplicate ARIA IDs, his voice assistant can’t distinguish between time slots. He feels annoyed and ends up calling support. If each element had a unique ARIA ID, Sam could manage his schedule without hassle.",
      "Fatima, a university student who uses a screen reader, is applying for a scholarship online. Because form fields share duplicate ARIA ID references, her screen reader jumbles the input guidance. She feels anxious and fears making mistakes. If the site used unique ARIA ID values, Fatima could apply confidently and correctly."
    ],
    "responsibility": ["developer"]
  },
  "form-field-multiple-labels": {
    "title": "Form Field with Multiple Labels",
    "summary": "When a form input has more than one label, it can cause confusion and accessibility issues for people with disabilities. Fields should be labeled once and clearly.",
    "description": "When form fields have more than one associated label, it increases the risk of misinterpretation and decreases form usability. Users with cognitive challenges or language barriers may be particularly affected, as they rely on clear, consistent instructions. Ensuring each input has a single, distinct label supports faster and more accurate form completion.",
    "severity": "moderate",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "3.3.2 Labels or Instructions",
        "link": "https://www.w3.org/TR/WCAG22/#labels-or-instructions"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Maria, a college student with ADHD, is trying to register for classes using her university's online portal. Because the course selection form has multiple labels for each field, she gets confused about which label corresponds to the input. It makes her feel frustrated and unsure if she’s filling out the form correctly, especially under time pressure. If each form field had a single, clear label, she could complete her registration confidently and on time.",
      "Jamal, a freelance writer with dyslexia, is trying to sign up for a content platform. The form fields on the registration page have more than one label, making it hard for him to figure out what each field is asking. It slows him down and makes him second-guess his answers. If every form field had a single, unambiguous label, Jamal could sign up faster and with more confidence.",
      "Rosa, a retired teacher with low vision, is applying for health benefits online. Because each form input is associated with multiple labels, her screen reader reads overlapping or conflicting instructions. It confuses her and makes the process feel overwhelming. If each input had a single, properly associated label, Rosa could complete the form independently without assistance.",
      "Dinesh, a visually impaired developer, is logging into a coding platform. When his screen reader hits the login fields, it reads two different labels per field, leaving him unsure which one to trust. This slows him down and raises doubts about whether he's entering information correctly. If each field had just one accessible label, Dinesh could log in efficiently and with certainty.",
      "Tasha, a new mom with cognitive fatigue, is trying to order baby supplies from an online store. Because the checkout form has multiple labels on a few fields, she keeps entering information in the wrong places. It makes her feel drained and frustrated. If the site used a single, clear label per field, Tasha could complete her purchase smoothly.",
      "Greg, a senior with hearing loss and limited tech experience, is updating his insurance details online. He relies on captions and visual cues, but the multiple labels on form fields cause visual clutter and confusion. He ends up calling customer support for help. If the site cleaned up its labeling and made instructions consistent, Greg could manage his account independently.",
      "Nina, a teen with autism, is signing up for a summer camp using a website. The form labels repeat or contradict each other, making it hard to focus and understand what's needed. It leads to meltdowns and unfinished tasks. If labels were concise and singular, Nina could complete the form with minimal stress.",
      "Omar, a delivery driver who uses voice navigation tools, is trying to file a work report through a company app. The multiple labels on the form fields confuse the voice assistant, which misinterprets input fields. He gets annoyed and has to redo the report. If each field had a single, accurate label, Omar could complete reports hands-free with ease.",
      "Elsa, a graphic designer with anxiety, is trying to apply for freelance work through a creative portal. Conflicting labels on the application form increase her stress, making her worry about making mistakes. If labels were simplified and consistent, Elsa could apply with peace of mind.",
      "Ravi, an immigrant learning English, is filling out a housing form online. The multiple labels per field introduce redundant and sometimes confusing language, making it hard for him to understand. It leaves him uncertain about submitting the form. If the site used one clear label per field with plain language, Ravi could navigate it more easily.",
      "Carmen, a mother juggling multiple tasks, is filling out a school form for her child. The overlapping labels on fields waste her time as she has to re-read and guess. She feels irritated and rushed. If the site used single, informative labels, she could complete the form more efficiently.",
      "Leo, a barista with dyscalculia, is filling out a tip distribution form online. He struggles when form fields for percentages and dollar amounts have multiple labels that mix instructions. It causes him to input data incorrectly. If labels were specific and separate, Leo could do his job without mistakes.",
      "Emily, a nurse with arthritis, uses speech-to-text software to fill out hospital shift forms. Multiple labels on form fields confuse the software, leading to errors in her entries. It’s frustrating and time-consuming. If each field had one clean label, Emily’s software would work more reliably.",
      "Kofi, a teacher with limited internet access, is trying to submit lesson plans quickly. The form fields have several labels each, some redundant, making the page load slower and harder to read. It delays his work. If labels were optimized and reduced to one per field, the page would be more usable.",
      "Yuki, a teenager with attention challenges, is trying to RSVP for a school event through a digital form. She keeps getting distracted by duplicated labels that say the same thing in different ways. It makes the form look longer and more complex than it is. If the fields had one label each, Yuki could stay focused and finish.",
      "Thomas, a retiree learning to use apps, is joining a photography club website. The sign-up form is full of multiple overlapping labels, making it look cluttered and intimidating. He gives up halfway. If the form used simple, clear labels, Thomas could complete his registration independently.",
      "Lina, a part-time student with chronic fatigue, is applying for a grant. She finds the application form confusing because each field seems to have two or more labels. It drains her energy and delays her submission. If the form had just one concise label per input, Lina could complete it without added stress.",
      "Zane, a data analyst who relies on a screen magnifier, is filling out an online invoice. When fields have several labels, they take up more screen space, forcing him to scroll and pan constantly. It's tiring and inefficient. If the form used a single label per field, Zane could navigate it more comfortably.",
      "Maya, a bilingual user still mastering English, is requesting medical records online. Multiple labels on form fields provide slightly different wording, which confuses her understanding. She fears submitting incorrect information. If each field had one clear label in plain English, Maya would feel more secure.",
      "Andre, a construction worker with limited digital skills, is entering timesheet data. Multiple labels on each input field overwhelm him and make him doubt his entries. He ends up calling a supervisor for help. If the form used one straightforward label per field, Andre could handle it on his own."
    ],
    "responsibility": ["developer"]
  },
  "frame-focusable-content": {
    "title": "Focusable Iframe Content Inaccessible to Keyboard Users",
    "summary": "Iframes must be keyboard-focusable if they contain content users need to access. Setting tabindex=-1 blocks access for anyone not using a mouse.",
    "description": "When an iframe with focusable content is set to tabindex=-1, keyboard users cannot tab into it to interact with what's inside. This prevents users like Rosa or Derek from submitting applications, watching help videos, or completing tasks independently. Removing the negative tabindex allows all users equal access to embedded content.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.1.1 Keyboard",
        "link": "https://www.w3.org/TR/WCAG22/#keyboard"
      }
    ],
    "act_rules": [
      {
        "name": "Iframe with negative tabindex has no interactive elements",
        "link": "https://act-rules.github.io/rules/akn7bn"
      }
    ],
    "supporting_links": [
      {
        "name": "MDN - tabindex attribute",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Global_attributes/tabindex"
      },
      {
        "name": "MDN - iframe element",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/iframe"
      }
    ],
    "user_stories": [
      "Rosa, a university student with motor impairments, is trying to fill out a scholarship form on a website. Because the form is inside an iframe with tabindex=-1, she can’t reach it using only her keyboard. It makes her feel excluded and frustrated. If the iframe were focusable, Rosa could complete the form independently and on time.",
      "Derek, a job seeker who navigates with a keyboard due to hand tremors, is applying for a position on a recruitment site. The application portal is inside a non-focusable iframe, so he can't tab into it. He feels stuck and discouraged. If the iframe allowed keyboard focus, he could apply just like anyone else.",
      "Maya, a blind screen reader user, is trying to read an embedded article on a news site. The article is in an iframe with tabindex=-1, so her screen reader skips it. She misses key information and feels disoriented. If the iframe were keyboard-accessible, Maya’s screen reader could announce and navigate its content.",
      "Carlos, a wheelchair user with limited hand mobility, wants to register for a webinar using his favorite keyboard-friendly browser. The registration form is inside a non-focusable iframe. He can’t tab into it, so he can’t sign up. If the iframe had a proper tabindex, Carlos could register independently.",
      "Tina, a senior citizen with arthritis, uses keyboard shortcuts to browse the internet. She tries to check her bank statement, but the iframe containing the statement is not keyboard-focusable. She’s forced to ask for help, which makes her feel less independent. Fixing the iframe tabindex would let Tina manage her finances on her own.",
      "Jordan, a developer with a temporary arm injury, is trying to update his portfolio via a website builder. The editing tools are inside an iframe with tabindex=-1, making them inaccessible by keyboard. He’s frustrated he can’t work. Making the iframe focusable would restore full access to his tools.",
      "Aliyah, a deaf user who relies on captioned video players, clicks a help video inside an iframe. She can’t activate the player using the keyboard because of a negative tabindex. She’s confused and can’t find the information she needs. If the iframe accepted focus, she could control the video and understand the help content.",
      "Tom, a high school teacher with carpal tunnel syndrome, is grading student work on a learning platform. The grading interface is in a non-focusable iframe, so he can’t tab into it. He feels slowed down and inefficient. If the iframe supported keyboard navigation, Tom could grade smoothly.",
      "Nancy, a screen reader user with low vision, is booking a hotel online. The date selector is embedded in an iframe with tabindex=-1, so she can’t reach it with her keyboard. She feels like she’s missing key steps. If the iframe were accessible, Nancy could complete her booking confidently.",
      "Ethan, a video game streamer with repetitive strain injury, is trying to set up payment options on a donation site. The settings are inside an iframe that doesn’t allow keyboard focus. He’s stuck and frustrated. Allowing the iframe to be focusable would give him control over his finances.",
      "Priya, a graduate student with muscular dystrophy, is navigating her university's course registration system. A required course list is inside an iframe that can't receive focus. She can't register on her own, causing stress. If the iframe were focusable, Priya could complete her registration independently.",
      "Greg, an IT manager who uses only keyboard input, tries to configure software through a dashboard in an iframe. The frame is not focusable, making essential controls unreachable. This slows down his work and causes frustration. If the iframe were keyboard accessible, Greg could do his job efficiently.",
      "Lena, a part-time worker recovering from surgery, is accessing her work schedule through an app embedded in an iframe. She can’t focus the iframe using the keyboard. This delays her from planning her week, which adds anxiety. Making the iframe focusable would restore her routine.",
      "Oscar, a gamer with limited mobility, is managing his profile on a streaming service. The settings panel is in an iframe with tabindex=-1, so it’s unreachable with his adaptive keyboard. He feels left out. If the iframe were properly focusable, Oscar could personalize his experience.",
      "Jill, a remote worker using a keyboard-only setup, tries to access HR forms embedded on the company intranet. The iframe has a negative tabindex, so she can’t access the forms. She misses important deadlines, which causes stress. Fixing the tabindex would let her work without barriers.",
      "Raj, a senior engineer with a repetitive strain injury, wants to review diagrams in an iframe on a documentation site. The frame isn't focusable via keyboard, so he can’t view the content. He feels blocked. If developers made the iframe keyboard-navigable, Raj could continue learning efficiently.",
      "Sophie, a stay-at-home mom with vision loss, is using a screen reader to complete a food order. The payment interface is in a non-focusable iframe. She can't reach it, so she can’t place her order. She feels helpless. Making the iframe accessible would allow her to complete purchases independently.",
      "Victor, a warehouse manager using a touchless input device, tries to access delivery schedules in an iframe. It’s not focusable, so he can’t interact with it. He’s unable to coordinate his team efficiently. If the iframe allowed keyboard focus, Victor could manage schedules more effectively.",
      "Emily, a teacher with a mobility impairment, is grading assignments through an LMS. The assignment viewer is embedded in a non-focusable iframe, which makes it impossible to use with her keyboard setup. This slows her down and adds stress. Making the iframe keyboard-accessible would let Emily work smoothly.",
      "Hassan, a legal assistant with limited hand dexterity, is navigating legal research tools in a web portal. The iframe containing key documents is set to tabindex=-1, so he can’t access them by keyboard. This makes his job harder. Allowing the iframe to be focusable would greatly improve his productivity."
    ],
    "responsibility": ["developer"]
  },
  "frame-title-unique": {
    "title": "Duplicate Frame Titles",
    "summary": "Frames without unique, descriptive titles make it hard for users with visual impairments to understand content or complete tasks efficiently.",
    "description": "Frames with generic or duplicate titles like “form” or “media viewer” don't provide enough context for users who rely on assistive technology. This can result in frustration, mistakes, and an inability to complete tasks like filling out forms or reviewing data. Descriptive titles such as “Resume Upload” or “Sales Chart Q1” improve clarity and reduce cognitive load.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Iframe elements with identical accessible names have equivalent purpose",
        "link": "https://act-rules.github.io/rules/4b1c6c"
      }
    ],
    "supporting_links": [
      {
        "name": "W3C - H64",
        "link": "https://www.w3.org/WAI/WCAG21/Techniques/html/H64"
      },
      {
        "name": "MDN - iframe element",
        "link": "https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/iframe"
      }
    ],
    "user_stories": [
      "Maria, a remote tutor, is trying to compare two educational videos side-by-side embedded in a learning platform. Because both `<iframe>` elements have the same non-descriptive title, she struggles to identify which video is which using her screen reader. It makes her feel frustrated and slows down her lesson planning. If each `<iframe>` had a unique, descriptive `title` attribute indicating the video content, she could navigate quickly and focus on her students instead of troubleshooting the interface.",
      "James, a blind financial analyst, is reviewing dashboards in a reporting tool. Because multiple embedded charts share the same frame title, his screen reader repeats the same label, making it impossible to tell the difference. He feels disoriented and loses confidence in the data. If each frame had a specific title like 'Revenue by Region' or 'Q2 Forecast', he could review insights accurately and efficiently.",
      "Priya, a law student with low vision using a screen reader, is exploring legal databases that use multiple `<iframe>` panels. All frames are labeled generically as 'content', leaving her unsure which contains the main article versus the search filters. She ends up wasting time navigating aimlessly. If each frame were clearly titled, she could find and focus on the relevant text without guesswork.",
      "Tom, a warehouse manager with a screen reader, is using a supply app that embeds several maps and delivery logs. Because the iframes are all titled 'map view', he can’t distinguish between locations. He feels irritated and calls a coworker for help. If each iframe had a unique title like 'Main Warehouse Map' or 'Truck Route Logs', he could get his job done independently.",
      "Yasmin, a visually impaired parent, is registering her child for school through a city portal. Several instructional videos are embedded with the same frame title, making it difficult for her screen reader to guide her. She becomes anxious about missing important information. If the titles were distinct and descriptive, she could follow the instructions with confidence.",
      "Leo, a blind customer service rep, uses assistive tech to access an HR platform that includes help guides in frames. Because they’re all titled 'help', he can’t jump to the correct resource. It leaves him overwhelmed and slows his onboarding. If frames were uniquely titled based on the help topic, he could find answers much faster.",
      "Angela, a retired veteran with vision loss, uses a city council site to watch past meeting videos. Multiple video players are embedded with the title 'video frame', so she doesn’t know which meeting is which. It makes her feel excluded. If each video frame had a title like 'March Budget Meeting' or 'Public Safety Hearing', she could participate like everyone else.",
      "Carlos, a blind engineer, reviews code snippets embedded in an online training course. Each iframe is labeled identically, making navigation tedious and repetitive. He grows frustrated and loses interest in the lesson. If each iframe were titled with the specific coding example (e.g., 'Python Loop Example'), he could stay focused and engaged.",
      "Dee, a job seeker with visual impairment, uses an employment portal that includes job application forms in iframes. All are titled 'form', so she can't tell if she’s on the resume upload or cover letter section. She becomes discouraged and worried she’ll submit the wrong info. With unique and descriptive frame titles, she could complete applications confidently.",
      "Brian, a blind music teacher, accesses online sheet music tools that use multiple frames. They’re all titled 'interactive view', which causes confusion about which frame shows the music versus the controls. He feels blocked from teaching his students. If each frame title described its content, he could teach more fluidly.",
      "Nina, a librarian with low vision, uses a digital archive platform that includes historical documents in frames. All frames are labeled 'document viewer', leaving her unable to distinguish eras or collections. She grows frustrated with each wrong click. Unique frame titles like '1920s Newspaper' or 'Civil Rights Archive' would let her navigate smoothly.",
      "Kevin, a legally blind gamer, is using a strategy guide that embeds gameplay videos in iframes. All are generically titled 'gameplay', making it hard to find the walkthrough he needs. He feels like he’s fumbling through a maze. Distinct iframe titles tied to level names would drastically improve usability.",
      "Lily, a fashion blogger who is blind, is using a CMS that embeds promotional ads and video content. All are labeled 'media frame', causing her screen reader to repeat the same phrase endlessly. She feels overwhelmed and annoyed. If each frame had a specific title (e.g., 'Ad: Summer Sale'), she could skip irrelevant content faster.",
      "Ahmed, a visually impaired student, accesses his online classroom which embeds quizzes, videos, and announcements in frames. Since all titles are 'content frame', his screen reader can’t guide him to the quiz quickly. He panics before deadlines. Specific titles like 'Weekly Quiz' would help him succeed.",
      "Jill, a blind retiree learning to code, accesses a tutorial site that uses iframes for code output and examples. All frames are labeled 'code window', making it hard to tell which shows results. She gets frustrated and feels excluded. Clear titles like 'Live Output' or 'Sample Code' would empower her to learn effectively.",
      "Oscar, a paralegal with low vision, uses a legal research platform that includes multiple frames for statutes, cases, and notes. Each frame is titled 'viewer', making organization difficult. He gets mentally fatigued switching contexts. Unique, descriptive titles would improve his productivity and reduce stress.",
      "Tanya, a blind book reviewer, browses a publisher’s site that includes previews and purchase options in iframes. Because both frames are titled 'preview', she can’t tell which contains the book excerpt. She gives up and leaves. If the frames had unique labels like 'Read Excerpt' and 'Buy Now', she could navigate easily and engage fully.",
      "Sam, a visually impaired HR manager, is completing compliance training on a company LMS. Multiple modules are embedded in iframes titled 'training frame'. He ends up repeating the same content, unsure if he’s progressing. Unique module-specific titles would let him track his learning with clarity.",
      "Gloria, a blind travel blogger, reviews embedded maps and itineraries on a tourism site. Every iframe is titled 'interactive content', so her screen reader can’t differentiate between locations. It’s frustrating and makes her feel lost. Clear, specific titles like 'Day 1: Rome Tour Map' would allow her to write accurately and confidently."
    ],
    "responsibility": ["developer", "content"]
  },
  "frame-title": {
    "title": "Missing Accessible Name on Iframe",
    "summary": "A missing accessible name on iframes prevents users from identifying their purpose. This makes it hard or impossible for screen reader users to interact with embedded content like videos, maps, or forms.",
    "description": "When iframes don't have accessible names, screen readers announce them simply as “frame” with no context. This leaves users unsure what the content is, or whether it’s worth exploring. They may skip it entirely, missing out on key information like videos, maps, or instructions.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Iframe element has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/cae760"
      }
    ],
    "user_stories": [
      "Carlos, a history teacher with vision loss who uses a screen reader, is trying to watch an embedded educational video on a learning platform. Because the iframe containing the video doesn't have an accessible name, his screen reader just says 'frame' without any context. It makes him feel confused and frustrated, unsure whether the content is relevant or if he's even on the right page. If the iframe had a clear title like 'Lecture 3: Civil War Documentary', he could confidently access the content and stay on track with his lesson planning.",
      "Linda, a grandmother learning to shop online, is trying to view a recipe video embedded on a food blog. Because the iframe lacks a descriptive name, her screen reader skips over it, leaving her wondering where the video is. It makes her feel left out and discouraged. If the iframe had a name like 'Recipe Demo Video', she could easily find and enjoy the cooking tutorial.",
      "Jamal, a university student who is blind, is accessing a campus portal to view his class schedule. The iframe with the weekly calendar has no accessible name, so his screen reader offers no useful information. It makes him feel stressed and unprepared. If the iframe had a label like 'Weekly Schedule Viewer', he could efficiently navigate his classes.",
      "Tina, a freelance writer with low vision, uses a screen magnifier to navigate news websites. When she tries to read an embedded article inside an iframe, there’s no title to orient her. She ends up wasting time trying to figure out what the frame contains. If the iframe had a title like 'Guest Editorial Column', she could make better use of her time and energy.",
      "Sam, a deaf software tester who relies on visual cues and transcripts, visits a site with an embedded video player. The iframe is unlabeled, so he’s not sure if it’s a video, ad, or error. It leaves him confused and wary of clicking. If the iframe were titled 'Product Tutorial Video', he could engage confidently and access needed transcripts.",
      "Nina, a busy mom with dyslexia, is trying to follow an embedded how-to video on a parenting blog. Since the iframe isn’t named, her assistive tools don’t help her locate or prioritize it. She feels overwhelmed and loses patience. If the iframe were labeled 'How to Swaddle a Baby', she could focus and follow the instructions more easily.",
      "Ethan, a retired veteran with cognitive challenges, wants to watch a meditation video on a wellness site. The iframe doesn’t have a name, so his navigation tools don’t help him find it. He becomes confused and anxious. If the iframe had a name like 'Daily Meditation Clip', he could find calm content without extra stress.",
      "Priya, a young developer who uses a screen reader, is trying to preview her code output in a browser-based IDE. The iframe showing the output has no accessible name, so it’s unclear what content it holds. She feels uncertain and slows down her workflow. If the iframe had a label like 'Live Output Preview', she could test her code more effectively.",
      "Marcus, a delivery driver studying for a career change, is using an online course platform. An iframe holds a crucial module quiz but isn’t named. His screen reader skips it entirely. It makes him feel like he’s missing opportunities. If the iframe were titled 'Module 5 Quiz', he’d be empowered to complete his lessons.",
      "Jade, a fashion blogger with low vision, wants to embed a sponsored product video in her post. But she notices that many embedded videos don’t include descriptive iframe titles. She worries her blind followers won’t know what they’re watching. If platforms required accessible iframe names like 'Try-on Haul: Summer Dresses', she’d create more inclusive content.",
      "Leo, a high school student who uses a screen reader, tries to review a slideshow embedded from another site. The iframe has no title, so he hears just 'frame' and doesn’t know if it’s part of the lesson. It leaves him frustrated and behind in class. If the iframe had a label like 'Science Project Slideshow', he could follow along easily.",
      "Amina, a city planner with glaucoma, uses accessibility tools that rely on labels to identify regions. An embedded map in a housing report is in an unnamed iframe, so she can't navigate to it. She feels obstructed and less confident in her analysis. If the iframe were named 'Zoning Area Interactive Map', her tools could guide her efficiently.",
      "Jonas, a music teacher who uses a screen reader, tries to access an embedded piano tutorial. The iframe is missing a name, so his reader doesn’t provide context. He feels disoriented and annoyed. If the iframe had a name like 'Piano Lesson: Beginner Chords', he could stay on beat with the lesson.",
      "Elena, a young mom with ADHD, relies on structured navigation to stay focused. An iframe with crucial step-by-step instructions on a parenting site has no accessible name, disrupting her workflow. She feels distracted and flustered. If the iframe were titled 'Step 2: Diaper Change Guide', she could stay organized.",
      "Walter, a retiree with macular degeneration, is using assistive tech to plan a cruise vacation. An iframe with the ship’s virtual tour has no name, so he misses it entirely. He ends up calling support, feeling embarrassed. If the iframe had a clear name like 'Cruise Ship Virtual Tour', he could explore independently.",
      "Kim, a graphic design student who uses a screen reader, tries to view a style guide embedded in her online class platform. The iframe isn't named, so she can’t distinguish it from other content. She feels blocked and uninspired. If the iframe were labeled 'Brand Style Guide Viewer', she could complete her assignment smoothly.",
      "Trevor, a journalist with repetitive strain injury who uses voice navigation, tries to access a story preview embedded in an iframe. Since it’s not named, his voice commands don’t find it. He ends up using the mouse and feeling pain. If the iframe were named 'Preview: Investigative Report', voice tools could help him avoid strain.",
      "Naomi, a senior with age-related hearing and vision loss, is learning about health benefits online. A vital video is embedded in an unnamed iframe, so her screen reader ignores it. She misses crucial information and feels left out. If the iframe were named 'Medicare Explainer Video', she could stay informed.",
      "Felix, a college student with cerebral palsy, uses a combination of voice control and screen reading to navigate. An iframe showing live lecture notes isn't labeled, so he can’t jump to it easily. It causes stress during class. If the iframe were named 'Live Notes Feed', he’d stay synchronized with his peers.",
      "Grace, a retired librarian with early-stage dementia, relies on predictable cues. On a genealogy site, an iframe with an interactive family tree has no name, confusing her. She feels lost and gives up. If the iframe were labeled 'Interactive Family Tree Viewer', she’d enjoy exploring her roots."
    ],
    "responsibility": ["developer", "content"]
  },
  "html-has-lang": {
    "title": "Missing Language Attribute on HTML Page",
    "summary": "Assistive technologies can’t determine the correct language because the lang attribute is missing from the HTML.",
    "description": "Without a specified lang attribute, assistive technologies may default to incorrect language settings. This causes screen readers to mispronounce words, affecting non-native speakers, students, professionals, and anyone relying on accurate audio output. Including a proper language attribute improves clarity and inclusivity.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "3.1.1 Language of Page",
        "link": "https://www.w3.org/TR/WCAG22/#language-of-page"
      }
    ],
    "act_rules": [
      {
        "name": "HTML page has lang attribute",
        "link": "https://act-rules.github.io/rules/b5c3f8"
      }
    ],
    "user_stories": [
      "María, a college student from Spain, is trying to navigate her university's English-language course registration site. Because the site doesn’t specify the language, her Spanish screen reader mispronounces menu items. She feels confused and worried about selecting the wrong courses. If the page had a proper lang=\"en\" attribute, her screen reader could switch to English and pronounce content correctly.",
      "Zhang, an international job seeker, is using a global employment platform in English. Since the page lacks a lang attribute, his Chinese screen reader can't interpret the text correctly. This leads to misunderstandings about job qualifications. If the lang attribute were set to English, he could confidently apply to jobs he qualifies for.",
      "Lucia, a bilingual grandmother, is browsing a recipe blog in French. Without the lang attribute, her screen reader uses its default English voice, making the French text nearly incomprehensible. She feels excluded from enjoying the content. If the HTML specified lang=\"fr\", she could follow the recipe without confusion.",
      "Ahmed, a refugee learning English, uses a screen reader to study a government assistance page. The missing lang attribute causes mispronunciation that leads to misunderstanding deadlines. He feels anxious about missing support. Adding lang=\"en\" would allow accurate audio and reduce his stress.",
      "Emma, a young girl who is blind, wants to read a story online in her native German. The English screen reader voice makes the German story sound garbled because there's no lang attribute. She feels left out. If lang=\"de\" were included, she could enjoy the story in the correct voice.",
      "Carlos, a non-native English speaker using assistive tech, tries to pay a utility bill on an English-only site. His screen reader defaults to Spanish and misreads critical info because the HTML lacks lang=\"en\". He worries he’ll pay the wrong amount. Specifying the page’s language would help him navigate safely.",
      "Nina, a Deaf woman who relies on speech-to-text in Italian, tries to read an English news site. The system transcribes inaccurately because there’s no lang=\"en\" marker. She misses key details and feels misinformed. With the correct lang tag, her software could switch dialects and improve accuracy.",
      "Tariq, a university researcher in Arabic, accesses an English academic archive. Due to the missing lang attribute, his screen reader mispronounces technical terms, slowing his reading. He feels frustrated and behind on work. A lang=\"en\" declaration would help his reader interpret terms properly.",
      "Isabelle, a French-speaking student, wants to read an English comic online. Her screen reader’s mispronunciation due to a missing lang attribute makes punchlines fall flat. She feels disconnected from the humor. Setting lang=\"en\" would restore the comic's timing and flow.",
      "Yuki, a Japanese tourist, uses a translation app on a travel booking site. The app misidentifies the language and mistranslates terms because there's no lang attribute. He feels unsure and hesitant to book. With lang=\"en\", his app could accurately process the page.",
      "Raj, an Indian elder using a Hindi screen reader, tries to follow a yoga tutorial written in English. The incorrect pronunciation caused by a missing lang tag makes it hard to follow poses. He feels discouraged. If the language were specified, he could understand instructions clearly.",
      "Lena, a Swedish businesswoman with dyslexia, uses a text-to-speech browser to read international finance news. The browser defaults to Swedish and reads English articles incorrectly due to missing lang tags. She misses investment details and feels disadvantaged. A proper lang attribute would enable accurate reading.",
      "Victor, a Portuguese speaker, uses a screen reader to fill out a legal aid form in English. Without a lang attribute, the voice output becomes confusing. He worries about making errors in his application. Specifying lang=\"en\" would help him complete forms confidently.",
      "Sofia, a high schooler with vision loss, accesses a multilingual online encyclopedia. A page in Italian lacks a lang attribute, so her English screen reader distorts names and facts. She feels disoriented. Adding lang=\"it\" would allow for smooth language transitions.",
      "Jonas, a retired linguist with macular degeneration, enjoys reading multilingual blogs. When a Japanese article has no lang tag, his screen reader can't switch voices, ruining comprehension. He feels disconnected from content he loves. Setting lang=\"ja\" would restore clarity.",
      "Farah, an Arabic-speaking mother, tries to follow English health advice online. The site lacks a lang tag, so her screen reader doesn’t switch voices. She misinterprets dosage instructions and feels scared. A lang=\"en\" attribute would give her peace of mind.",
      "Paul, a Canadian expat in France, accesses a government site to renew his visa. The French content lacks a lang=\"fr\" tag, causing his English screen reader to butcher pronunciation. He gets frustrated navigating critical information. Adding the correct language tag would make the process smooth.",
      "Nadia, a Russian speaker using a screen reader, tries to buy clothes from an English fashion site. The Russian voice mispronounces product names due to the missing lang attribute, making choices confusing. She abandons her cart. If lang=\"en\" were present, she could shop confidently.",
      "Miguel, a Spanish-speaking farmer, is learning English through an agricultural extension site. With no lang attribute, his reader stays in Spanish, distorting key terminology. He feels left out of learning. Declaring lang=\"en\" would support his educational goals.",
      "Anna, a visually impaired violinist, reads sheet music instructions in Italian. Her English screen reader can't pronounce terms like 'andante' or 'fortissimo' properly because there's no lang attribute. She feels disconnected from her craft. If the page included lang=\"it\", her experience would be enriched."
    ],
    "responsibility": ["developer"]
  },
  "html-lang-valid": {
    "title": "Invalid lang Attribute Value on HTML Element",
    "summary": "A non-standard or incorrect lang code is being used, causing tools to mispronounce or ignore content.",
    "description": "Using an invalid lang value prevents assistive technologies from recognizing the page’s intended language. This disrupts pronunciation, voice selection, and comprehension for users who rely on screen readers or text-to-speech tools. Validating the tag (e.g., changing spn to es) ensures content is presented clearly.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "3.1.1 Language of Page",
        "link": "https://www.w3.org/TR/WCAG22/#language-of-page"
      }
    ],
    "act_rules": [
      {
        "name": "HTML page lang attribute has valid language tag",
        "link": "https://act-rules.github.io/rules/bf051a"
      }
    ],
    "user_stories": [
      "Amina, a Somali student in Sweden, is reading a university application site marked with lang=\"english\". Her screen reader doesn’t recognize this invalid tag and defaults to the wrong language. She feels misled and anxious about missing key info. If the tag used the correct lang=\"en\", her screen reader would guide her accurately.",
      "Lars, a blind musician from Denmark, is browsing a music theory site labeled lang=\"eng-US\". Because this isn’t a valid BCP 47 tag, his screen reader doesn’t switch dialects correctly. He struggles to follow instructions. If the tag were corrected to lang=\"en-US\", his experience would improve instantly.",
      "Priya, an Indian high school student, accesses a test prep site with lang=\"us-english\". Her screen reader fails to interpret this value, leaving her confused. She feels unprepared. Using a valid lang=\"en-US\" would let her study with clarity and confidence.",
      "Tomás, a Spanish-speaking chef, is reading a cooking blog that mistakenly uses lang=\"spn\". His screen reader doesn’t recognize the language, garbling the content. He feels disoriented in the kitchen. Changing it to lang=\"es\" would help him follow along seamlessly.",
      "Jin, a Korean businessman, checks a travel site with lang=\"kr\". Since this isn’t a valid tag, his screen reader doesn’t switch to Korean. He misses booking details and feels frustrated. If the site used lang=\"ko\", it would match his device settings correctly.",
      "Elise, a bilingual Belgian student, visits a French education site tagged with lang=\"fre\". Her assistive tech fails to detect the language, using the wrong voice. She feels distracted and demotivated. A valid lang=\"fr\" would restore comprehension and flow.",
      "Ahmed, a blind Egyptian retiree, accesses a local services portal using lang=\"ara-EG\". This nonstandard tag confuses his screen reader. He can’t follow the text and feels isolated. Using lang=\"ar-EG\" would provide accurate, culturally appropriate narration.",
      "Mira, a Ukrainian refugee in Germany, tries to read a multilingual help page labeled lang=\"deu\". Her screen reader doesn’t switch to German, making legal terms hard to understand. She feels overwhelmed. Setting lang=\"de\" would allow her to grasp important info.",
      "Leo, a Canadian teen with a screen reader, visits a French-Canadian site using lang=\"fr-CA1\". The invalid suffix breaks voice selection. He can’t follow the article and feels left out. A valid lang=\"fr-CA\" would allow accurate pronunciation and support.",
      "Fatima, a Moroccan woman learning English, uses a language app marked lang=\"EN-uk\". Her software doesn’t recognize the case-sensitive code and mispronounces instructions. She’s confused and discouraged. A correct lang=\"en-GB\" would make learning smoother.",
      "Ivan, a Russian engineer, reads a technical blog marked lang=\"ru-RUSSIA\". His screen reader ignores it and uses the wrong voice. He misunderstands critical specs. He feels insecure. Changing it to lang=\"ru-RU\" would ensure accurate vocal rendering.",
      "Sakura, a visually impaired Japanese student, is exploring an anime site with lang=\"jp\". Her screen reader can’t match the tag, misreading character names. She feels detached. Using lang=\"ja\" would provide proper context and connection.",
      "George, a history buff from Greece, reads an article marked lang=\"grc\". His screen reader attempts to use ancient Greek pronunciation on modern text. It’s unintelligible. He gets frustrated. A valid lang=\"el\" tag would align it with contemporary usage.",
      "Zainab, an Arabic-speaking journalist, visits a media archive tagged lang=\"arab\". Her screen reader fails to interpret the language. She feels slowed down in her work. Using lang=\"ar\" would enable smooth, accurate navigation.",
      "Julio, a Venezuelan author, checks an eBook store using lang=\"esp\". His screen reader doesn’t apply the right voice, garbling product titles. He feels disengaged. A valid lang=\"es\" tag would improve clarity and his shopping experience.",
      "Anika, a dyslexic German reader, uses text-to-speech on a newspaper site labeled lang=\"deu-DE\". The invalid code causes glitches in pronunciation. She loses focus. Correcting the tag to lang=\"de-DE\" would restore readability.",
      "Samuel, a blind Nigerian developer, reads API docs marked lang=\"en-uk\". His screen reader skips dialect cues, reading in American English instead. He misses nuances. Using lang=\"en-GB\" would present the correct regional version.",
      "Irina, a Russian-speaking artist, views an online gallery marked lang=\"rus\". The tag isn’t recognized, so her screen reader defaults to English. She feels alienated. With lang=\"ru\", the art descriptions would become accessible.",
      "Chen, a Chinese entrepreneur, uses a business portal labeled lang=\"zh-cn1\". This invalid variant breaks speech synthesis. He misinterprets forms and deadlines. Fixing the code to lang=\"zh-CN\" would restore function and trust.",
      "Kofi, a student in Ghana, visits an educational site marked lang=\"eng\". His screen reader uses the wrong voice, distorting lessons. He feels confused in class. A correct lang=\"en\" tag would support his learning journey."
    ],
    "responsibility": ["developer"]
  },
  "html-xml-lang-mismatch": {
    "title": "Mismatch Between lang and xml:lang",
    "summary": "Mismatched lang and xml:lang values cause inconsistent pronunciation and interpretation for screen reader users.",
    "description": "When a mismatch exists between lang and xml:lang, users may hear inconsistent or conflicting audio outputs. This can cause delays in comprehension, mistakes in understanding critical content (like medical, educational, or financial info), and even abandonment of the task. Aligning both values ensures a smooth, predictable experience.",
    "severity": "moderate",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "3.1.1 Language of Page",
        "link": "https://www.w3.org/TR/WCAG22/#language-of-page"
      }
    ],
    "act_rules": [
      {
        "name": "HTML page lang attribute has valid language tag",
        "link": "https://act-rules.github.io/rules/5b7ae0"
      }
    ],
    "user_stories": [
      "Omar, a blind linguistics student, is reading an academic journal online. The HTML tag says lang=\"en\" but xml:lang=\"fr\", so his screen reader switches between English and French unpredictably. He gets confused and loses track of the article. If both attributes matched, the reader would stay consistent and he could focus better.",
      "Camila, a Spanish-speaking nurse, accesses a training module that lists lang=\"es\" but xml:lang=\"en\". Her assistive tech flickers between voices, misreading critical steps. She feels unsafe proceeding. Aligning both language attributes would ensure clear, reliable narration.",
      "Tarek, a Syrian refugee learning German, uses a translation tool on a site with mismatched lang=\"de\" and xml:lang=\"ar\". The translator can't decide which language to use, returning gibberish. He feels stranded. Matching the attributes would enable accurate translations.",
      "Lena, a Danish student with dyslexia, relies on text-to-speech to study an e-learning site. The conflicting lang=\"en\" and xml:lang=\"da\" values cause voice interruptions. She feels disoriented and demotivated. If the attributes were consistent, her reading would be smooth and supportive.",
      "Nico, a French web developer with low vision, uses screen magnifiers and narration tools. On a job portal, the mismatch between lang=\"fr\" and xml:lang=\"en\" causes inconsistent pronunciation. He mishears deadlines and feels anxious. Fixing the mismatch would restore trust.",
      "Fatou, a blind traveler from Senegal, reads a travel site with lang=\"en\" but xml:lang=\"fr\". Her screen reader speaks with a French accent in English sentences, making tips unintelligible. She feels lost. Matching the language tags would improve clarity.",
      "Jon, a retired American using a screen reader, checks a German insurance site tagged with lang=\"de\" and xml:lang=\"en\". The screen reader inconsistently pronounces terms, confusing legal terms. He feels at risk. If both attributes pointed to German, he’d feel more secure.",
      "Aya, a Japanese translator, accesses a bilingual document marked lang=\"ja\" and xml:lang=\"en\". Her software doesn’t know which language to prioritize, misaligning subtitles. She feels frustrated. Harmonizing the attributes would let her work efficiently.",
      "Ravi, a blind entrepreneur in India, opens a banking app website with lang=\"en\" but xml:lang=\"hi\". The screen reader toggles between languages, disrupting account management. He feels uncertain about his transactions. Consistent language declarations would boost his confidence.",
      "Elena, an Italian grandmother learning English, uses voice software on a medical info page marked lang=\"it\" and xml:lang=\"en\". Her tool alternates voices mid-paragraph, making understanding difficult. She feels vulnerable. If both attributes matched, she’d feel reassured.",
      "Hasan, a Turkish engineer, reads technical documentation online. The mismatched lang and xml:lang attributes confuse his browser’s accessibility features, causing erratic voice shifts. He misses key setup steps. Matching the values would restore flow.",
      "Ava, an Australian art teacher with vision loss, views a gallery site that sets lang=\"en\" and xml:lang=\"zh\". Her screen reader tries to apply a Chinese voice to English text. She can’t follow artist statements. Aligning the tags would keep the reader coherent.",
      "Yusuf, an Arabic-speaking teen in Sweden, browses an education portal with mismatched language settings. His screen reader flickers between Arabic and Swedish voices. He feels stressed and can’t concentrate. Consistent language settings would make learning smoother.",
      "Ines, a Portuguese museum curator, accesses an exhibit archive marked lang=\"pt\" and xml:lang=\"es\". Her assistive reader toggles language voices erratically. She loses important historical context. If the tags were the same, she could explore without barriers.",
      "Marc, a French-speaking tourist, uses a site with mismatched lang and xml:lang for travel info. His screen reader alternates accents, turning city names into gibberish. He feels lost in translation. Proper alignment would support safe travel.",
      "Chi, a Vietnamese exchange student, uses speech tools to access her university dashboard. Mismatched language attributes cause misreadings of schedule times. She feels overwhelmed. Fixing the language mismatch would keep her organized.",
      "Boris, a Russian retiree using an English-learning site, encounters inconsistent voice output due to conflicting lang=\"ru\" and xml:lang=\"en\". Lessons become jumbled. He feels discouraged. Matching the values would keep his study structured.",
      "Greta, a German volunteer for disaster relief, accesses an emergency alert page with lang=\"en\" and xml:lang=\"de\". Her screen reader fails to interpret alerts clearly. She fears giving wrong advice. Harmonized attributes would ensure clarity in crisis.",
      "Malik, a blind software tester, reviews an app’s web interface. The mismatch between lang=\"en\" and xml:lang=\"es\" in the code causes test failures in screen reader output. He feels blocked from reporting bugs. Proper tag alignment would improve accuracy.",
      "Tina, a speech-to-text user with a cognitive disability, relies on consistent voice settings to understand directions. On a shopping site with mismatched language tags, her app delivers garbled results. She gives up. If both tags matched, she'd complete her order easily."
    ],
    "responsibility": ["developer"]
  },
  "image-alt": {
    "title": "Images Missing alt Text",
    "summary": "Without alt attributes or correct roles, images are skipped by assistive technologies, leaving users without crucial context.",
    "description": "When images are not given alternative text or correctly marked as decorative, assistive technologies fail to convey their purpose or message. For users who cannot see the screen, this leads to confusion, exclusion, and incomplete information. Alt text helps ensure equal access to information, shopping experiences, education, and navigation.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      }
    ],
    "act_rules": [
      {
        "name": "Image has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/23a2a8"
      }
    ],
    "user_stories": [
      "Ben, a blind high school student, is researching climate change for a science project. On a government site, images showing climate graphs have no alt text. His screen reader skips over them, leaving out critical data. He feels frustrated and less prepared. If the images included meaningful alt descriptions, he could fully understand the content.",
      "Lila, a visually impaired fashion blogger, is exploring a clothing retailer’s site. The product images don’t have alt text, so her screen reader can’t describe them. She feels excluded and uncertain about what she’s buying. If each image had a brief alt tag describing the outfit, she could shop independently.",
      "Owen, a history teacher who is blind, is reviewing a virtual museum tour. Key artifacts are shown only in images without alternative text. He can’t include them in his lesson. He feels professionally limited. If the images had descriptive alt text, he could teach more effectively.",
      "Marina, a blind grandmother, tries to follow a recipe online. The step-by-step photos don’t have alt text, and she misses key preparation cues. She feels discouraged in the kitchen. With alt text describing each image, she could cook confidently.",
      "Carlos, a blind college applicant, explores a university’s admissions site. Important infographics have no alt text, so he misses deadlines and criteria. He feels unfairly disadvantaged. If images included accessible descriptions, he could apply with confidence.",
      "Yuki, a blind job seeker, browses a career site where company culture is showcased through unlabeled images. He misses nonverbal cues about diversity and inclusion. He feels unsure about applying. Alt text explaining the imagery would give him better insight.",
      "Aisha, a visually impaired mom, shops for baby supplies online. Product images lack alt text, so she can’t compare designs or colors. She feels anxious about buying the wrong item. Descriptive alt tags would empower her to choose the right products.",
      "Raj, a blind tech blogger, visits a hardware review site. Device diagrams and labeled photos are missing alt text, preventing him from understanding the features. He feels blocked from writing his review. If images had alt descriptions, he could engage fully.",
      "Nora, a blind museum patron, checks an art gallery's website. The page features artwork without alt text or roles of presentation. Her screen reader skips over them silently. She feels excluded from the exhibit. Adding alt text or marking them as decorative would clarify the experience.",
      "Sam, a visually impaired voter, accesses a ballot guide. Candidate profiles include photo-based charts with no alt text. He misses key policy comparisons. He feels left out of the civic process. Accessible chart descriptions would support informed decisions.",
      "Leah, a blind high school athlete, browses her school's sports site. Team rosters include photos without alt text, so she can’t identify teammates. She feels disconnected from her community. Descriptive alt text would foster belonging.",
      "Mohammed, a blind immigrant learning English, uses a language app with picture aids. Without alt text, the app becomes confusing and ineffective. He feels lost. Adding simple descriptions would make the tool inclusive and functional.",
      "Gracie, a blind retiree, uses a gardening blog. Step-by-step planting images have no alt attributes. She can’t follow visual cues and feels frustrated. If each photo had descriptive alt text, she could enjoy her hobby again.",
      "Lorenzo, a blind legal analyst, reads an article with embedded graphs and legal illustrations. With no alt text, he misses key interpretations. He feels professionally handicapped. Accurate alternative descriptions would restore equality in the workplace.",
      "Emily, a blind teen using a dating site, browses profiles with photo thumbnails lacking alt text. Her screen reader just says 'image' or 'blank'. She feels awkward and uninformed. If profile pictures had brief descriptive alt tags, she could engage confidently.",
      "Ali, a blind delivery driver, uses a dispatch app that shows routes with icons and map snapshots. Without alt text or proper roles, he can’t interpret visual cues. He feels disoriented. Descriptive alt text or decorative roles would clarify his job.",
      "Hanna, a blind conference attendee, accesses an event site where speaker bios are illustrated with headshots lacking alt text. She feels it’s harder to connect. Alt tags summarizing speaker identity and credentials would improve engagement.",
      "Luis, a blind musician, browses an instrument shop online. Product images lack alt text, so he can’t compare designs. He feels discouraged. With alt tags like 'Acoustic guitar with natural wood finish', he could shop with ease.",
      "Eva, a blind health care worker, reads a COVID-19 information page. Infographics about safety steps have no alt text, leaving her unaware of the procedures. She feels unprotected. Text descriptions for each image would ensure equal access to vital info.",
      "Noah, a blind software tester, audits a web dashboard full of icons and status graphics. Without alt text or a presentational role, he can’t evaluate them. He feels unable to do his job. Adding proper alt attributes or roles would make the dashboard testable."
    ],
    "responsibility": ["developer", "content"]
  },
  "input-button-name": {
    "title": "Input Buttons Missing Accessible Names",
    "summary": "Without accessible names, input buttons are functionally invisible to users relying on screen readers or Braille displays.",
    "description": "When input buttons lack discernible names, users relying on screen readers, Braille displays, or voice control can't determine their purpose. This disrupts critical tasks like submitting forms, navigating steps, or managing personal data. Proper naming of each button (e.g., \"Submit\", \"Next Page\") ensures clarity and inclusivity.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Button has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/97a4e1"
      }
    ],
    "user_stories": [
      "Zoe, a blind high school senior, is applying to college online. On the application form, several input buttons have no labels or text. Her screen reader simply says 'button' multiple times. She feels confused and scared she’ll miss an important step. If each button had a clear name like 'Submit Application' or 'Next Page', she could apply confidently.",
      "Dmitri, a visually impaired accountant, uses keyboard navigation and a screen reader to file taxes. On a government portal, unlabeled buttons make it unclear whether he's saving or submitting. He feels anxious about making mistakes. Adding proper accessible names would ensure accuracy and peace of mind.",
      "Khadija, a blind mother of two, uses a screen reader to shop for groceries online. The checkout form includes buttons with no names, causing her to guess their function. She feels frustrated and wastes time. If buttons were labeled 'Place Order' and 'Apply Coupon', the process would be smoother.",
      "Leo, a DeafBlind student using a Braille display, encounters a school portal where input buttons have no discernible labels. His display shows only 'button'. He feels disoriented trying to submit homework. Accessible names like 'Upload Assignment' would give him clear direction.",
      "Marta, a screen reader user and public transit planner, logs in to a system with buttons labeled only with images. Her reader doesn’t announce their function. She worries she’ll delete data by mistake. Adding textual names like 'Save Schedule' or 'Delete Trip' would eliminate risk.",
      "Ali, a blind entrepreneur, tries to update his business listing online. Buttons on the site have no text, just icons. His screen reader announces 'button' with no context. He feels blocked. If each input button had a label, he could manage his business independently.",
      "Nina, a university student with low vision, magnifies text but can’t decipher icon-only buttons in her campus portal. She often clicks the wrong one and loses work. She feels stressed. Adding text labels to input buttons would improve accuracy and reduce anxiety.",
      "George, a blind retiree, uses assistive technology to access his pension account. Buttons to 'Log In' or 'Reset Password' are unlabeled, making login difficult. He feels locked out. Adding accessible names would make the experience inclusive.",
      "Siti, a visually impaired traveler, uses an airline booking site with icon-only input buttons. Her screen reader skips over their function. She fears missing her flight booking. Adding accessible names like 'Search Flights' would restore trust.",
      "Yusuf, a blind high schooler, fills out a scholarship application. Buttons for uploading files and moving between steps have no names. He feels anxious about submitting incorrectly. Proper labels like 'Next', 'Back', and 'Attach Document' would guide him safely.",
      "Jenna, a blind therapist, uses a patient portal to log session notes. The form’s input buttons have no names, so her screen reader can’t announce their function. She feels uncertain and slows down. Accessible naming would support her clinical work.",
      "Noah, a blind gamer, accesses a site to download accessible games. Buttons for downloading or viewing more info are unlabeled. He gives up. If these buttons had names like 'Download Game' or 'Read Review', he could participate in his hobby.",
      "Olga, a screen reader user, tries to sign up for a vaccine appointment. Buttons with icons have no text alternatives. Her screen reader can't help her schedule the shot. She feels helpless. Proper input button names would empower her to manage her health.",
      "Jacob, a blind voter, accesses a local election site. Buttons to view ballots and register to vote have no names. He feels disenfranchised. Clear, descriptive labels would make the civic process accessible.",
      "Fatima, a screen reader user with dyslexia, fills out an online form to apply for a grant. She encounters multiple input buttons all saying 'button'. She doesn’t know which does what. Descriptive names like 'Submit Form' and 'Save Draft' would make the form usable.",
      "Theo, a blind developer testing a site, finds several input buttons without names. He can’t tell if they function as intended, making QA impossible. He feels blocked in his work. Adding accessible names would support inclusive testing.",
      "Aria, a blind single mom, tries to refill a prescription online. Buttons to confirm or cancel the order aren’t labeled. She fears accidentally canceling her refill. If the input buttons had clear names, she could manage her health securely.",
      "Mateo, a blind Spanish speaker using a translated site, finds that input buttons were translated visually but lack accessible name attributes. His screen reader skips or misreads them. He feels left behind. Providing proper multilingual button labels would support him.",
      "Nour, a blind environmental activist, uses a site to sign petitions. Buttons to 'Sign Now' or 'Share' are unlabeled and read as 'button'. She feels powerless to take action. Clear accessible names would let her participate fully.",
      "Kai, a blind screen reader user, browses an art portfolio site. Image upload and preview buttons lack accessible names, making it hard to submit work. He feels excluded from the creative community. Adding clear labels like 'Upload Image' would foster inclusion."
    ],
    "responsibility": ["developer", "content"]
  },
  "input-image-alt": {
    "title": "Image Input Buttons Missing alt Text",
    "summary": "Without alt attributes, image-based buttons are inaccessible, causing confusion and possible task failure for blind users.",
    "description": "Image input buttons without alt attributes lack accessible names, making them functionally invisible to screen reader users. This can result in users being unable to confirm critical actions such as submitting applications or completing purchases. Providing descriptive alt text improves usability and aligns with accessibility requirements.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      },
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Image button has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/59796f"
      }
    ],
    "user_stories": [
      "Maya, a blind artist, tries to submit her portfolio through an art contest site. The submission button is an image with no alt text. Her screen reader just says 'button', so she’s unsure if it submits or previews her work. She feels stressed and afraid of losing her submission. If the input image had alt text like 'Submit Portfolio', she could act confidently.",
      "Jorge, a blind small business owner, is applying for a business license online. The form ends with an image button that has no alt text. His screen reader can’t tell him what it does. He feels anxious and hesitant to proceed. Adding alt text like 'Submit Application' would make the process clear and safe.",
      "Aya, a visually impaired student, is taking a timed online quiz. The 'Next' and 'Submit' controls are image buttons with no text. She wastes time guessing. She feels panicked. If the image buttons had descriptive alt attributes, she could navigate quickly and securely.",
      "Liam, a blind retiree, tries to renew his driver's license online. The 'Submit Payment' button is an image with no alt text. His screen reader can’t tell him what it's for. He feels uncertain and fears making a mistake. Alt text would allow him to complete the process with confidence.",
      "Chiara, a blind voter, uses a site to request a mail-in ballot. The final button is an image with no alternative text, so her screen reader doesn't announce its function. She feels disenfranchised. Adding alt text like 'Confirm Ballot Request' would restore her independence.",
      "Omar, a blind father, is trying to sign his child up for school. The form ends with an unlabeled image button. He’s unsure if he submitted the application. He feels helpless. If the button had alt text like 'Submit Registration', he could complete it confidently.",
      "Yasmine, a blind user, accesses a language-learning site. An image button to 'Check Answer' lacks alt text, so her screen reader can’t announce it. She feels stuck in her lesson. With a descriptive alt like 'Check Answer', she could proceed without guessing.",
      "Andrei, a screen reader user, tries to log in to a job site. The login form uses an image button with no alt attribute. He doesn’t know whether it logs in or resets the form. He feels confused. Adding an alt like 'Log In' would clarify its purpose.",
      "Hana, a blind refugee, is filling out an immigration form. She encounters an image button with no alt text that finalizes submission. She’s scared of doing it wrong. If the button included alt=\"Submit Form\", her experience would be safer and more accessible.",
      "Dylan, a blind software engineer, tests a new client portal. Buttons to 'Upload' and 'Cancel' are images with no alt text, causing accessibility test failures. He feels blocked. Alt text would allow full screen reader testing and compliance.",
      "Salma, a visually impaired nurse, uses an online training portal. Image-based navigation lacks alt text, making it unclear what action each button performs. She feels disoriented. Descriptive alt text would help her progress in training.",
      "Isaac, a blind college applicant, fills out a scholarship form. The 'Save Progress' image button has no alt text, so he misses the option and has to start over. He feels defeated. Adding alt text would prevent data loss and frustration.",
      "Ana, a blind legal assistant, tries to download a contract. The button is an image icon with no alt text, leaving her confused. She feels professionally limited. If the image input had alt=\"Download PDF\", she could work independently.",
      "Tariq, a blind environmental activist, signs a petition online. The 'Sign Now' image button has no alt text, and his screen reader announces nothing. He’s unsure if he participated. Adding alt=\"Sign Petition\" would ensure clarity and action.",
      "Emma, a blind high schooler, submits her college essay via a school portal. The final step is an image button without alt text. She can’t confirm the action. She feels worried. Including alt text like 'Submit Essay' would provide reassurance.",
      "Gabriel, a blind pet owner, uses a vet appointment site. The 'Book Appointment' button is an image input with no alt attribute. He’s unsure whether it completed the request. He feels uncertain. Alt text would make the interface usable.",
      "Mei, a blind chef, orders supplies from a culinary site. The checkout uses image buttons with no alternative text. She doesn’t know how to confirm or edit her cart. She feels frustrated. Proper alt text like 'Proceed to Checkout' would guide her clearly.",
      "Noor, a blind teenager, accesses a social media site where 'Like', 'Comment', and 'Share' actions are image inputs without alt text. She can’t interact meaningfully. She feels excluded. Descriptive alt attributes would let her participate.",
      "Elias, a blind customer service agent, accesses a web tool with image-only action buttons. None have alt text, so his screen reader provides no context. He makes errors. Alt text like 'Mark as Resolved' or 'Escalate' would prevent mistakes.",
      "Rina, a blind voter, reviews an election guide site. The 'Print Ballot', 'Email Ballot', and 'Submit' buttons are image inputs with no alt attributes. She feels unsure about what action she's taking. Descriptive alt text would provide clarity and control."
    ],
    "responsibility": ["developer", "content"]
  },
  "label": {
    "title": "Form Fields Missing Accessible Labels",
    "summary": "Without labels, form elements are announced generically as “edit” or “textbox,” preventing users from understanding what information is needed.",
    "description": "When labels are not programmatically linked to form inputs, users with disabilities may hear generic announcements like “edit” or “textbox” with no context. This creates barriers for blind users, users with cognitive disabilities, and anyone relying on assistive tech.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Form field has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/e086e5"
      }
    ],
    "user_stories": [
      "Lina, a blind graduate student, is filling out a housing application. Many form fields have no labels, so her screen reader just says 'edit text'. She can’t tell what each field is for. She feels anxious about submitting incorrect information. If every field had a clear label like 'Name', 'Phone Number', or 'Email', she could complete the form confidently.",
      "Carlos, a visually impaired job seeker, tries to apply for a position online. The form includes several text inputs without labels, so his screen reader can’t guide him. He feels lost and abandons the application. If each field had a programmatic label, he could apply without barriers.",
      "Zara, a blind mother of three, is registering her children for school. The form has dropdowns and text inputs with no labels. She’s afraid of making mistakes with critical information. Adding accessible labels would make the process clear and safe for her.",
      "Theo, a DeafBlind developer using a Braille display, accesses a volunteer sign-up form. The fields lack labels, so his display just shows 'textbox'. He’s confused about what to enter. If each form field had a meaningful accessible name, he could sign up independently.",
      "Nadia, a screen reader user with dyslexia, accesses a survey form. Input fields are missing labels, making navigation impossible. She feels frustrated and excluded. Adding labels like 'Date of Birth' or 'Address' would make the form usable.",
      "Marcus, a blind athlete, tries to register for a marathon. The registration form lacks labeled fields, so he can’t complete it with his screen reader. He feels disappointed and excluded. Proper labeling would let him register like everyone else.",
      "Amina, a blind artist, submits artwork to an online gallery. The upload form includes fields for title and description but no labels. She’s unsure what to enter. Adding clear labels would empower her to share her work confidently.",
      "Sam, a blind college freshman, is trying to log into the campus portal. The username and password fields aren’t labeled, so his screen reader reads both as 'edit'. He can’t tell which is which. Adding 'Username' and 'Password' labels would resolve the confusion.",
      "Ravi, a visually impaired retiree, tries to order groceries online. Fields for delivery instructions and payment info are unlabeled. He worries he’s entering data in the wrong places. Proper labels would support safe, independent shopping.",
      "Chloe, a blind voter, accesses an election registration form. Without labeled fields, her screen reader can’t announce what information is needed. She feels disenfranchised. Adding accessible names to each field would ensure her participation.",
      "Mei, a blind graduate student, is filling out a financial aid form. Several critical fields have no labels. She can’t determine which information to provide. She feels stressed. Labeled fields would let her access support with confidence.",
      "Jorge, a blind father, is updating insurance details. The form has multiple unlabeled checkboxes and input fields. He’s uncertain about changes he’s making. Labels would make the process secure and manageable.",
      "Emily, a visually impaired teen, signs up for an online tutoring session. She encounters unlabeled time and date fields. She’s afraid of scheduling mistakes. Adding specific labels would guide her through booking clearly.",
      "Malik, a blind veteran, applies for healthcare online. The form has radio buttons without labels, so his screen reader says only 'radio button'. He’s unsure what he’s selecting. Accessible labels would ensure informed choices.",
      "Sophia, a screen reader user, logs into her favorite book site. The login form has no input labels, so her screen reader can’t guide her. She feels locked out. Adding descriptive labels would welcome her back.",
      "Jonas, a blind software tester, evaluates a banking app. The sign-up form lacks labels, making it inaccessible. He flags it as a blocker. With correct labels, the form would pass accessibility QA.",
      "Laila, a blind nurse, fills out an internal hospital form for patient data. Missing field labels create confusion and risk of error. She feels nervous. Accurate field labeling would protect her and her patients.",
      "Elena, a visually impaired travel agent, books client flights. She encounters booking forms without labeled fields, slowing her down. She feels less efficient. Proper labeling would streamline her work.",
      "David, a blind retiree, fills out a customer feedback form. Without labels, every field sounds the same to his screen reader. He feels unheard. Adding distinct labels would allow him to share his experience meaningfully.",
      "Arjun, a blind student, accesses a feedback form on an educational platform. He wants to submit a suggestion but can’t tell which field is which. He gives up. Labels like 'Name', 'Email', and 'Message' would enable him to contribute."
    ],
    "responsibility": ["developer", "content"]
  },
  "link-in-text-block": {
    "title": "Inline Links Lack Non-Color Visual Cues",
    "summary": "Without visual cues like underlines or bold text, links can become invisible to many users with visual impairments.",
    "description": "Inline links that are not underlined or otherwise differentiated from surrounding text blend in for users with limited color perception. This impedes their ability to recognize actionable items, especially in dense content like academic or policy writing. Adding visible styling cues ensures everyone can navigate effectively.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.4.1 Use of Color",
        "link": "https://www.w3.org/TR/WCAG22/#use-of-color"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Nina, a college student with color blindness, is researching climate policy for a paper. On a blog, links are only shown in green text, which she can’t distinguish from black. She misses crucial sources. She feels frustrated and disadvantaged. If the links were also underlined or bolded, she could navigate and cite resources effectively.",
      "Leo, an older adult with low vision, reads news articles on a local site. The links are a slightly different shade of blue from the body text, but not underlined. He can’t tell what’s clickable. He feels confused and gives up. Adding underlines or icons would make links stand out clearly.",
      "Aisha, a student with red-green color blindness, is reading an online class syllabus. The assignment links are red, just like the surrounding text. She doesn’t realize there are links to instructions. She feels unprepared. If links were also underlined or bold, she would feel confident accessing materials.",
      "Thomas, a colorblind high schooler, uses a study guide with blue links embedded in black text. The color difference is too subtle for him. He misses extra credit tasks. He feels unfairly penalized. If the links included underlines, he would clearly see what to click.",
      "Maria, a low-vision screen magnifier user, reads a parenting blog. The post includes embedded product links styled only with color. She can’t distinguish them and misses affiliate discounts. She feels left out. Adding a visible underline or icon would improve accessibility.",
      "James, a developer with mild deuteranopia, accesses API docs where links are blue among black text but not underlined. He overlooks crucial methods and parameters. He feels inefficient. A secondary visual cue like underlines would help him work accurately.",
      "Keisha, a visually impaired author, reviews publisher submission guidelines. Key links are color-only in a long paragraph. She misses the submission form and deadline. She feels disheartened. If the links were visually distinct with a style like underline, she could meet requirements.",
      "Omar, a dyslexic reader, accesses a government page with lots of policy text. Links are colored blue but not underlined. He finds it hard to scan for links among the content. He feels overloaded. With visible underlining, he could identify and follow links with ease.",
      "Sophie, a student with protanopia, reads an online journal. Important references are linked in colored text only. She misses them while skimming. She feels academically behind. Adding underlines or symbols would keep her on track.",
      "Raj, a teacher with low vision, reviews an online gradebook. Help links appear in color but not underlined. He doesn’t notice them and struggles with features. He feels frustrated. Clear link styling would enhance usability.",
      "Dana, a colorblind gamer, reads patch notes on a game site. Hyperlinks to changes are shown in green with no underline. She can’t distinguish them from other text and misses important updates. She feels left out. Using underline styling would fix the issue.",
      "Luca, a low-vision linguist, studies a multilingual glossary. Linked translations are in light blue text only. He can’t tell them apart from definitions. He feels slowed down. With underlining, he could explore terms efficiently.",
      "Naomi, a senior citizen with age-related vision loss, reads a medical information site. Links are differentiated by color alone. She misses links to dosage info. She feels unsafe and misinformed. If links were underlined or bolded, she would feel more secure.",
      "Ahmed, a colorblind app developer, uses design documentation that relies on color-only links. He skips over sample code links. He feels blocked. If links had distinct formatting beyond color, he could work faster and more accurately.",
      "Lily, a college freshman with visual tracking issues, finds it hard to pick out colored links in long academic texts. She misses citations and further readings. She feels academically behind. A consistent visual cue like underline would help her scan content.",
      "Tariq, a blind user with partial vision, reads with high contrast settings. The site he visits uses dark green links without underlines, blending into the body text. He doesn’t realize there are links. He feels excluded. Adding underlines would solve this.",
      "Isla, a designer with tritanopia, explores a typography blog. All links are styled with light-blue color only. She can't distinguish them from text. She misses tutorial links and feels limited. A visible underline would make all links easy to spot.",
      "Max, a software QA engineer with color blindness, tests a site where all links rely on a navy shade. He can’t reliably find them for testing. He feels frustrated. If links included underlining, he could complete his tests accurately.",
      "Olga, a history professor with low contrast sensitivity, reads an academic archive. The site uses light-colored links with no underline. She overlooks footnotes and related content. She feels that she’s missing out. Better visual distinction would help her fully engage.",
      "Victor, a colorblind student in a STEM program, uses an online textbook. Important problem sets are linked in colored text with no visual differentiation. He misses assignments and falls behind. Adding underlines to links would make the textbook accessible to him."
    ],
    "responsibility": ["developer", "design"]
  },
  "link-name": {
    "title": "Links Missing Descriptive Text",
    "summary": "Users with assistive technologies cannot understand or use links that rely solely on icons or images without text.",
    "description": "Screen readers rely on accessible names to announce what each link does. When links are represented only by images or have no descriptive label, users hear “link” with no context. This creates barriers to completing essential tasks, like registering, applying, or accessing documents.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "2.4.4 Link Purpose (In Context)",
        "link": "https://www.w3.org/TR/WCAG22/#link-purpose-in-context"
      },
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Link has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/c487ae"
      }
    ],
    "user_stories": [
      "Luis, a blind job seeker, visits a recruitment site with several icon-only links for viewing job details. His screen reader just says 'link' with no context. He feels lost and misses opportunities. If each link had clear text like 'View Job Posting', he could navigate and apply confidently.",
      "Mei, a visually impaired student, accesses an academic portal with several links labeled only with images. Her screen reader reads them as 'link' or 'blank'. She can’t tell which leads to her grades or schedule. She feels overwhelmed. Adding descriptive link text would give her clear direction.",
      "Omar, a blind traveler, uses a booking site where links are shown with icons and no text. His screen reader can't announce what each link does. He worries about booking the wrong flight. Providing accessible names like 'Book Now' or 'Change Date' would ease his experience.",
      "Fatima, a blind nonprofit director, reviews her organization's website. Some links for documents are just PDFs icons with no alternative text. Her screen reader skips them or calls them 'link'. She feels embarrassed about the site’s inaccessibility. If links had clear names, her team could make informed updates.",
      "Theo, a screen reader user, tries to navigate a city services site. Several links are empty or only have a generic label like 'Click here'. He doesn’t know what services they point to. He feels uncertain and frustrated. Adding descriptive text like 'Apply for Parking Permit' would clarify the options.",
      "Lila, a blind librarian, browses a digital archive where linked images lead to documents but have no accessible names. She can’t tell which period or subject the documents relate to. She feels unable to help patrons. Adding alt text or visible names would restore usability.",
      "Aiden, a blind teen, uses a site to register for summer camp. Icon-only links with no text leave him guessing what each does. He worries he’ll miss important steps. With link names like 'Register' or 'Pay Fee', he could sign up smoothly.",
      "Jasmin, a blind small business owner, tries to download tax forms from a government portal. The links are PDF icons without text, and her screen reader announces nothing. She feels excluded and unsupported. Adding descriptive text like 'Download Tax Form 1040' would provide equal access.",
      "Leo, a blind voter, accesses an election site where key links to 'Register to Vote' and 'Find Polling Place' are icon-based with no names. He misses critical services. He feels disenfranchised. Accessible link names would restore civic access.",
      "Sofia, a blind art student, visits a virtual gallery. The artworks are linked images without alt text or labels. Her screen reader announces 'link' repeatedly with no context. She can’t explore the exhibit. Descriptive link names like 'View Artwork: Starry Night' would allow engagement.",
      "Ahmed, a blind father, uses a healthcare site to schedule an appointment. Link buttons only contain icons. His screen reader announces 'link'. He doesn’t know what they do. He feels stressed. Adding accessible names like 'Schedule Visit' would help him manage his care.",
      "Grace, a blind museum guide, reviews an online exhibit tour. Links to audio guides are image-only with no names. Her screen reader skips them. She feels disconnected from content she teaches. Clear names like 'Play Audio Guide for Room 1' would support her work.",
      "Niko, a blind college applicant, is reviewing scholarship options. Links are marked 'Read more' without context. He doesn’t know which program they refer to. He feels misled. Adding context like 'Read more about STEM Scholarship' would clarify the content.",
      "Anya, a blind public health worker, accesses a COVID resources site. Buttons styled as links have no labels. Her screen reader skips them or reads them as 'link'. She can’t find vaccination forms. She feels helpless. Adding accessible names would support her work and community.",
      "Lorenzo, a blind musician, uses a streaming platform where play, download, and share icons are links without names. His screen reader provides no feedback. He feels left out. Descriptive text like 'Play Track' or 'Download MP3' would let him engage fully.",
      "Kim, a blind event planner, checks a venue’s site for available rooms. Calendar navigation links are empty or labeled with symbols. Her screen reader doesn’t interpret them. She feels unable to do her job. Naming links like 'Next Month' or 'View Availability' would solve this.",
      "Daniel, a blind journalist, uses a news aggregator. Each headline is a link, but sometimes links are just numbers or codes with no context. He feels misinformed. Proper headlines as link names would let him choose articles intelligently.",
      "Amina, a blind ESL learner, accesses an educational portal. Several icons link to lessons but have no names. She can’t tell grammar from reading exercises. She feels disoriented. Labeling links like 'Grammar Practice: Verbs' would help her succeed.",
      "George, a blind retiree, visits a banking site. Icons linking to statements and transfers have no names. His screen reader skips them or says 'link'. He’s worried about managing his finances. Accessible text like 'View Statement' or 'Make Transfer' would restore his confidence.",
      "Tariq, a blind nonprofit volunteer, accesses an event coordination app. Links with only icons are unreadable to his screen reader. He misses meeting invites and sign-up sheets. He feels isolated. Giving each link a descriptive accessible name would let him participate fully."
    ],
    "responsibility": ["developer", "content"]
  },
  "list": {
    "title": "Visually Styled Lists Lack Semantic Markup",
    "summary": "Lists built with paragraphs, line breaks, or divs are not announced as lists, confusing users who rely on assistive tech.",
    "description": "Lists formatted with paragraph or div tags do not convey structure to assistive technologies. Users who depend on screen readers are not informed of the number of items or their sequence, which can make content harder to understand. For tasks like reviewing steps, reading checklists, or understanding grouped content, semantic markup is essential.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Rosa, a blind grocery shopper, uses a screen reader to check a store’s weekly specials. The list of items is formatted with line breaks instead of semantic list tags. Her reader doesn’t announce it as a list, making it hard to track. She feels frustrated and skips it. If the list used proper <ul> and <li> tags, she could navigate it easily.",
      "Hassan, a blind high school teacher, reviews a curriculum page with several topics grouped as a list but formatted with paragraph tags. His screen reader doesn’t recognize it as a list. He feels confused about the structure. If semantic list markup were used, he could understand the grouping clearly.",
      "Mina, a screen reader user, shops for clothing online. The product filters appear visually as lists but are coded with <div> elements. Her screen reader skips the structure. She feels overwhelmed. If filters were structured using proper list elements, she could browse with clarity.",
      "Liam, a blind engineer, reviews a parts catalog. The specs are presented as bullet points made with dashes and line breaks. His screen reader doesn’t treat it as a list. He struggles to compare products. Semantic list tags would allow structured navigation and better comparison.",
      "Lucia, a blind student, reads a study guide. The review topics are shown as a visual list but aren’t marked up as one. Her screen reader can’t announce the number of items. She feels disoriented. If the list used proper markup, she’d know how much material to study.",
      "Andre, a blind voter, checks a site listing election deadlines. The page uses paragraphs to separate items, not list tags. His screen reader reads it as a block of text. He feels overwhelmed. Semantic lists would help him understand each date and its purpose.",
      "Nina, a blind job seeker, reads a company’s benefits summary. Perks are shown as styled divs with no semantic grouping. She can’t tell where one benefit ends and another begins. She feels misinformed. Structured <ul> or <ol> tags would present the content clearly.",
      "Carlos, a blind restaurant manager, views a site listing weekly menus. The meals are separated visually but not with HTML list tags. His screen reader treats them as disjointed text. He feels disconnected. If the meals were in a proper list, he could plan easily.",
      "Yuki, a blind museum guide, checks an exhibit list online. It's formatted with line breaks and images but no list markup. Her screen reader reads items out of order. She feels confused. Semantic list structure would maintain logical flow.",
      "Samira, a blind community organizer, browses a nonprofit site listing donation options. Each option is presented in styled boxes without list elements. Her screen reader doesn’t convey relationships between them. She feels uncertain about what to select. Proper list tags would provide structure and confidence.",
      "Max, a blind software tester, audits a site that presents user benefits as checkmarks with no list semantics. He flags the site for usability issues. He feels like his role is hindered. Semantic list use would allow better automated and manual testing.",
      "Tina, a visually impaired researcher, reads a scientific abstract with key findings presented as bullets made using Unicode characters. Her screen reader skips over the structure. She feels like she missed context. Replacing them with <li> elements would make the list accessible.",
      "Omar, a blind screen reader user, explores a travel site where destinations are styled like a list but coded with spans. His screen reader reads it as one long line. He gets disoriented. Using <ul> or <ol> would let him navigate destination by destination.",
      "Selina, a blind librarian, checks a book recommendation site. The top ten lists are visually numbered but lack <ol> tags. She can’t tell the order or count. She feels left out. Proper list structure would provide meaningful navigation and context.",
      "Raj, a blind student, accesses a lecture outline that uses <div> tags instead of lists. His screen reader can’t announce it as an outline. He feels unprepared. Using proper list semantics would help him follow the content step by step.",
      "Ana, a blind healthcare worker, reads a patient care checklist that lacks list tags. The tasks blur together in her screen reader. She feels at risk of missing steps. Semantic lists would present each task clearly and safely.",
      "George, a screen reader user, accesses a FAQ page where questions are styled as list items but coded with paragraphs. He can’t tell how many questions there are. He feels uncertain. If the questions were in a proper list, he’d have better overview.",
      "Marisol, a blind parent, views a school supply list. Items are displayed with icons but not as list elements. Her screen reader skips the grouping. She misses needed items. Structured <ul> tags would help her prepare her child properly.",
      "Ismail, a blind intern, accesses onboarding steps on a company site. They’re shown as a visual checklist without list markup. His screen reader doesn’t announce it as sequential. He misses tasks. Semantic <ol> or <ul> tags would clarify the order.",
      "Chloe, a blind user, reads a recipe online. The ingredients are separated visually but coded with divs. Her screen reader jumbles the text. She feels confused. Proper list markup for ingredients would make following the recipe much easier."
    ],
    "responsibility": ["developer"]
  },
  "listitem": {
    "title": "List Items Used Outside Valid List Containers",
    "summary": "List items are not properly nested, which prevents assistive technologies from recognizing them as grouped content.",
    "description": "List items that are placed directly inside non-list elements (e.g., <div>, <section>, or <p>) are not recognized as list components by assistive technologies. This impacts navigation, comprehension, and task execution for blind or visually impaired users. Wrapping <li> elements in valid parent lists restores structure and clarity.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Fatima, a blind community college student, reviews a study guide where bullet points use <li> tags but aren’t wrapped in a <ul>. Her screen reader skips list cues, reading items as disconnected lines. She feels confused. If the <li> tags were nested properly in a <ul>, she could follow the material clearly.",
      "Omar, a blind father, checks a parenting blog listing baby milestones. The <li> elements are used outside a proper list container. His screen reader doesn’t announce them as a group. He feels unsure what the list is meant to convey. If they were enclosed in a <ul>, the milestones would be much clearer.",
      "Jenna, a visually impaired project manager, reviews a task outline where items use <li> tags directly in a <div>. Her screen reader reads them as body text. She misses task order. She feels unorganized. Using a proper <ol> structure would maintain clarity and sequence.",
      "Raj, a blind software engineering student, checks a tutorial site where instructions are marked with <li> tags without a parent list. His screen reader ignores the list relationship. He feels disoriented. If the <li>s were within a <ul> or <ol>, he could follow the steps smoothly.",
      "Nina, a blind conference speaker, browses an event schedule where sessions are in <li> tags placed outside any list container. Her screen reader skips structural cues. She feels overwhelmed. Wrapping the <li> elements in a <ul> would provide navigation and clarity.",
      "Tomás, a blind chef, reads a recipe where ingredients are marked with <li> but not nested in a list. His screen reader reads them as plain text. He confuses measurements. He feels unsure in the kitchen. Proper list structure would guide his preparation.",
      "Aisha, a blind teacher, reads a classroom checklist that uses <li> tags inside <div>s. Her screen reader doesn’t group them. She can’t track completed tasks. She feels unproductive. Nesting the <li>s in a <ul> would support her routine.",
      "Luis, a screen reader user, reviews a company’s mission statement structured with <li> tags outside any list. It reads like fragmented sentences. He feels confused. Placing the items within a semantic list would convey purpose and intent.",
      "Mei, a blind student, accesses a grading rubric that uses <li>s without a list container. Her screen reader provides no context or structure. She feels unsure how the rubric works. If wrapped in a <ul> or <ol>, the rubric would be understandable.",
      "Tariq, a blind voter, reads ballot initiatives online. Each initiative is listed using <li> tags inside a <section> with no list wrapper. His screen reader doesn’t recognize the grouping. He feels disoriented. Proper nesting in a <ul> would offer clarity.",
      "Chloe, a blind traveler, browses a packing checklist on a blog. The items are coded as <li>s but aren’t inside a list container. Her screen reader announces them as separate lines. She misses some items. A semantic list would make packing easier.",
      "Daniel, a blind consultant, checks a company’s services page. Services are presented as <li> tags inside a grid of <div>s. No parent <ul> exists. He can’t tell if the items relate to each other. He feels uncertain. Wrapping the items in a list would improve comprehension.",
      "Yara, a blind high schooler, reviews a science fair judging criteria list. The points are <li>s without a <ul>. Her screen reader doesn’t present them as grouped. She feels unprepared. Semantic correction would clarify expectations.",
      "George, a blind veteran, reads a benefits summary. The details are formatted as <li>s without being inside a list container. He can’t distinguish the items from surrounding text. He feels confused about his entitlements. Using proper list markup would solve this.",
      "Anya, a blind teen, uses a tutoring site with a study checklist. Items are marked with <li> but placed directly in <div>s. Her screen reader doesn’t treat them as a list. She misses several tasks. Placing <li>s in a <ul> would help her stay on track.",
      "Malik, a blind office manager, checks a web-based to-do list. The entries are <li> tags used inside a layout grid with no <ul>. He doesn’t get audible feedback about item count. He feels disorganized. Proper list structure would improve navigation.",
      "Leila, a blind civic volunteer, accesses a list of community events. The HTML uses <li> tags placed loosely in paragraphs. Her screen reader skips over the structure. She misses dates. Nesting <li>s within a list would ensure accuracy.",
      "Kai, a blind music student, reads a list of required materials on a class page. The materials are <li>s without a parent list. He hears them as unrelated lines. He forgets items. Semantic list structure would aid memory and prep.",
      "Greta, a blind screen reader user, checks a health site’s list of allergy symptoms. The <li> tags aren’t part of any list. Her screen reader jumbles them. She feels misinformed. Using proper list containers would ensure clarity.",
      "Ravi, a blind student, reads a scholarship application guide. Tips are displayed as <li>s placed in floating boxes with no parent <ul>. He hears them as fragmented notes. He feels lost. Wrapping them in a list would group the advice meaningfully."
    ],
    "responsibility": ["developer"]
  },
  "marquee": {
    "title": "Marquee Element Used",
    "summary": "Scrolling text in a marquee moves too quickly or cannot be paused, making it unreadable for many users.",
    "description": "The <marquee> tag causes text to scroll automatically, which can be disorienting for users with ADHD, dyslexia, or cognitive disabilities. It also presents timing issues for assistive technology users, such as screen readers or Braille displays, which may not capture the full message. A static or pause-enabled format would provide equitable access.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.2.2 Timing Adjustable",
        "link": "https://www.w3.org/TR/WCAG22/#timing-adjustable"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Raj, a blind student using a screen reader, visits a university site where announcements scroll across the page in a marquee. His screen reader can't catch the full message before it disappears. He feels anxious and uninformed. Replacing the marquee with a static or pausable banner would let him access all the content clearly.",
      "Nina, a DeafBlind shopper using a Braille display, browses an online store with marquee banners for sales. The moving text updates too quickly for her display to interpret. She misses key discounts. She feels frustrated and left out. A static or user-controlled announcement would give her equal access.",
      "Omar, a neurodivergent visitor, views a site with scrolling marquee headlines. The constant motion distracts him and makes it hard to focus on the rest of the page. He feels overwhelmed. If the motion could be paused or removed, he could process information better.",
      "Maria, a visually impaired reader, visits a library site where new arrivals scroll in a marquee. The moving text makes it hard to read at her own pace. She feels discouraged from exploring books. A pause or stop button would help her stay engaged.",
      "Leo, a dyslexic student, tries to read class updates in a marquee. The scrolling motion worsens his tracking ability. He feels disoriented. Displaying updates in a static list would improve comprehension and comfort.",
      "Jasmine, a low-vision user, accesses a community center site. The marquee containing event info scrolls too quickly for her screen magnifier. She misses events. She feels excluded. A still or controllable text section would ensure she stays informed.",
      "Ethan, an older adult with mild cognitive decline, is confused by the moving text on a health portal. The marquee makes it hard to read important messages. He feels stressed and avoids the site. Static text would support clear understanding.",
      "Amina, a blind mother, accesses a school site for emergency alerts. The marquee scrolls fast, and her screen reader can’t keep up. She fears missing important safety info. Replacing the marquee with accessible ARIA live regions would deliver alerts clearly.",
      "Ben, a student with ADHD, finds the marquee on an educational site distracting. The constant movement pulls his attention away from his coursework. He feels frustrated. If the marquee were removed or user-controlled, he could focus better.",
      "Tariq, a screen reader user, visits a nonprofit site where the donation appeal scrolls in a marquee. His reader misses the call to action. He feels unable to contribute. A static section would let him support the cause.",
      "Emily, a blind gamer, checks a game news site. The latest updates scroll in a marquee too quickly for her screen reader to interpret. She feels out of the loop. A non-moving, keyboard-navigable list would keep her informed.",
      "Grace, a visually impaired user, reads an event page where important details scroll across the top. The marquee moves too fast and lacks controls. She misses the date. She feels uncertain. Static headings would solve the issue.",
      "Zain, a student with low literacy, finds it hard to read the scrolling text in a campus info marquee. He needs more time to process. He feels ashamed and gives up. Replacing the marquee with expandable static sections would help him engage at his own pace.",
      "Kofi, a blind user, checks a transport site. Delay notices appear in a marquee that scrolls too fast. His screen reader can't catch the updates. He misses changes and feels stranded. Making updates accessible via live regions or static text would improve travel planning.",
      "Yuki, a student with motion sensitivity, gets nauseated by the moving text on a school’s homepage. She avoids looking at the screen. She feels unwelcome. A motion-free interface would allow her to participate without discomfort.",
      "Ana, a blind developer, checks a client’s homepage with multiple marquees. They interfere with her screen reader’s flow. She finds the site hard to audit and feels blocked. Removing marquees would enhance usability and auditability.",
      "Ivan, a veteran with PTSD, finds the rapidly scrolling marquee on a charity site triggering. He can't concentrate. He feels distressed. A calm, static design would support safe access.",
      "Elena, a blind advocate, tries to join a live town hall. The link scrolls in a marquee that moves too fast for her screen reader. She misses the session. She feels silenced. A static button would support timely participation.",
      "Haruto, a blind user using voice navigation, attempts to click a moving marquee link. He can’t catch it in time. He feels defeated. If the content stayed still or allowed keyboard focus, he could engage successfully.",
      "Selina, a colorblind user, struggles with a marquee that combines motion and low contrast. She can't read it at all. She feels overlooked. Replacing it with high-contrast static content would make the message accessible."
    ],
    "responsibility": ["developer"]
  },
  "meta-refresh": {
    "title": "Automatic Page Refresh",
    "summary": "A timed page reload disrupts tasks like form filling and reading, making the site unusable for people with disabilities.",
    "description": "Pages that reload on a timer without user consent can erase data, interrupt tasks, and disorient users who rely on assistive tools or have cognitive or motor disabilities. For example, blind users may miss important updates or lose unsaved input. Accessible alternatives include manual refresh options or alerts before a timeout occurs.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.2.1 Timing Adjustable",
        "link": "https://www.w3.org/TR/WCAG22/#timing-adjustable"
      }
    ],
    "act_rules": [
      {
        "name": "Meta element has no refresh delay",
        "link": "https://act-rules.github.io/rules/bc659a"
      },
      {
        "name": "Meta element has no refresh delay (no exception)",
        "link": "https://act-rules.github.io/rules/bisz58"
      }
    ],
    "user_stories": [
      "Liam, a blind university applicant, is filling out an online form when the page refreshes automatically due to a meta refresh tag. His screen reader restarts reading from the top, and he loses his place. He feels frustrated and afraid of missing a deadline. If the site avoided timed refreshes or offered a manual option, he could complete the form with confidence.",
      "Jasmine, a screen reader user, is reading a news article when the page refreshes unexpectedly. Her reading is interrupted, and she can’t find where she left off. She feels annoyed and disoriented. Removing automatic meta-refresh and letting users control reloading would improve her experience.",
      "Tariq, a slow typist with a motor disability, is entering his details for a job application. The page refreshes automatically after 30 seconds, and he loses all progress. He feels defeated. If the site didn’t use timed refreshes, or if it preserved form state, he could apply without pressure.",
      "Olga, a blind senior, checks her healthcare portal. While navigating with her screen reader, the page refreshes every minute, interrupting her progress. She feels confused and rushed. Avoiding auto-refresh would let her use the portal at her own pace.",
      "Fatima, a low-vision user, is magnifying a government site to read assistance guidelines. Just as she finds the right section, the page auto-refreshes and resets her view. She feels disoriented. A stable page without meta-refresh would respect her reading process.",
      "Noah, a neurodivergent user, is trying to follow step-by-step instructions on a help site. The page refreshes every 60 seconds, making it hard to focus. He feels frustrated and gives up. Removing automatic refreshes would improve accessibility for him.",
      "Aisha, a blind online shopper, is reviewing items in her cart. The site uses a meta-refresh that clears her session without warning. She feels confused and abandoned. A user-controlled timeout alert would prevent the disruption.",
      "Marcus, a blind gamer, tries to redeem a promo code. Before he finishes entering it, the page refreshes. His screen reader starts over, and the code entry is lost. He feels excluded. Eliminating auto-refresh would let him complete actions independently.",
      "Eva, a blind student, takes an online practice test. A timed refresh reloads the page, deleting her answers. She feels anxious and unsupported. Providing a save function and manual refresh control would ensure fair access.",
      "Yusuf, a blind voter, fills out a ballot request form online. The meta-refresh reloads the page and wipes his input. He worries about missing deadlines. He feels powerless. Removing timed refreshes or offering a warning with opt-in would solve the issue.",
      "Ben, a blind public transit user, checks for schedule updates. The page refreshes while his screen reader is still reading, skipping the updates. He misses his bus. He feels stranded. Refresh control would help him access time-sensitive information.",
      "Leila, a blind designer, is reading design guidelines. Her screen reader is interrupted by a timed meta-refresh. She loses her place in the documentation. She feels irritated. Manual refresh control would preserve reading flow.",
      "Zainab, a blind journalist, reads breaking news on a site with frequent meta-refresh. Her screen reader can’t keep up, cutting off headlines mid-sentence. She feels like she’s missing vital information. Using JavaScript-controlled updates with ARIA live regions would improve accessibility.",
      "Isaac, a blind restaurant owner, updates his online menu. The admin page refreshes periodically, disrupting his editing. He loses unsaved changes. He feels frustrated. Eliminating auto-refresh or providing a save prompt would enhance usability.",
      "Mira, a blind nonprofit worker, inputs donor data into a system. A page refresh triggered by meta-refresh causes her to lose half her entries. She feels defeated. Preventing timed refreshes would protect her effort and accuracy.",
      "Carlos, a screen reader user, reads legal disclaimers on a financial site. The page refreshes just as he reaches the key terms, sending him back to the top. He feels unable to access important details. A static page or refresh confirmation would make the content accessible.",
      "Gracie, a blind retiree, checks her pension portal. A meta-refresh logs her out without warning. She loses access mid-transaction. She feels excluded. If the site provided a countdown and manual refresh button, she could finish her tasks safely.",
      "Dmitri, a blind musician, uploads tracks to a streaming platform. The submission form times out and refreshes before he finishes tagging. His input is erased. He feels discouraged. Removing or disabling timed refresh during active user input would resolve the issue.",
      "Selina, a visually impaired librarian, reads an accessibility report online. A timed refresh breaks her reading rhythm, and she loses her position. She feels annoyed. Avoiding meta-refresh entirely would allow her to work effectively.",
      "Haruto, a blind web tester, audits a site for accessibility. Meta-refresh resets the page before he finishes a screen reader test. He can’t confirm behavior. He feels blocked. Disabling auto-refresh would allow him to complete his testing process."
    ],
    "responsibility": ["developer"]
  },
  "meta-viewport": {
    "title": "Meta Viewport Tag Prevents User Zooming",
    "summary": "Meta viewport settings restrict text scaling, preventing users from adjusting content for readability.",
    "description": "When zoom is disabled, users cannot adjust the layout to accommodate personal preferences or impairments. This is especially harmful for mobile users who rely on larger fonts or magnified views. Ensuring the viewport allows scaling ensures compliance with accessibility standards and supports diverse user needs.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "1.4.4 Resize text",
        "link": "https://www.w3.org/TR/WCAG22/#resize-text"
      }
    ],
    "act_rules": [
      {
        "name": "Meta viewport allows for zoom",
        "link": "https://act-rules.github.io/rules/b4f0c3"
      }
    ],
    "user_stories": [
      "Elena, a low-vision retiree, accesses a local health clinic website. When she tries to zoom in on her phone, the page doesn’t respond because zooming is disabled in the viewport settings. She can’t read the appointment details and feels frustrated. If the site allowed pinch-to-zoom, she could read the content independently.",
      "Tariq, a visually impaired student, opens his online class notes on mobile. The page blocks zooming, so he struggles to read smaller text. He feels anxious about missing information. If the meta viewport tag allowed scaling, he could enlarge text as needed.",
      "Fatima, a colorblind and low-vision parent, checks a daycare’s website on her phone. The small font is unreadable, and zoom is disabled. She can’t view enrollment details and feels excluded. Allowing user scaling in the viewport settings would make the site accessible.",
      "George, an older adult with declining vision, reads a banking site that disables zoom. He can't enlarge text on transaction history. He feels nervous about making mistakes. Enabling zoom via the viewport meta tag would ensure he manages his finances confidently.",
      "Nina, a dyslexic user who benefits from zooming and custom text size, visits a news site that prevents zoom. She feels trapped and mentally fatigued. If the meta tag didn’t restrict scaling, she could adjust the layout for better comprehension.",
      "Carlos, a partially sighted commuter, tries to zoom in on a transit site’s mobile view. The meta viewport restricts scaling, and he can’t read the route numbers. He feels stressed and misses his stop. If zoom were enabled, he’d access real-time info comfortably.",
      "Mei, a visually impaired user, checks weather updates on her city’s mobile site. Zooming is disabled, so she can’t enlarge temperature icons. She feels discouraged and unprepared. Removing zoom restrictions in the viewport would fix this.",
      "Isaac, a senior who increases text size for readability, opens a charity site where zoom is blocked. He can’t read donation amounts. He feels frustrated. If the site respected user scaling, he could contribute with confidence.",
      "Yara, a blind screen magnifier user, accesses an online recipe site. She relies on pinch-to-zoom but can’t enlarge the text due to the meta viewport. She feels shut out from cooking. Enabling zoom would make the recipe accessible.",
      "Liam, a student with migraines, reads small text with dark themes to reduce eye strain. When zoom is disabled, he can’t reduce his discomfort. He feels physically unwell. Allowing zoom would support his health and learning.",
      "Leila, a legally blind job applicant, opens an employment form on mobile. The input fields are small, and she can’t zoom in. She worries about filling it out correctly. Removing zoom restrictions would allow accurate completion.",
      "Jonas, a visually impaired voter, accesses a ballot information site where zoom is disabled. He can’t read candidate names clearly. He feels disenfranchised. If the site enabled user scaling, he could make informed decisions.",
      "Olga, an aging screen magnifier user, shops for medications online. The pharmacy site locks the zoom. She can’t read dosages. She feels unsafe. Enabling pinch-to-zoom would protect her health.",
      "Noah, a legally blind athlete, tries to register for a marathon. The sign-up page disables zoom, and he can’t read the waiver text. He feels excluded. Adjusting the meta viewport to allow scaling would include all users.",
      "Kim, a dyslexic teen, visits an educational site where font scaling is locked. She needs larger text to reduce reading fatigue. She feels unsupported. Allowing zoom and respecting browser settings would improve comprehension.",
      "Ali, a senior with diabetic retinopathy, opens a city planning app with small labels and blocked zoom. He can’t review neighborhood updates. He feels disconnected. Accessible zoom settings would keep him engaged.",
      "Luca, a low-vision artist, browses an exhibit on his phone. Zooming is blocked, and image captions are tiny. He can’t enjoy the content. He feels frustrated. Enabling zoom would restore visual enjoyment.",
      "Sara, a new mom with postnatal visual strain, reads parenting tips on a mobile site. The font is small, and she can’t zoom in. She feels overwhelmed. Allowing user-controlled zoom would improve accessibility and comfort.",
      "Haruto, a partially sighted user, tries to zoom into a banking form on mobile. The meta tag restricts scaling. He fears entering incorrect data. He feels stressed. Enabling zoom would support secure transactions.",
      "Greta, a low-vision professor, accesses a university platform. Zoom is disabled on the course overview page. She can’t prepare her class list. She feels unprepared. Allowing text resizing would let her teach effectively."
    ],
    "responsibility": ["developer"]
  },
  "nested-interactive": {
    "title": "Nested Interactive Controls",
    "summary": "Nested controls such as links inside buttons or buttons inside labels disrupt screen reader behavior and keyboard navigation.",
    "description": "Assistive technologies rely on predictable focus and announcements. When buttons or links are placed inside one another, screen readers may skip over important controls or fail to describe them correctly. This leads to confusion, missed actions, and errors for users who are blind or use keyboard navigation. Avoiding nested interactivity ensures that all controls are independently accessible.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      },
      {
        "level": "A",
        "name": "2.1.1 Keyboard",
        "link": "https://www.w3.org/TR/WCAG22/#keyboard"
      }
    ],
    "act_rules": [
      {
        "name": "Element with presentational children has no focusable content",
        "link": "https://act-rules.github.io/rules/307n5z"
      }
    ],
    "user_stories": [
      "Yusuf, a blind user, visits a job site where a button to apply is placed inside a link. His screen reader doesn’t announce either correctly. He can't tell what to activate. He feels uncertain. If the controls weren’t nested, he could clearly interact with the correct element.",
      "Lina, a keyboard-only user with motor disabilities, tries to register for an event. The 'Register' button is inside a clickable card that’s also a link. Her tab navigation skips it or traps focus. She feels blocked. If the elements weren’t nested, her keyboard navigation would be smooth.",
      "George, a blind screen reader user, accesses a news app where headlines are links and also contain a nested 'Share' button. His screen reader reads the whole card as one link, skipping the share action. He feels restricted. Avoiding nested interactive controls would allow proper announcements.",
      "Aisha, a screen reader user, uses a form where a radio button is inside a label wrapped in a button. Her screen reader reads the entire section as one button. She feels confused and makes errors. Properly structuring the interactive components would clarify functionality.",
      "Leo, a blind student, browses an education site with accordion controls nested inside links. His screen reader can't interact with the inner controls. He feels blocked from accessing lessons. Removing nested buttons would restore accessibility.",
      "Tariq, a keyboard user, tries to dismiss a pop-up. The close icon is inside a clickable div that’s also a button. His focus gets stuck or activates the wrong action. He feels frustrated. Separating controls would allow predictable keyboard use.",
      "Olga, a blind senior, clicks a promo card where an image acts as a button inside a larger link. Her screen reader gives a vague label, and she doesn’t know what action she took. She feels confused. Ensuring elements are not nested would clarify intent.",
      "Carlos, a low-vision user using a magnifier, tries to click a contact form field placed within a link. The entire link activates instead. He can’t complete the form. He feels helpless. Avoiding interactive nesting would preserve expected behavior.",
      "Nina, a screen reader user, navigates a settings menu where a checkbox is nested inside a label within a button. Her reader skips or jumbles the announcement. She changes the wrong setting. Clear, separate controls would prevent miscommunication.",
      "Raj, a blind administrator, uses a dashboard where charts are clickable and contain filters inside them. The filters are buttons inside anchor tags. His screen reader fails to announce them. He can’t apply filters. Refactoring structure would help.",
      "Jenna, a blind college student, visits a scholarship page with cards acting as links, but each also includes nested form fields. Her screen reader gets stuck on the card, missing the inputs. She feels lost. Avoiding nested interactivity would allow clear focus.",
      "Omar, a quadriplegic user navigating with voice, can’t trigger a search icon placed inside a larger interactive tab. His commands activate the wrong control. He feels out of control. Separating controls logically would respect assistive tech expectations.",
      "Samira, a blind music teacher, accesses a playlist with play buttons embedded inside each song link. Her screen reader doesn’t announce play actions. She can’t listen to samples. Clear separation would let her access media properly.",
      "Noah, a blind voter, uses a site where 'Learn More' links wrap buttons like 'Read Ballot'. His screen reader collapses the two actions. He doesn’t know which to choose. He feels misled. Structuring each interaction independently would prevent this.",
      "Grace, a screen reader user, interacts with a table where each row is a link, but also includes dropdowns inside. Her screen reader reads the whole row as a link and skips the controls. She feels unable to review entries. Separate focusable zones would solve this.",
      "Kofi, a blind student, opens a mobile menu where buttons are inside toggle links. His screen reader announces neither correctly. He feels unable to navigate. Clear semantic roles without nesting would help him access the menu.",
      "Aya, a blind parent, signs up for alerts on a school site. The sign-up form wraps a submit button inside an expandable link. Her screen reader triggers the wrong action. She feels anxious. Removing nested controls would restore clarity.",
      "Ivan, a blind legal assistant, reviews client case links that also contain nested checkboxes for bulk actions. His screen reader announces conflicting actions. He makes mistakes. Redesigning with clear non-nested interactivity would improve precision.",
      "Maya, a screen reader user, accesses a help site where expandable FAQs are links that contain nested 'Contact Support' buttons. Her screen reader merges the actions. She misses the button. Proper separation of actions would aid understanding.",
      "Haruto, a blind developer, audits a page with sliders placed inside links. The interactive slider doesn’t receive focus properly. He can’t test the component. Clear separation and ARIA-compliant markup would allow accurate testing and use."
    ],
    "responsibility": ["developer"]
  },
  "no-autoplay-audio": {
    "title": "Autoplaying Audio Without Controls",
    "summary": "Audio plays for more than three seconds on page load without user interaction or a way to pause it, causing accessibility issues.",
    "description": "When audio starts automatically without user interaction and cannot be paused, it interferes with critical assistive tools like screen readers and text-to-speech. Users miss content, lose focus, or feel overwhelmed, especially if they cannot locate or access controls quickly. Ensuring that users can stop or mute any media that autoplays is essential for accessibility compliance.",
    "severity": "moderate",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.2.2 Pause, Stop, Hide",
        "link": "https://www.w3.org/TR/WCAG22/#pause-stop-hide"
      }
    ],
    "act_rules": [
      {
        "name": "Audio or video element avoids automatically playing audio",
        "link": "https://act-rules.github.io/rules/80f0bf"
      }
    ],
    "user_stories": [
      "Olga, a blind screen reader user, visits a news site where a video starts playing with loud audio. Her screen reader is drowned out by the noise, making it impossible to navigate the page. She feels overwhelmed. If the site prevented autoplay or included a visible mute button, she could continue using her reader smoothly.",
      "Leo, a student with ADHD, opens an educational portal. A promotional video autoplays with background music that distracts him from the content. He can’t focus and feels irritated. If the video started muted or required user interaction, he could stay on task.",
      "Fatima, a deaf-blind user who uses a Braille display, opens a charity website that autoplays audio announcements. The sound interferes with her screen reader’s Braille translation. She feels confused. Providing controls to stop audio would make the page usable.",
      "Carlos, a blind job seeker, opens a company site with a recruiting video that plays audio immediately. It interrupts his screen reader, so he can’t find the application form. He feels anxious. If audio didn’t autoplay or could be paused, he could focus on applying.",
      "Yuki, a neurodivergent student, visits a tutoring platform. A video lesson starts playing automatically. The audio overloads her sensory processing, causing distress. She leaves the site. If autoplay were disabled, she could engage at her own pace.",
      "Jonas, a low-vision user, accesses a fitness site where workout videos autoplay with loud narration. The sound disrupts his screen magnifier software. He feels distracted and frustrated. If users could start media manually, he’d feel in control.",
      "Amina, a blind healthcare worker, visits a medical site that autoplays informational audio. It clashes with her screen reader’s voice, causing confusion. She misses key instructions. If autoplay were avoided, she could focus on the content.",
      "Tariq, a screen reader user, checks a weather forecast page that launches an autoplayed jingle. It blocks his screen reader from reading storm warnings. He feels unsafe. If audio required user initiation, he could access vital info.",
      "Grace, a visually impaired college student, opens an online lecture where audio begins automatically. Her screen reader output is overridden, and she misses instructions. She feels flustered. Providing pause or mute controls would help her stay engaged.",
      "Nina, a dyslexic user, uses text-to-speech to help read. On an entertainment site, background audio autoplays and overlaps with her reading tool. She feels overwhelmed. If autoplay were off by default, she could concentrate better.",
      "Raj, a blind engineer, checks product specs on a hardware site. A branding video starts playing loudly, masking his screen reader. He feels annoyed and leaves the page. If the video started muted, he could stay focused on the specs.",
      "Lila, a Deaf teacher, opens a video tutorial that autoplays with audio and no captions. She can’t understand the content. She feels excluded. If the video had manual controls and captions, she could access the lesson equitably.",
      "Marta, a visually impaired user, shops for gifts on a retail site with autoplaying ads. The loud audio interferes with her screen magnifier, making it hard to read. She feels overwhelmed. If sound were user-initiated, she’d have a better experience.",
      "Sam, a blind lawyer, opens a case study site where an explainer video autoplays with music. It blocks his screen reader from reading case summaries. He feels frustrated. If the audio didn’t autoplay, he could use his assistive tech properly.",
      "Hassan, a blind university student, uses a screen reader on a library site that starts playing a podcast automatically. The overlap in voices confuses him. He loses his place. Disabling autoplay would solve the problem.",
      "Lena, a student with anxiety, visits a college info site. A promotional video starts with loud music. She’s startled and closes the tab. She feels deterred. Giving users control over playback would create a safer environment.",
      "Mei, a Deaf student, accesses an online course with autoplaying audio. There’s no visual transcript or captions. She can’t follow the lesson and feels excluded. If the media waited for user interaction, she could access alternatives.",
      "Omar, a blind IT worker, opens a dashboard that plays a welcome audio message. His screen reader conflicts with the sound, causing confusion. He feels distracted. Removing autoplay and providing skip options would support productivity.",
      "Sofia, a blind teen, browses an educational blog that autoplays music. Her screen reader can’t be heard over it. She can’t find the content. She feels lost. Ensuring all audio is user-controlled would help her navigate.",
      "Daniel, a blind app developer, tests a client site that autoplays marketing audio. It disrupts his screen reader test cases. He feels blocked from completing his audit. Avoiding autoplay would ensure compatibility with assistive technologies."
    ],
    "responsibility": ["developer"]
  },
  "object-alt": {
    "title": "Object Elements Missing Descriptive Alternative Text",
    "summary": "Screen readers cannot interpret <object> elements that lack accessible names or fallback content.",
    "description": "When <object> elements are used without meaningful alt text, users who depend on assistive technologies like screen readers receive no indication of the content or its purpose. This is especially problematic when these objects include critical information like diagrams, maps, or interactive tools.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      }
    ],
    "act_rules": [
      {
        "name": "Object element rendering non-text content has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/8fc3b6"
      }
    ],
    "user_stories": [
      "Raj, a blind student, accesses a science textbook site that embeds interactive diagrams using <object> elements without alternative text. His screen reader skips them completely. He misses key visual content and feels lost. If each object had a descriptive alternative, he could engage with the lessons fully.",
      "Maya, a screen reader user, visits a digital museum that uses <object> elements to display interactive artwork. Without alt text, she can’t understand what’s shown. She feels excluded from the experience. If meaningful descriptions were added, she could appreciate the exhibits equally.",
      "Leo, a blind developer, checks a site with embedded code sandboxes using <object>. No alt text is provided, so his screen reader skips the tools. He can’t test components. He feels blocked. Adding alternative descriptions or accessible fallbacks would restore usability.",
      "Tariq, a blind business owner, accesses an eLearning site with financial models rendered in <object> tags. His screen reader provides no info about them. He misses content and feels unprepared. Descriptive alt text would allow him to absorb the material.",
      "Fatima, a blind voter, reviews a sample ballot with embedded objects showing party logos and candidate placements. Her screen reader skips them due to missing alt text. She feels disenfranchised. Proper descriptions would ensure full access to election materials.",
      "Aisha, a blind engineer, accesses a spec sheet with embedded technical illustrations via <object> tags. Without alt text, her screen reader ignores them. She misses visual details. She feels limited. Alternative text would clarify the diagrams.",
      "Omar, a blind travel blogger, visits a booking site that displays interactive maps through <object>. With no alt description, his screen reader ignores them. He can’t plan his route. Adding text alternatives would allow route review.",
      "Mei, a blind user, checks a health site with a heart-rate graph embedded via <object>. The screen reader doesn’t announce it, and she misses the trend. She feels unsafe making decisions. Including accessible text would provide necessary health insight.",
      "Carlos, a blind student, opens a foreign language site with pronunciation modules embedded in <object> tags. No alt text is provided. He doesn’t know what’s included. He feels confused. Alternative text like 'French vowel pronunciation tool' would improve clarity.",
      "Lena, a visually impaired designer, accesses a portfolio site with interactive case studies in <object>. The screen reader skips them entirely. She misses key work samples. She feels uninformed. Including alt text for each embedded element would resolve the issue.",
      "Jorge, a blind museum educator, previews an online exhibit of 3D artifacts embedded via <object>. Without alt text, he can’t identify items. He feels excluded from curating. Proper object descriptions would let him participate equally.",
      "Nina, a blind nonprofit director, browses a grant portal where submission steps are displayed as objects. Her screen reader doesn’t read them, so she misses instructions. She feels stuck. Accessible naming would ensure process clarity.",
      "Isaac, a blind music student, checks an instrument site with <object> elements showing tuners. Without alt text, he can’t access the functionality. He feels left out. Descriptive fallback content would allow him to use the tools.",
      "Sofia, a blind teen, views a geography lesson that includes country maps through <object>. They lack descriptions, so her screen reader ignores them. She can’t follow. Adding alt text like 'Map of South America' would provide needed context.",
      "Daniel, a blind financial analyst, opens a report that embeds <object> graphs of market trends. His screen reader skips them. He feels frustrated and uninformed. Adding text equivalents would help him make data-driven decisions.",
      "Greta, a blind grandmother, visits a family history site with family trees embedded using <object>. She can’t read them with her screen reader. She feels left out. Alt text like 'Interactive Smith Family Tree' would make the content accessible.",
      "Haruto, a blind student, checks an online chemistry tool with molecules embedded as <object>. He can’t access them with his screen reader. He feels excluded from labs. Alt text and fallback content would enable participation.",
      "Yara, a blind social worker, opens a site with training embedded as object-based quizzes. Her screen reader doesn’t announce them. She misses crucial certification steps. She feels blocked. Accessible naming would make learning inclusive.",
      "Olga, a blind retiree, visits a genealogy site with charts embedded via <object>. She hears nothing about them from her screen reader. She feels like she's missing the story. If the charts included alt descriptions, she could follow her family history.",
      "Ben, a blind researcher, reads a scientific paper with interactive visualizations in <object>. No alt text is provided, and his screen reader skips them. He misses key data. Descriptive alternatives would provide access to the study’s findings."
    ],
    "responsibility": ["developer", "content"]
  },
  "role-img-alt": {
    "title": "Accessible Names Missing from Elements with role=\"img\"",
    "summary": "Visual elements marked as images are missing accessible names, preventing users from understanding their purpose.",
    "description": "When role=\"img\" is used without an accessible name, screen readers either skip the element or announce it as a generic 'image'. This creates barriers, especially when the visual carries important context like status indicators, instructions, or logos. Providing alternative text restores clarity and usability.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      }
    ],
    "act_rules": [
      {
        "name": "Image has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/23a2a8"
      }
    ],
    "user_stories": [
      "Omar, a blind father, visits a parenting site that uses `role=\"img\"` elements for icons and illustrations. His screen reader announces them as 'image' with no context. He can’t understand their purpose and feels confused. If each image had alt text like 'Diaper changing guide' or 'Feeding chart', he could fully follow the content.",
      "Fatima, a blind nurse, checks a medical site with `role=\"img\"` elements used to display condition diagrams. Her screen reader announces 'image' without description. She misses important visuals. She feels disadvantaged. Providing accessible names would allow her to understand the visuals.",
      "Carlos, a blind sports fan, uses a scoreboard site that includes team logos with `role=\"img\"` but no text. His screen reader skips over them or says nothing useful. He can’t tell which teams are playing. He feels left out. If logos had descriptive alt text, he'd stay informed.",
      "Lena, a blind artist, browses an online gallery where artwork previews are rendered using `role=\"img\"` but no names. Her screen reader says 'image'. She doesn’t know what she’s viewing. She feels disconnected. If each image had a title or artist name, she could appreciate the gallery.",
      "Tariq, a blind user, visits a cooking app that shows step visuals as `role=\"img\"` elements without alternative text. His screen reader reads nothing or only says 'image'. He misses preparation cues. He feels frustrated. Alt text like 'Step 3: whisk eggs' would make cooking accessible.",
      "Noah, a blind student, uses an e-learning site with concept illustrations marked `role=\"img\"` but lacking text. His screen reader doesn’t describe them. He feels like he’s missing vital context. Descriptive names would help him learn effectively.",
      "Jenna, a blind teen, scrolls through a social app where user avatars are marked with `role=\"img\"` but no names. Her screen reader doesn’t say who’s posting. She feels disconnected. Including accessible names would allow full social participation.",
      "Aisha, a blind volunteer, visits a charity site where donation methods are represented with icons using `role=\"img\"`. Without alt text, she doesn’t know which option is which. She feels unsure. Adding descriptions like 'Donate via PayPal' or 'Donate via Credit Card' would clarify choices.",
      "George, a blind history teacher, checks a timeline where event illustrations are built with `role=\"img\"` but no accessible name. He can’t follow the visual sequence. He feels limited. Alternative text would allow him to share lessons equally with students.",
      "Mira, a blind tech support agent, uses a ticketing system with icon-based statuses (like 'urgent', 'in progress') coded with `role=\"img\"`. Without text, she can’t distinguish them. She feels ineffective. Alt text like 'Urgent status icon' would make her job manageable.",
      "Yuki, a blind tourist, checks a travel site where destination cards include `role=\"img\"` hero images with no text. Her screen reader provides no location details. She feels disoriented. Including place names in the alt text would provide context.",
      "Sofia, a blind gamer, browses a review site where game covers are rendered using `role=\"img\"` and lack accessible names. She hears only 'image'. She feels excluded from gaming news. If covers had names like 'Game cover for Final Fantasy', she could stay updated.",
      "Jonas, a blind retiree, checks a genealogy site with family portraits marked as `role=\"img\"`. The screen reader skips over them or reads 'image'. He doesn’t know which family member is shown. He feels disconnected. Adding names like 'Photo of Grandma Rosa' would provide meaningful access.",
      "Zainab, a blind legal researcher, reads a court document site that uses logos and stamps as `role=\"img\"` elements without descriptions. She misses source identification. She feels uncertain about credibility. Alt text would clarify document origin.",
      "Niko, a blind developer, audits a software dashboard where status indicators use `role=\"img\"` but no names. He can’t evaluate component behavior. He feels blocked. Providing alt text for status icons would support thorough testing.",
      "Greta, a blind patient, views her health portal which uses icons with `role=\"img\"` for medication categories. Without text, she’s unsure what she’s viewing. She feels unsafe managing prescriptions. Accessible names would ensure clarity.",
      "Liam, a blind high schooler, accesses a school site with achievement badges shown as `role=\"img\"`. He can’t tell which awards he’s earned. He feels unrecognized. If the badges had alt text, he could celebrate his success.",
      "Selina, a blind retiree, visits a senior living website that uses `role=\"img\"` to show facility features. Her screen reader doesn’t describe them. She feels unable to make an informed decision. Alt text would restore independence.",
      "Hassan, a blind voter, uses an election site with party symbols displayed as `role=\"img\"` elements without descriptions. He doesn’t know which symbol represents which party. He feels misinformed. Descriptive alt text would make voting information clear.",
      "Aya, a blind software tester, evaluates a startup’s homepage. Their visual branding uses SVGs with `role=\"img\"` but no labels. Her screen reader can’t describe them. She flags it as a failure. Accessible names would ensure compliance and usability."
    ],
    "responsibility": ["developer", "content"]
  },
  "scrollable-region-focusable": {
    "title": "Inaccessible Scroll Containers",
    "summary": "Users relying on keyboard navigation are unable to access content inside scrollable regions because those areas do not support focus.",
    "description": "When elements that allow scrolling cannot receive focus, keyboard users—especially those using screen readers or switch devices—are unable to navigate through the full content. This creates barriers in reading, reviewing, or interacting with important data like product lists, comments, or dashboards.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.1.1 Keyboard",
        "link": "https://www.w3.org/TR/WCAG22/#keyboard"
      }
    ],
    "act_rules": [
      {
        "name": "Scrollable element is keyboard accessible",
        "link": "https://act-rules.github.io/rules/0ssw9k"
      }
    ],
    "user_stories": [
      "Omar, a keyboard-only user with limited mobility, browses a photo gallery with horizontally scrollable thumbnails. He tries using arrow keys, but the scrollable area isn’t focusable, so nothing happens. He feels stuck. If the region had a tabindex and keyboard support, he could view all photos.",
      "Fatima, a blind screen reader user, accesses a dashboard with scrollable panels. Her keyboard can't focus them, so she misses half the content. She feels frustrated. Making scrollable regions focusable and navigable would restore access.",
      "Tariq, a quadriplegic student using switch controls, accesses a study site with a scrollable list of flashcards. The scroll region doesn’t respond to keyboard focus, so he can't review all cards. He feels behind. Enabling focus and keyboard scroll would help him study independently.",
      "Grace, a low-vision user relying on keyboard zoom, tries to scroll a map section on a travel site. The scrollable region can’t be focused, so arrow keys don’t work. She feels stuck. If the div were focusable and scrollable via keyboard, she could navigate with ease.",
      "Leo, a keyboard-only user, tries to scroll through terms and conditions in a modal window. The scrollable text block can’t receive focus, and he can’t read past the first page. He feels frustrated. Adding `tabindex=\"0\"` and arrow key support would solve this.",
      "Yuki, a blind researcher, accesses a dataset in a scrollable table region. Her keyboard skips over the content, leaving most of the data inaccessible. She feels blocked from her research. If the scroll region were focusable, she could review the full table.",
      "Maya, a screen reader user, browses an FAQ page with categories in a side panel. The scrollable list isn’t keyboard focusable, and she can’t explore the options. She feels lost. Making the region keyboard-accessible would allow full navigation.",
      "George, a senior with arthritis, uses a keyboard to scroll through a weather widget. It has a horizontal scroll, but it isn’t focusable. He can’t view the forecast beyond today. He feels limited. A focusable scroll region would restore usability.",
      "Jenna, a blind student, reviews an exam prep app with scrollable flashcard containers. Her keyboard skips past the region, making it impossible to access later cards. She feels unprepared. If the scrollable area could receive keyboard focus, she’d study effectively.",
      "Carlos, a screen reader user, opens a job board where job listings scroll vertically in a limited space. The scroll region is not keyboard focusable, so he hears only the first few listings. He feels disadvantaged. Adding proper focus management would solve the issue.",
      "Aisha, a low-vision user, checks a donation site with testimonials in a horizontal scroll section. Her keyboard can’t interact with it, so she misses half the messages. She feels disconnected. Enabling keyboard focus would make all content reachable.",
      "Ben, a blind attorney, opens a law archive with scrollable case summaries. The scroll region doesn’t respond to keyboard commands. He can’t reach later summaries. He feels restricted. Making it focusable would let him review all materials.",
      "Noah, a screen reader user, visits an e-commerce site with product reviews in a scrollable box. His keyboard skips the region entirely. He misses critical feedback. He feels unsure. Allowing keyboard focus would give him a better shopping experience.",
      "Sofia, a blind teen, uses a site with social updates in a scrollable feed. The scrollable region is skipped by her keyboard. She feels excluded. Adding tabindex and focus handling would bring the full feed within reach.",
      "Haruto, a keyboard-only developer, tests a scrollable code preview box. The preview can’t be focused, so he can’t scroll through long code snippets. He feels blocked. Making the element focusable and keyboard-scrollable would support his workflow.",
      "Greta, a blind grandmother, browses a family photo wall with scrollable rows. Her keyboard navigation skips the scrolling section. She can’t access most photos and feels left out. Focusable scroll controls would improve her experience.",
      "Isaac, a blind consultant, reviews a scrollable performance chart embedded in a report. The chart area isn’t focusable, so keyboard input doesn’t work. He misses half the data. He feels misinformed. Enabling keyboard access would restore functionality.",
      "Yara, a blind voter, reads a voter guide where district options are in a scrollable pane. Her keyboard can’t focus it, so she doesn’t see all candidates. She feels uninformed. Accessible scrolling would support fair participation.",
      "Dmitri, a blind musician, accesses a lesson with sheet music in a scrollable container. His keyboard skips the scrollable div. He misses part of the score. He feels frustrated. Focusable scroll containers would enable practice.",
      "Nina, a blind user, browses a help center where steps are listed in a scrollable box. Her screen reader can’t navigate it with the keyboard. She feels lost. Enabling focus and arrow key navigation would help her complete tasks independently."
    ],
    "responsibility": ["developer"]
  },
  "select-name": {
    "title": "Select Element Missing Accessible Name",
    "summary": "The dropdown menu lacks a label, so users relying on assistive technology cannot identify its purpose.",
    "description": "Accessible names are essential for select inputs so that users know what they are choosing. If the dropdown has no programmatic label, screen reader users must guess its function, which can lead to confusion, errors, or abandonment of the form.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [
      {
        "name": "Form field has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/e086e5"
      }
    ],
    "user_stories": [
      "Omar, a blind university applicant, is filling out a form that includes a select menu for choosing a major. His screen reader simply announces 'combo box' with no context. He doesn’t know what he’s selecting. He feels unsure. If the select element had an accessible name like 'Choose a major', he could complete the form confidently.",
      "Fatima, a blind healthcare worker, accesses a benefits enrollment form. A select menu lets her pick a healthcare provider but has no label. Her screen reader can’t tell what it’s for. She feels anxious about making a mistake. Providing a label like 'Select your provider' would remove uncertainty.",
      "Leo, a blind college student, uses a financial aid site with a select element for semester options. Without a label, his screen reader announces it as 'combo box'. He doesn’t know what it controls. He feels stuck. If the select had an accessible name, he could proceed clearly.",
      "Maya, a screen reader user, is booking a hotel room. A select menu lets her choose room type, but it’s unlabeled. Her screen reader offers no context. She feels unsure and abandons the booking. Adding a label like 'Room type' would fix this.",
      "Tariq, a blind software engineer, opens a job site form with a select dropdown for job categories. Without an accessible name, the screen reader doesn’t announce what it’s filtering. He feels lost. Labeling the select as 'Job category' would help.",
      "Nina, a blind voter, accesses a voter registration form. A select menu offers state choices but is unnamed. Her screen reader announces only 'combo box'. She feels unsure what it's for. A name like 'Select your state' would clarify the purpose.",
      "Carlos, a blind grocery shopper, checks out on a delivery app. A select menu to choose delivery time has no label. His screen reader says 'combo box'. He doesn’t know what time he’s selecting. Adding an accessible name would ensure a smooth checkout.",
      "Greta, a blind retiree, fills out a prescription refill form. A select field for pharmacy location has no name. She hears 'combo box' and is confused. She feels unsafe making a medical decision. Labeling it as 'Pharmacy location' would help.",
      "Yuki, a blind student, is picking electives on a school portal. A select dropdown is unlabeled, and her screen reader doesn’t explain its use. She misses a key deadline. Adding 'Select elective course' would ensure full participation.",
      "George, a blind HR manager, uses a platform to evaluate employee performance. A select input for rating is not labeled. He hears 'combo box'. He guesses its purpose and worries about errors. Providing a label like 'Performance rating' would support accuracy.",
      "Mei, a blind traveler, is booking flights and encounters a select menu to pick travel class. The dropdown has no name. She feels unsure if she’s choosing economy or business. She feels uneasy. A label like 'Travel class' would fix the issue.",
      "Isaac, a blind entrepreneur, uses a CRM tool where a select field to assign a lead to a team has no accessible name. His screen reader skips over the purpose. He assigns incorrectly. He feels frustrated. An accessible name would prevent missteps.",
      "Aisha, a screen reader user, tries to RSVP for an event. The form includes a select field for meal preference that isn’t labeled. She’s unsure what she’s choosing. She feels nervous about dietary issues. A name like 'Meal preference' would help.",
      "Jenna, a blind artist, enters an art competition form. A select menu for 'Submission category' is not labeled. Her screen reader gives no context. She selects the wrong category and feels disappointed. Proper labeling would ensure fairness.",
      "Ben, a blind intern, uses a payroll system with a select element for pay periods. It’s not labeled, so his screen reader announces only 'combo box'. He misses an entry deadline. Labeling it as 'Pay period' would make the system usable.",
      "Sofia, a blind teen, uses a youth registration form for a sports club. A select dropdown asks for sport type but isn’t labeled. She can’t tell which sport she’s registering for. She feels uncertain. A clear label would support confident participation.",
      "Yara, a blind mother, fills out a school enrollment form. A select menu for grade level has no label. Her screen reader just says 'combo box'. She worries about choosing the wrong grade. A label like 'Select grade level' would resolve this.",
      "Noah, a blind journalist, registers for a press event. A select menu for country selection has no accessible name. His screen reader can’t identify it. He enters wrong data and is denied entry. A label would ensure correct input.",
      "Samira, a blind nonprofit volunteer, fills out a donor form. A select element for donation frequency is unlabeled. She guesses and feels unsure. She worries about committing to the wrong schedule. A label like 'Donation frequency' would clarify the choice.",
      "Daniel, a blind contractor, uses a bidding portal with a select menu for project types. It’s not labeled, so his screen reader can’t convey the purpose. He misapplies. He feels frustrated. Providing an accessible name would guide him clearly."
    ],
    "responsibility": ["developer", "content"]
  },
  "server-side-image-map": {
    "title": "Interactive Map Is Inaccessible Due to Server-Side Implementation",
    "summary": "Server-side image maps do not support accessible interactions, excluding many users from important information.",
    "description": "Interactive content presented via server-side image maps fails to meet basic accessibility standards. These maps are not navigable with a keyboard and are skipped entirely by screen readers, excluding blind and keyboard-only users. Switching to semantic HTML structures allows all users to interact meaningfully.",
    "severity": "minor",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "2.1.1 Keyboard",
        "link": "https://www.w3.org/TR/WCAG22/#keyboard"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, accesses a university site where the campus map is built using a server-side image map. His screen reader can’t identify or interact with the links in the map. He can’t find building information and feels frustrated. Using client-side maps with proper alt text would let him explore the campus independently.",
      "Fatima, a keyboard-only user, visits a museum site with an interactive floor plan using a server-side image map. She can’t tab through exhibit areas. She feels excluded. Replacing it with a keyboard-accessible client-side map would allow full navigation.",
      "Yuki, a blind traveler, tries to use an airport’s server-side image map to locate terminals. Her screen reader offers no information about interactive zones. She feels anxious about getting lost. A semantic HTML map with labeled areas would help.",
      "Lena, a blind artist, accesses a gallery's virtual tour that uses a server-side image map. Her screen reader doesn’t recognize clickable regions. She misses the tour. She feels disappointed. A properly marked-up map with ARIA regions would fix this.",
      "Carlos, a blind job seeker, browses a career site where job categories are in a graphical layout using a server-side map. His screen reader can’t access any category. He feels blocked. Using a keyboard-navigable alternative would provide equal access.",
      "Grace, a blind mother, visits a school website using a server-side image map to show classroom locations. Her screen reader skips the map. She feels uninformed. Using an HTML-based map with labeled links would provide clarity.",
      "Raj, a screen reader user, opens a real estate site with property search zones on a server-side image map. None of the regions are labeled or accessible. He can’t browse listings and feels frustrated. An HTML image map with proper semantics would be accessible.",
      "Tariq, a blind history enthusiast, accesses an interactive timeline presented as a server-side image map. His screen reader can’t focus on or describe the content. He feels disconnected. A structured alternative would allow exploration.",
      "Aisha, a blind teacher, uses a school portal that includes a curriculum visual built with a server-side image map. It’s invisible to her screen reader. She feels unable to prepare. A semantic HTML structure would provide access.",
      "Nina, a blind voter, checks an election site where a district map uses a server-side image map. She can’t find her district. She feels disenfranchised. An accessible map or dropdown list would ensure her participation.",
      "George, a blind historian, explores a museum archive where navigation is controlled by a server-side image map. He can’t locate exhibits. He feels blocked. Client-side accessible navigation would restore usability.",
      "Jenna, a keyboard user, visits a theme park website. The park layout uses a server-side map, and she can’t tab through attractions. She feels restricted. A client-side approach would make each point keyboard-focusable.",
      "Noah, a blind student, checks a school website with clickable buildings shown in a server-side image map. None are announced by his screen reader. He feels excluded. An HTML-based image map with labels would provide access.",
      "Sofia, a screen reader user, tries to register for a conference where sessions are displayed as parts of a graphic. The site uses a server-side image map. She can’t interact with any part of it. She feels confused. Replacing it with buttons or links would help.",
      "Mei, a blind commuter, checks a transport site where a city transit map is interactive via a server-side image. She hears no useful info. She feels unable to plan her route. A client-side solution with text equivalents would make the map usable.",
      "Isaac, a keyboard-only user, accesses a university's research portal. Navigation is controlled by a server-side image map. He can’t tab to departments. He feels frustrated. An accessible navigation menu would solve the issue.",
      "Samira, a blind user, browses a music festival site where artists are placed visually on a stage map using server-side image maps. Her screen reader can’t explore or announce performers. She feels left out. Descriptive HTML links would include her.",
      "Liam, a blind legal assistant, opens a legal archive with case categories shown in a visual map format. None are accessible due to the server-side image map. He feels limited. Accessible buttons or links would restore his access.",
      "Haruto, a blind screen reader user, explores a site with store locations shown via server-side image map. None of the store regions are keyboard-accessible. He misses local deals. Switching to client-side maps or lists would resolve this.",
      "Selina, a blind retiree, visits a healthcare site that displays clinic locations using a server-side image map. She can’t find her clinic. She feels neglected. An accessible dropdown or client-side alternative would ensure clarity."
    ],
    "responsibility": ["developer"]
  },
  "summary-name": {
    "title": "Summary Element Missing Accessible Label",
    "summary": "The <summary> element does not include discernible text, making it inaccessible for screen reader users.",
    "description": "Collapsible content should always have a clear label that announces its purpose. When <summary> elements are empty or contain only decorative icons, users cannot tell what content will be revealed. This creates confusion and increases the likelihood of missing key information.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "4.1.2 Name, Role, Value",
        "link": "https://www.w3.org/TR/WCAG22/#name-role-value"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, uses a financial aid site that includes a collapsible section for deadlines. The `<summary>` tag is empty, so his screen reader just says 'button'. He doesn’t know what it's for. He feels confused. If the summary read 'View Financial Aid Deadlines', he could navigate confidently.",
      "Fatima, a screen reader user, browses a health portal where multiple `<details>` sections collapse content. Each has an empty `<summary>`, making them indistinguishable. She feels lost trying to access information. Descriptive summaries like 'COVID-19 Guidelines' or 'Vaccination FAQs' would help her understand the structure.",
      "Leo, a blind software tester, checks a site with interactive help sections. The `<summary>` element is empty or vague. His screen reader reads it as 'toggle', giving no context. He feels unable to test functionality. Clear labels would support accurate accessibility testing.",
      "Nina, a screen reader user, accesses an FAQ page. All entries have `<summary>` elements that say only 'click to expand'. Her screen reader repeats this with no clue about the topic. She feels overwhelmed. Summaries like 'How to reset my password?' would clarify each section.",
      "George, a blind researcher, browses a library archive where filters are collapsed using `<details>` and `<summary>`. With no discernible text, he doesn’t know what each toggle does. He feels blocked. Accessible names like 'Filter by Year' or 'Sort by Author' would solve this.",
      "Aisha, a blind customer, reads a product page with expandable specs. The `<summary>` is just an icon with no text. Her screen reader says 'button'. She doesn’t know if it contains shipping info or dimensions. She feels uncertain. Proper labels would improve the experience.",
      "Jenna, a screen reader user, fills out a government form with expandable instructions in `<details>`. The summary is empty, so her screen reader skips the section. She misses critical input guidance. A label like 'Form Instructions' would help her complete it correctly.",
      "Tariq, a blind job seeker, browses a hiring portal with sections like benefits and requirements hidden under empty `<summary>` elements. He can’t differentiate them. He feels excluded. If each had a descriptive heading, he could navigate easily.",
      "Sofia, a blind teen, uses a learning site where lessons are grouped under unnamed `<summary>` elements. Her screen reader can’t tell which lesson is which. She feels overwhelmed. Descriptive summary text like 'Lesson 1: Fractions' would guide her.",
      "Carlos, a blind user, checks his utility account where past statements are stored in `<details>` sections with no labeled `<summary>`. His screen reader reads only 'button'. He doesn’t know which month it refers to. He feels uncertain. Adding 'View January Statement' would solve the issue.",
      "Greta, a blind retiree, accesses her pension dashboard. The `<summary>` for each section is a plus icon with no text. Her screen reader doesn’t announce their purpose. She feels nervous about expanding the wrong section. Text like 'View Tax Documents' would ease her concerns.",
      "Yuki, a blind tourist, opens a travel planner site. Expandable sections are used for itineraries but the `<summary>` elements say only 'click'. She can’t tell what trip each section contains. She feels confused. A clear summary like 'Paris Trip Details' would make planning easier.",
      "Isaac, a screen reader user, uses a city site with collapsible weather alerts. The `<summary>` elements lack discernible text. His reader says 'toggle'. He doesn’t know which alert is for today. He feels unsafe. Accessible summaries like 'Monday Forecast' would help.",
      "Maya, a screen reader user, browses an HR site where training modules are collapsed in `<details>`. The summary is blank, and her screen reader skips it. She misses required training. A summary like 'Workplace Safety Module' would guide her.",
      "Jonas, a blind voter, reads a ballot info page with expandable details under `<summary>`. With no text, he can’t tell which candidates or measures are described. He feels misinformed. Proper summaries like 'Proposition A Details' would ensure understanding.",
      "Lena, a blind entrepreneur, checks a business services page where rates are hidden in collapsed panels. The `<summary>` element is only a caret icon. She doesn’t know what she’s opening. She feels uncertain. Descriptive labels like 'View Monthly Pricing' would clarify content.",
      "Samira, a blind librarian, uses a site listing archived books by genre. The expandable categories use `<summary>` without names. Her screen reader can’t distinguish genres. She feels overwhelmed. Adding summaries like 'Science Fiction' or 'Mystery' would improve sorting.",
      "Haruto, a blind student, accesses his class dashboard. Weekly materials are grouped in `<details>` but each `<summary>` is missing or unlabelled. He can’t find which week’s notes he’s opening. He feels disorganized. Adding summaries like 'Week 3: Photosynthesis' would help.",
      "Zainab, a blind journalist, opens a newsroom archive with collapsible press releases. The summary sections have no text. Her screen reader says 'expandable'. She doesn’t know which article it refers to. She feels lost. Labels like 'March 2024 Press Release' would orient her.",
      "Ben, a blind city planner, uses a zoning website where interactive summaries lead to policy sections. The `<summary>` tags are empty. His screen reader doesn’t identify the topics. He feels unable to review the proposals. Clear text like 'Zoning Changes for District A' would support his work."
    ],
    "responsibility": ["developer", "content"]
  },
  "svg-img-alt": {
    "title": "SVG Image Lacks Descriptive Alt Text",
    "summary": "SVG elements with image or graphic roles are missing accessible text, making them invisible to screen reader users.",
    "description": "Visual elements using <svg> with semantic roles are not usable by screen reader users unless they include a descriptive label. This issue prevents blind users from accessing features like navigation icons, charts, or controls that rely solely on SVG visuals.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.1.1 Non-text Content",
        "link": "https://www.w3.org/TR/WCAG22/#non-text-content"
      }
    ],
    "act_rules": [
      {
        "name": "SVG element with explicit role has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/7d6734"
      }
    ],
    "user_stories": [
      "Omar, a blind user, visits a banking app that uses `<svg role=\"img\">` for transaction icons. His screen reader announces nothing about them. He can’t distinguish between deposits and withdrawals. He feels confused. Adding accessible text like 'Deposit icon' or 'Withdrawal icon' would clarify the interface.",
      "Fatima, a blind nurse, opens a health portal that shows alerts with SVG icons. Without alternative text, her screen reader skips them. She misses critical warnings and feels unsafe. Adding descriptive labels like 'Urgent alert' would ensure clarity.",
      "Leo, a blind software engineer, checks a dashboard with SVG charts marked as `role=\"graphics-document\"`. His screen reader doesn’t describe the visuals. He feels excluded from key metrics. Providing accessible names like 'Revenue graph' would restore access.",
      "Nina, a screen reader user, explores a recipe site where SVGs show step-by-step illustrations. They lack alt text, so she misses the visual instructions. She feels lost. Descriptive labels like 'Step 3: Stir ingredients' would guide her cooking.",
      "Tariq, a blind user, uses a travel planner where SVG icons show transport options. His screen reader doesn’t identify them. He books the wrong ride and feels frustrated. Adding accessible text like 'Train icon' or 'Taxi icon' would support decision-making.",
      "Jenna, a blind student, reviews a study app where subject icons are SVGs with no text. Her screen reader skips them. She can’t navigate to subjects. She feels blocked. Naming the icons like 'Math flashcards' would make them usable.",
      "Carlos, a blind shopper, visits an e-commerce site where product categories are SVG icons. He hears nothing about them. He feels excluded. Adding accessible names like 'Shoes category' or 'Home goods' would improve navigation.",
      "Sofia, a blind teen, plays a game where controls are represented as SVG buttons. They have no accessible names, so her screen reader ignores them. She feels disconnected. Providing alt text like 'Jump' or 'Shoot' would enable gameplay.",
      "Aisha, a screen reader user, uses a language learning app that shows flags as SVGs to choose languages. They have no accessible text. She feels confused and uncertain. Labeling them like 'Spanish (flag)' would help her select correctly.",
      "George, a blind teacher, browses a school website where grade levels are represented by icons using SVG. Without accessible names, he can’t identify them. He feels frustrated. Adding text like 'Grade 3 icon' would clarify choices.",
      "Yuki, a blind traveler, checks a weather site using SVGs to show conditions. His screen reader doesn’t describe them. He doesn’t know if it’s sunny or rainy. He feels unprepared. Labels like 'Sunny icon' would inform him.",
      "Grace, a blind musician, uses a streaming app where play, pause, and volume controls are SVGs. They lack alt text, so she can’t operate them. She feels blocked. Providing labels like 'Play button' and 'Volume slider' would restore control.",
      "Raj, a blind business owner, reviews analytics dashboards filled with `<svg role=\"graphics-symbol\">`. None are labeled. He can’t interpret trends. He feels disconnected. Accessible names like 'Sales by region chart' would solve this.",
      "Ben, a blind parent, uses a parenting app that includes daily tips shown with SVG icons. They have no accessible names. His screen reader says nothing. He misses helpful info. Descriptive labels would include him.",
      "Mei, a blind commuter, uses a transit app where route numbers are displayed via SVG. With no alt text, she can’t select her line. She feels lost. Adding accessible names like 'Route 12' would make the app usable.",
      "Samira, a screen reader user, browses an event site where categories (e.g., music, food) are SVGs. None are labeled. She can’t find relevant events. She feels excluded. Adding labels like 'Live Music icon' would support discovery.",
      "Haruto, a blind voter, visits a government site with SVGs representing departments. With no accessible names, his screen reader can’t guide him. He feels lost. Text like 'Department of Transportation icon' would make navigation clear.",
      "Lena, a blind developer, tests an app’s accessibility. All SVG icons fail because they lack text. She can’t confirm features. She feels frustrated. Ensuring each SVG with an image role has an accessible name would allow proper testing.",
      "Isaac, a blind researcher, opens a report with SVG visuals. The charts use `role=\"graphics-document\"` but lack labels. He can’t access findings. He feels hindered. Adding alt text like 'Q2 Budget Overview' would provide meaning.",
      "Zainab, a screen reader user, browses a news site where categories are represented as SVG icons. Without text, she can’t browse by topic. She feels left out. Descriptive names like 'Politics icon' or 'Tech icon' would fix this."
    ],
    "responsibility": ["developer", "content"]
  },
  "td-headers-attr": {
    "title": "Incorrect Headers Attribute in Table Cells",
    "summary": "Some <td> elements use the headers attribute incorrectly, pointing to non-<th> elements or cells outside the table.",
    "description": "When the headers attribute is misused, users relying on screen readers may receive inaccurate or no context when reading tables. This affects tasks like reading grades, financials, or schedules, where clear structure is essential. Each reference must point only to a valid <th> in the same table.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "act_rules": [
      {
        "name": "Headers attribute specified on a cell refers to cells in the same table element",
        "link": "https://act-rules.github.io/rules/a25f45"
      }
    ],
    "user_stories": [
      "Omar, a blind accountant, reviews a financial report table with `headers` attributes on `<td>` elements. His screen reader tries to announce header associations but gets incorrect data due to misreferenced IDs. He feels confused and makes mistakes. If the headers referenced only valid `<th>` elements within the same table, he could interpret the data accurately.",
      "Fatima, a blind healthcare analyst, examines patient data in a table with `headers` attributes. Her screen reader announces unrelated content or nothing at all because the references point outside the table. She feels frustrated. Correcting the headers to point only to `<th>` cells within the table would ensure clarity.",
      "Leo, a screen reader user, accesses a shipping dashboard with complex tables. Each `<td>` incorrectly points to data cells, not headers. He can’t understand the table structure and feels overwhelmed. Referencing only `<th>` elements would guide him properly.",
      "Nina, a blind student, checks a gradebook with tables that use `headers` incorrectly. The cells reference IDs that don't exist or are in other tables. She feels confused and unsure about her performance. If each `headers` attribute pointed to a valid `<th>` in the same table, she could interpret her scores.",
      "Carlos, a blind shopper, browses a pricing comparison table. Some `<td>` cells reference footer cells instead of column headers. His screen reader misannounces product names. He feels misinformed. Fixing the references would allow accurate comparison.",
      "Sofia, a screen reader user, checks an event schedule with a table using improper `headers` references. Her reader skips essential time and location headers. She feels lost. Ensuring references point only to `<th>` elements in the same table would help.",
      "George, a blind legal researcher, reviews a case history table. Cells refer to unrelated elements through the `headers` attribute. He misses connections between date and verdict. He feels disoriented. Proper references to `<th>` elements would restore structure.",
      "Yuki, a blind auditor, reviews compliance tables where `<td>` headers link to the wrong `id` or span tables. Her screen reader outputs nonsense. She feels frustrated and unproductive. Correcting header references would improve efficiency.",
      "Jenna, a blind teen, uses a nutrition app where a food log table has broken `headers` references. She can’t tell what quantities or categories go with each food. She feels unsure. Proper structure would make the health tool accessible.",
      "Aisha, a screen reader user, browses a budget planner. In tables with weekly expenses, her screen reader misreads category headers due to incorrect `headers` attributes. She feels misled. Valid references would help her manage spending confidently.",
      "Mei, a blind city planner, reviews infrastructure reports in HTML tables. The `headers` in `<td>` reference unrelated sections or non-headers. She can’t grasp project details. She feels blocked. Fixing references would enable comprehension.",
      "Ben, a blind app developer, audits accessibility for a client. In a sales data table, `<td>` elements point to other `<td>` cells. His screen reader fails to provide logical context. He flags it as a failure. Correct markup would support assistive tech users.",
      "Haruto, a blind graduate student, examines academic records in tables. Cells reference irrelevant headers or none at all. His screen reader misreports which semester or class he's reviewing. He feels uncertain. Proper referencing would aid academic planning.",
      "Greta, a blind retiree, checks her health portal for lab results. The result values have `headers` pointing to non-`<th>` cells. She doesn’t know what each value means. She feels anxious. Fixing the header associations would provide clarity.",
      "Isaac, a screen reader user, accesses an investment portfolio table. His screen reader misreads stock names and values due to incorrect header references. He feels unsure about his decisions. Proper associations would give him accurate data.",
      "Liam, a blind nonprofit worker, views donation statistics in a table. The cells reference `<td>` IDs from another table. His screen reader gets confused. He feels misinformed. Keeping `headers` scoped to `<th>` elements within the same table would solve the problem.",
      "Tariq, a blind marketing analyst, checks a client engagement dashboard. The table uses `headers` referencing empty or deleted IDs. His screen reader announces 'blank'. He misses insights. If only valid `<th>` headers were used, he’d access the data fully.",
      "Samira, a blind entrepreneur, uses a business performance site with monthly reports in tables. The values link to unrelated notes through `headers`. She feels disoriented and makes errors. Correcting references would enable clear comparisons.",
      "Zainab, a blind policy analyst, reviews legislative summaries formatted in tables. The `headers` attribute points to table captions or footnotes. She can’t relate items correctly. She feels ineffective. Proper header structure would improve analysis.",
      "Daniel, a blind journalist, examines a survey results table. Each response cell points to a `<td>` for questions instead of `<th>`. His screen reader fails to provide context. He feels confused. Valid `<th>` referencing would give him clarity."
    ],
    "responsibility": ["developer"]
  },
  "th-has-data-cells": {
    "title": "Table Header Cells Do Not Describe Any Data",
    "summary": "Table header cells (<th>) exist without any data cells for them to describe, making the table structure unclear for screen reader users.",
    "description": "Assistive technologies depend on headers to describe the data in a table. When those headers aren’t associated with any cells, users hear context without content. This disrupts the logical relationship and makes tables unusable or misleading for blind users.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.3.1 Info and Relationships",
        "link": "https://www.w3.org/TR/WCAG22/#info-and-relationships"
      }
    ],
    "act_rules": [
      {
        "name": "Table header cell has assigned cells",
        "link": "https://act-rules.github.io/rules/d0f69e"
      }
    ],
    "user_stories": [
      "Omar, a blind university administrator, reviews a table of student performance. His screen reader announces headers that don't correspond to any data. He feels confused and unable to make sense of the results. Ensuring each `<th>` cell is associated with data would clarify the information.",
      "Fatima, a screen reader user, accesses a medical portal with a table of test results. The top row uses `<th>` elements but no data appears under them. Her screen reader announces headers with no content. She feels unsure about her health data. Associating headers with data cells would restore trust.",
      "Leo, a blind software auditor, reviews bug reports in a dashboard. The tables include column headers that aren't linked to any rows. He hears labels like 'Bug ID' with no data. He feels blocked. Proper structure would allow effective review.",
      "Nina, a blind student, reads a timetable where rows are labeled with `<th>` but contain no classes. Her screen reader announces empty subjects. She’s unsure of her schedule. If the headers pointed to actual data cells, she’d be able to plan confidently.",
      "Carlos, a blind small business owner, checks a table summarizing monthly income. It includes column headers with no values underneath. His screen reader reads 'Month' and 'Revenue' but no figures. He feels misinformed. Assigning headers to actual data would provide the insight he needs.",
      "Sofia, a blind teen, uses a study app with a table of quiz results. The headers include 'Question' and 'Correct Answer', but the rows are empty. Her screen reader reads header-only cells. She feels unsure if the test was recorded. Connecting headers to meaningful content would help.",
      "George, a screen reader user, examines a price comparison chart. The table uses `<th>` for brands, but no products or prices follow. He hears headers with no data. He feels frustrated. Populating data or removing unused headers would improve the experience.",
      "Yuki, a blind travel planner, uses a site that lists flights. Column headers like 'Departure' and 'Arrival' are used, but there are no associated flights. She hears disconnected headings. She feels lost. If `<th>` elements matched data rows, she could evaluate her options.",
      "Jenna, a blind teen athlete, visits a tournament schedule with row headers for events, but no scores are included. Her screen reader announces match types without results. She feels excluded. Associating headers with complete rows would help her follow the competition.",
      "Aisha, a screen reader user, browses a job board table that includes headers like 'Company' and 'Role'. None of the rows are filled in. She hears structure with no content. She feels misled. Data cells matching these headers would give her a fair chance at finding work.",
      "Tariq, a blind user, accesses a community report table with headers for categories like 'Pollution' and 'Noise'. The data cells are missing, so his screen reader lists only the headers. He feels unable to interpret the report. Linking headers to meaningful data would allow understanding.",
      "Mei, a blind consultant, uses a dashboard to assess employee performance. It includes `<th>` headers without related cells. Her screen reader lists roles but offers no values. She can’t evaluate metrics. Connecting headers to populated data would fix this.",
      "Ben, a blind librarian, browses a digital archive listing books. Column headers like 'Author' and 'Year' are included, but there are no books listed. He hears empty categories. He feels disappointed. Including data or hiding empty headers would improve the experience.",
      "Samira, a screen reader user, checks a pension report formatted in a table. The table includes `<th>` elements for years but no retirement figures. She hears headers only. She feels anxious. Linking `<th>` cells to actual data would provide assurance.",
      "Greta, a blind retiree, visits a benefits site with a table summarizing her payments. It lists headers like 'Month' and 'Amount' but the rows are empty. Her screen reader repeats headers with no values. She feels uncertain. Adding data or removing redundant headers would solve the problem.",
      "Isaac, a blind teacher, checks a grading table with column headers but no student scores. He hears headers like 'Name' and 'Final Grade' but finds no data. He feels blocked. Connecting headers to student data would support his review.",
      "Lena, a blind app reviewer, tests a new survey tool. The results table includes row headers like 'Question 1' but no answers. Her screen reader repeats structure with no context. She feels unable to assess the tool. Populating rows would help.",
      "Haruto, a blind user, accesses an insurance dashboard with headers for policy types. The `<th>` elements don’t correspond to any entries. He feels misled by a structure without content. Filling in or removing orphaned headers would fix this.",
      "Zainab, a blind policy analyst, reviews a compliance checklist table. It lists criteria in `<th>` headers but no response cells. Her screen reader navigates meaningless structure. She feels frustrated. Associating data with headers would enable evaluation.",
      "Daniel, a blind journalist, browses a political fact-checking site with summary tables. Headers like 'Claim', 'Source', and 'Rating' appear, but the rows are blank. He hears context but no content. He feels unsure about the findings. Providing matching data cells would restore clarity."
    ],
    "responsibility": ["developer"]
  },
  "valid-lang": {
    "title": "Incorrect Language Codes Used",
    "summary": "Language codes must follow valid standards. Mistakes like lang=\"spanish\" or lang=\"fre\" confuse screen readers and users.",
    "description": "When developers use made-up or misspelled language codes, screen readers fail to interpret the language of the content properly. This is especially problematic on multilingual websites, where clear pronunciation and context switching are essential for blind and visually impaired users.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "3.1.2 Language of Parts",
        "link": "https://www.w3.org/TR/WCAG22/#language-of-parts"
      }
    ],
    "act_rules": [
      {
        "name": "Element with lang attribute has valid language tag",
        "link": "https://act-rules.github.io/rules/de46e4"
      }
    ],
    "user_stories": [
      "Omar, a blind multilingual student, reads a bilingual news site with sections marked `lang=\"englsh\"` instead of `en`. His screen reader doesn't switch to English pronunciation. He hears garbled words and feels frustrated. Using a valid lang attribute like `lang=\"en\"` would ensure correct reading.",
      "Fatima, a blind French speaker, visits a tourism site where some paragraphs are labeled `lang=\"frn\"`. Her screen reader doesn't recognize the tag, mispronouncing the text. She feels disoriented. A valid language code like `lang=\"fr\"` would make the content understandable.",
      "Leo, a blind researcher, reads a multilingual academic paper online. Portions are labeled `lang=\"sp\"` instead of the correct `lang=\"es\"`. His screen reader doesn't switch pronunciation. He feels confused. Correcting the lang values would support accurate reading.",
      "Sofia, a blind teen, uses a Spanish learning app. Vocabulary examples are marked `lang=\"spanish\"`, which her screen reader ignores. She hears awkward output. She feels frustrated. Using `lang=\"es\"` would improve her learning experience.",
      "Carlos, a blind traveler, browses a hotel booking site in German. Some content is labeled `lang=\"ger\"`, which is invalid. His screen reader mispronounces it. He feels unsure about booking. Using `lang=\"de\"` would provide clarity.",
      "Jenna, a blind language student, explores a site with Japanese proverbs. They're tagged with `lang=\"jp\"`, which isn’t valid. Her screen reader fails to switch pronunciation. She feels discouraged. A valid `lang=\"ja\"` would help her understand the content.",
      "Yuki, a blind user, checks an app mixing English and Korean. Korean text is labeled `lang=\"ko-KORR\"`, which is incorrect. Her screen reader reads it with English pronunciation. She feels disconnected. Using a valid `lang=\"ko\"` or `lang=\"ko-KR\"` would fix it.",
      "George, a blind professor, reads a multilingual textbook online. Greek sections are marked `lang=\"grk\"` instead of `lang=\"el\"`. His screen reader doesn’t switch properly. He feels frustrated. Valid language tags would support smooth reading.",
      "Tariq, a blind public speaker, practices from a website with Arabic content. It's marked `lang=\"arabic\"` which is invalid. His screen reader doesn’t switch. He mispronounces words during rehearsal. Using `lang=\"ar\"` would help him prepare accurately.",
      "Aisha, a blind job applicant, reads a resume template site with multilingual support. French phrases are marked `lang=\"fre\"`. Her screen reader doesn't interpret them correctly. She feels unsure. Using `lang=\"fr\"` would ensure proper pronunciation.",
      "Mei, a blind blogger, posts in Mandarin and uses `lang=\"chin\"`. Screen readers can’t parse the tag. Readers hear mixed pronunciations. She receives confused feedback. Switching to `lang=\"zh\"` or `lang=\"zh-CN\"` would improve comprehension.",
      "Nina, a blind high schooler, accesses a poem site with Latin excerpts marked `lang=\"lt\"`, which incorrectly maps to Lithuanian. Her screen reader mispronounces the text. She feels confused. Using `lang=\"la\"` would correct this.",
      "Isaac, a blind lawyer, reviews an international contract. Language sections are marked with company-specific codes like `lang=\"EN-USX\"`. His screen reader doesn’t switch. He misses legal nuances. Standard codes like `lang=\"en-US\"` are needed.",
      "Lena, a blind UX tester, audits a site for localization. Her screen reader reads gibberish from text tagged `lang=\"francais\"`. She flags it for failure. Validating the tag as `lang=\"fr\"` would fix the issue.",
      "Samira, a blind non-profit worker, checks donation pages in multiple languages. Swahili content is marked `lang=\"swh\"`, which isn't recognized. She hears mispronunciations. She feels embarrassed during translation work. Using `lang=\"sw\"` would resolve this.",
      "Haruto, a blind developer, builds an app for global users. A third-party component labels content `lang=\"ger-DE\"`, which screen readers skip. He’s frustrated by bad vendor code. Changing it to `lang=\"de-DE\"` would ensure compliance.",
      "Zainab, a blind educator, teaches a digital literacy course. Her students use a government site with `lang=\"eng-us\"`, which isn’t standard. Screen readers don’t switch dialects properly. She feels her lesson is undermined. Using `lang=\"en-US\"` would support learning.",
      "Ben, a blind retiree, accesses a site for international chess. Russian instructions are marked `lang=\"russ\"`. His screen reader doesn’t adjust. He misunderstands the moves. A correct `lang=\"ru\"` would fix it.",
      "Grace, a blind parent, uses a parenting blog where multilingual advice is labeled with random codes like `lang=\"parent-fr\"`. Screen readers ignore them. She feels left out of key information. Standard BCP 47 tags would restore accessibility.",
      "Omar, a blind entrepreneur, uses a startup’s dashboard with regional languages. One field is tagged `lang=\"malaya\"`, which his screen reader ignores. He misses business tips. Using `lang=\"ms\"` for Malay would make the advice accessible."
    ],
    "responsibility": ["developer"]
  },
  "video-caption": {
    "title": "Video Content Missing Captions",
    "summary": "When videos are missing synchronized captions, it's preventing users with hearing impairments from understanding the audio content.",
    "description": "Users with hearing impairments rely on captions to interpret video content. When captions are missing, as in this case, critical information conveyed through speech or sound is lost. This issue reduces access and creates an unequal experience for a significant portion of the audience.",
    "severity": "critical",
    "type": "failure",
    "wcag": [
      {
        "level": "A",
        "name": "1.2.2 Captions (Prerecorded)",
        "link": "https://www.w3.org/TR/WCAG22/#captions-prerecorded"
      }
    ],
    "act_rules": [
      {
        "name": "Video element auditory content has accessible alternative",
        "link": "https://act-rules.github.io/rules/eac66b"
      }
    ],
    "user_stories": [
      "Omar, a college student who is deaf, tries to watch a lecture video on his course site. The video has no captions. He misses all spoken content. He feels excluded. Adding synchronized captions would allow him full access.",
      "Fatima, a hard-of-hearing mother, views a parenting tips video. It lacks captions. She can’t follow the instructions. She feels frustrated. Providing accurate captions would make the advice usable for her.",
      "Leo, a deaf developer, watches a product demo video. With no captions, he misses key feature explanations. He feels left out. Captions would allow him to follow the narration.",
      "Sofia, a teen with hearing loss, watches a gaming tutorial. No captions are available. She guesses what’s being said. She feels confused. Captioning the video would help her follow along.",
      "Carlos, a deaf traveler, watches a guide video on a tourism site. Important cultural tips are missed without captions. He feels unprepared. Including captions would make the video informative.",
      "Jenna, a teacher with hearing loss, watches an education webinar. The content is clear visually, but she misses all speech. She feels discouraged. Captions would ensure she absorbs everything.",
      "George, a retiree with progressive hearing loss, tries to watch a recipe video. It has no captions. He misses ingredient details. He feels annoyed. Adding captions would allow full understanding.",
      "Yuki, a student with hearing difficulties, uses a museum site with video tours. Without captions, she misses curator commentary. She feels disappointed. Captions would provide equal access.",
      "Tariq, a deaf screen reader user, checks a business tutorial. There are visuals but no captions. He misses explanations. He feels confused. Adding captions would clarify the material.",
      "Aisha, a deaf designer, visits a UX blog. A case study video explains layout techniques but lacks captions. She can’t follow. She feels excluded. Captions would let her benefit fully.",
      "Mei, a commuter with hearing loss, tries to watch transit safety videos. The lack of captions means she misses alerts. She feels unsafe. Including captions would ensure safety information is accessible.",
      "Isaac, a deaf auditor, watches a training video with no captions. He misses compliance guidelines. He feels frustrated. Captioning the video ensures he meets job requirements.",
      "Lena, a deaf accessibility tester, flags a marketing video with no captions. She can’t evaluate the content. She feels unsupported. Captions would allow her to test effectively.",
      "Samira, a deaf entrepreneur, watches investor pitch videos. Without captions, she can’t assess tone or key arguments. She feels left behind. Adding captions levels the playing field.",
      "Haruto, a deaf musician, watches a music tutorial video. There are no captions for spoken cues. He feels frustrated. Including captions ensures full access to the teaching.",
      "Zainab, a journalist with hearing loss, reviews a documentary. It lacks captions for voiceovers. She misses critical quotes. She feels misinformed. Captions would provide journalistic accuracy.",
      "Ben, a deaf retiree, watches a history video online. Without captions, he can’t understand the narrative. He feels disconnected. Captioning the video would help him engage.",
      "Grace, a deaf caregiver, views healthcare instruction videos. They don’t have captions. She misses dosage and care instructions. She feels worried. Captions ensure she provides proper care.",
      "Omar, a deaf gamer, watches eSports recaps. Commentary is not captioned. He misses strategic analysis. He feels disappointed. Captions would make the content accessible.",
      "Fatima, a deaf usability expert, reviews client marketing content. Videos lack captions, making them inaccessible. She feels the content isn’t inclusive. Adding captions would demonstrate real commitment to accessibility."
    ],
    "responsibility": ["developer", "content"]
  },
  "autocomplete-valid": {
    "title": "Invalid autocomplete Values",
    "summary": "Autofill and assistive technologies rely on standard autocomplete tokens. Invalid values are reducing accessibility and user efficiency.",
    "description": "The autocomplete attribute must use standardized tokens like email, tel, or bday. When custom or misspelled values (e.g., emailaddress, dob, fullname) are used, browsers ignore the attribute. This denies users the benefit of faster, more accessible form completion, especially those using assistive technologies.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "1.3.5 Identify Input Purpose",
        "link": "https://www.w3.org/TR/WCAG22/#identify-input-purpose"
      }
    ],
    "act_rules": [
      {
        "name": "Autocomplete attribute has valid value",
        "link": "https://act-rules.github.io/rules/73f2c2"
      }
    ],
    "user_stories": [
      "Omar, a blind college student, fills out a scholarship form. The name field uses `autocomplete=\"fullname\"`, which is invalid. His screen reader doesn’t assist with autofill. He feels frustrated. Using `autocomplete=\"name\"` would allow correct autofill and guidance.",
      "Fatima, a screen reader user, registers for a conference. The email field is marked `autocomplete=\"emailaddress\"`, which is not recognized. Autofill fails, and her screen reader doesn’t confirm the purpose. She feels unsure. Correcting it to `autocomplete=\"email\"` would fix this.",
      "Leo, a blind shopper, creates an account on a new site. The address field uses `autocomplete=\"useraddress\"`. His screen reader doesn’t guide him, and autofill is disabled. He feels frustrated. Using `autocomplete=\"street-address\"` would ensure proper support.",
      "Sofia, a blind teen, signs up for a music app. The password field is marked with a misspelled autocomplete value. Her password manager doesn’t save it. She feels anxious about losing her credentials. Using `autocomplete=\"new-password\"` would solve this.",
      "Carlos, a blind entrepreneur, uses a banking app with an input marked `autocomplete=\"dob\"` for date of birth. His browser doesn’t recognize it. He feels confused. Using `autocomplete=\"bday\"` would enable correct autofill.",
      "Jenna, a blind student, accesses a job application form. The input for organization is labeled `autocomplete=\"employer\"`, which isn’t valid. She can’t reuse stored data. She feels annoyed. Using `autocomplete=\"organization\"` would help.",
      "Yuki, a blind traveler, fills out a booking form. The phone field has `autocomplete=\"phone-number\"`. Her screen reader doesn’t help her enter the number. She feels uncertain. The correct tag `autocomplete=\"tel\"` would restore functionality.",
      "George, a blind retiree, tries to reset a password. The form uses `autocomplete=\"password1\"`, which doesn’t trigger autofill. He feels frustrated. The right value `autocomplete=\"current-password\"` would allow smooth entry.",
      "Tariq, a blind student, signs into his university portal. The username field is marked `autocomplete=\"user\"`. His saved credentials don’t appear. He feels confused. `autocomplete=\"username\"` would support easier login.",
      "Aisha, a screen reader user, orders groceries. The city field is labeled `autocomplete=\"town\"`, which her browser ignores. She has to type it manually. She feels annoyed. Using `autocomplete=\"address-level2\"` would resolve this.",
      "Mei, a blind commuter, joins a transit rewards program. The form uses `autocomplete=\"zip\"` instead of `autocomplete=\"postal-code\"`. Her address doesn’t autofill. She feels delayed. Correcting it would ensure accessibility.",
      "Nina, a blind gamer, signs up for a tournament site. The birth year input is incorrectly tagged as `autocomplete=\"birth-year\"`. No browser support triggers. She feels misled. Using `autocomplete=\"bday-year\"` would fix the issue.",
      "Isaac, a blind tax preparer, enters client details into a finance portal. The job title input is marked `autocomplete=\"title\"`, which causes screen reader confusion. He hears an incorrect field description. Using `autocomplete=\"organization-title\"` would clarify.",
      "Lena, a blind volunteer, registers new members. Forms are inconsistently labeled—some with `autocomplete=\"mail\"`, some with `emailaddress\"`. She feels confused. Standardizing to `autocomplete=\"email\"` would improve consistency and functionality.",
      "Samira, a blind donor, makes a one-time donation. Her credit card form fields use `autocomplete=\"cc-number1\"` and `ccdate\"`. Her autofill fails. She feels annoyed. Correct values like `autocomplete=\"cc-number\"` and `cc-exp\"` would enable proper support.",
      "Haruto, a blind QA engineer, tests an e-commerce checkout form. Shipping fields have non-standard `autocomplete` values like `fulladdress` and `zipcode`. Autofill breaks. He logs a bug. Using `autocomplete=\"street-address\"` and `postal-code\"` would fix this.",
      "Zainab, a blind HR manager, adds a new employee. The input for name is split into fields with incorrect `autocomplete` values like `first` and `last`. Her screen reader doesn’t assist. She feels slowed down. Using `given-name` and `family-name` would help.",
      "Ben, a blind investor, updates his profile on a finance platform. The phone number field has `autocomplete=\"phone\"`, which is invalid. He manually enters the number. He feels inconvenienced. Using `autocomplete=\"tel\"` would restore autofill.",
      "Grace, a blind parent, fills out a school form. The emergency contact uses `autocomplete=\"emergency-phone\"`, which doesn’t work. She retypes information. She feels tired. Valid tags like `tel` or custom logic would improve usability.",
      "Omar, a blind business owner, updates his billing form. The country field uses `autocomplete=\"nation\"`. His browser doesn’t autofill the value. He feels frustrated. Replacing it with `autocomplete=\"country-name\"` would resolve the issue."
    ],
    "responsibility": ["developer"]
  },
  "avoid-inline-spacing": {
    "title": "Text Spacing Styles Prevent User Overrides",
    "summary": "Fixed spacing set via !important styles blocks assistive technology and user stylesheets from making needed adjustments.",
    "description": "When styles use !important for text spacing, they override browser or assistive technology settings intended to improve accessibility. This restricts users with reading difficulties, low vision, or neurodivergence from tailoring the content presentation to their needs. Removing !important allows user-defined spacing to take effect.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "1.4.12 Text Spacing",
        "link": "https://www.w3.org/TR/WCAG22/#text-spacing"
      }
    ],
    "act_rules": [
      {
        "name": "Letter spacing in style attributes is not !important",
        "link": "https://act-rules.github.io/rules/24afc2"
      },
      {
        "name": "Word spacing in style attributes is not !important",
        "link": "https://act-rules.github.io/rules/9e45ec"
      },
      {
        "name": "Line height in style attributes is not !important",
        "link": "https://act-rules.github.io/rules/78fd32"
      }
    ],
    "user_stories": [
      "Omar, a college student with dyslexia, tries to read a dense article online. The site uses `line-height: 1 !important`, preventing him from adjusting spacing. He struggles to follow the text and feels overwhelmed. Allowing user-defined line spacing would help him read more comfortably.",
      "Fatima, a screen magnifier user, views a government site. It enforces `letter-spacing: normal !important`, stopping her browser's accessibility settings. She finds letters hard to distinguish and feels eye strain. Removing `!important` would let her customize spacing for readability.",
      "Leo, a neurodivergent professional, reads training material. The style uses `word-spacing: 0 !important`, so he can't increase space between words. He reads slower and feels fatigued. Supporting text customization would improve his comprehension.",
      "Sofia, a high schooler with ADHD, reviews her online homework. The text uses tight spacing enforced with `!important`. She gets distracted and skips lines. She feels frustrated. Allowing increased line and word spacing would improve focus.",
      "Carlos, an older adult with mild vision impairment, reads the news online. The site uses `!important` for text spacing. His browser extension can’t override it. He feels the text is too cramped. Allowing custom spacing would make reading easier.",
      "Jenna, a student with reading difficulties, uses an extension to increase letter spacing. On her school’s website, `letter-spacing: 0 !important` overrides her settings. She feels blocked. Removing `!important` from styles would restore her control.",
      "George, a veteran with a cognitive disability, struggles with small text blocks. A nonprofit’s website restricts spacing using `!important`. He feels overwhelmed. Respecting user overrides for spacing would help him understand content better.",
      "Yuki, a dyslexic programmer, accesses documentation. It uses fixed spacing styles with `!important`. She can’t adjust it for better readability. She feels left out. Making spacing settings overrideable would support her learning.",
      "Tariq, a screen reader user with low vision, magnifies a training site. Text overlaps due to rigid `line-height` values marked `!important`. He can’t adjust it. He feels frustrated. Removing `!important` would fix this.",
      "Aisha, a visual learner with ADHD, increases line spacing to process text better. A job site blocks this with `!important` CSS. She misses key details and feels annoyed. Allowing spacing changes would improve her experience.",
      "Mei, a translator with visual fatigue, reads international law documents. The page uses compact text styles enforced by `!important`. She can’t increase spacing and feels eye strain. Adjustable spacing would support her work.",
      "Isaac, a student with Irlen Syndrome, uses a tool to add word spacing. A digital library site’s styles override his settings with `!important`. He feels confused reading the text. Letting user-defined spacing override defaults would solve this.",
      "Lena, a dyslexic researcher, accesses a portal where all text uses tight line height. Her browser extension fails due to `!important`. She feels overwhelmed and fatigued. Removing forced styles would support better comprehension.",
      "Samira, a blind user's assistant, configures an app interface for low-vision clients. The app forces text spacing with `!important`, disrupting accessible views. She feels frustrated. Support for customizable spacing is critical.",
      "Haruto, a blind teacher configuring content for his students with dyslexia, can't adjust text on a district site due to rigid `!important` styles. His students struggle. He feels unsupported. Allowing spacing control would aid accessibility.",
      "Zainab, a project manager with cognitive processing issues, increases spacing for clarity. A vendor dashboard blocks her settings with `!important`. She misreads key numbers. She feels at risk. Removing strict styles would help.",
      "Ben, a low-vision retiree, uses browser zoom and spacing tweaks. A medical portal ignores his preferences using `!important`. He misses dosage instructions and feels unsafe. Supporting spacing adjustments would ensure safety.",
      "Grace, a dyslexic parent, helps her child on an education site. The platform forces tight text spacing with `!important`. She feels discouraged when helping with reading. Allowing accessible spacing options would support learning.",
      "Omar, a screen magnifier user, navigates an airline’s website. Overlapping text appears due to enforced `line-height: normal !important`. He feels confused booking tickets. Removing `!important` would fix rendering.",
      "Fatima, an accessibility tester, audits a university site. She flags violations where spacing can’t be adjusted due to `!important`. She feels concerned for student access. Allowing spacing control would ensure compliance."
    ],
    "responsibility": ["developer"]
  },
  "target-size": {
    "title": "Touch Targets Are Too Small",
    "summary": "Touch targets that do not meet the minimum size requirements, making them difficult to activate for users with limited dexterity or using assistive tools.",
    "description": "Buttons, icons, or links that are smaller than 24x24 CSS pixels or too close together, making them difficult for users to activate. People with motor disabilities, tremors, or those using screen magnifiers often miss or misclick these controls. Providing larger targets and sufficient spacing helps ensure successful interaction.",
    "severity": "serious",
    "type": "failure",
    "wcag": [
      {
        "level": "AA",
        "name": "2.5.8 Target Size",
        "link": "https://www.w3.org/TR/WCAG22/#target-size"
      }
    ],
    "act_rules": [],
    "user_stories": [
      "Omar, a delivery driver with large fingers, tries to tap a 'Next' button on a mobile shipping app. The target is so small he keeps hitting the wrong button. He feels frustrated and rushed. If the button had a larger touch area, he could complete tasks more efficiently.",
      "Fatima, a Parkinson’s patient, struggles to tap links on a local news site. The clickable areas are tiny and close together. She often clicks the wrong article. She feels discouraged. Enlarging the link targets would make reading news easier.",
      "Leo, a blind screen magnifier user, uses a finance app where tiny icons are packed together. He struggles to locate and tap the right control. He feels overwhelmed. Increasing the target size would improve his accuracy and confidence.",
      "Sofia, a 10-year-old with low motor control, uses an education game. The interactive buttons are too small to tap reliably. She gets answers wrong despite knowing them. She feels defeated. Larger targets would support fair play and learning.",
      "Carlos, a stroke survivor, accesses a medical appointment app. The calendar buttons are too small for his limited hand coordination. He misclicks and books wrong dates. He feels anxious. Enlarging tap areas would reduce errors.",
      "Jenna, a commuter with hand tremors, uses a transit app. The station icons are tiny and require precise taps. She misses stops. She feels stressed. If targets met minimum size standards, she could plan routes safely.",
      "George, a blind user with voice control, tries to select a close icon on a modal. It’s visually tiny and hard to identify. He gives up. He feels frustrated. Increasing the visual and interactive size would support assistive tech users.",
      "Yuki, a retired pianist with arthritis, uses a recipe app. The ingredient checkboxes are too small to tap without pain. She avoids the app. She feels unsupported. Larger checkbox targets would allow comfortable use.",
      "Tariq, a teen with cerebral palsy, shops online. The color and size options are clickable dots that are too small to activate. He picks the wrong color. He feels excluded. Accessible target sizes would fix this.",
      "Aisha, a blind student using a head pointer, finds the contact form buttons on a university site too small to activate easily. She misses clicks and feels frustrated. Increasing button size would improve accessibility.",
      "Mei, a senior with shaky hands, tries to renew her license online. The ‘Submit’ button is cramped between other controls. She hits ‘Cancel’ instead. She feels discouraged. A larger target with spacing would prevent this.",
      "Isaac, a user with diabetic neuropathy, accesses a banking app. Tap areas for transactions are too narrow. He often selects the wrong one. He feels worried about making financial mistakes. Wider touch targets would reduce risk.",
      "Lena, a dyslexic app user, has trouble with small gear icons used for settings. She misclicks and loses her place. She feels disoriented. Larger and more recognizable targets would improve usability.",
      "Samira, a blind parent using magnification, tries to tap a tiny close icon on an ad. Her finger covers it, and she can’t see clearly. She feels frustrated. A larger, offset close target would solve this.",
      "Haruto, a tech-savvy senior, tries to access a travel itinerary. The interactive timeline dots are too small to tap on his tablet. He skips important details. He feels confused. Larger touch zones would enhance his experience.",
      "Zainab, a teacher with joint pain, accesses a gradebook. The small edit icons are hard to tap, especially on mobile. She feels exhausted. Meeting target size guidelines would ease her work.",
      "Ben, a retiree using a stylus, struggles with touch targets that are below 24x24 pixels. He constantly misses. He feels frustrated. Increasing touch areas would improve his independence online.",
      "Grace, a mother multitasking with one hand, tries to reorder groceries. The ‘move up’ icons are tiny arrows. She hits the wrong item. She feels annoyed. Larger, separated controls would help.",
      "Omar, using a public kiosk, tries to tap navigation arrows on a survey. They’re too small and close together. He gets stuck. He feels ignored. Providing adequately sized targets would ensure smoother flow.",
      "Fatima, a frequent flyer with reduced dexterity, struggles to tap seat selection icons on an airline site. She selects the wrong seat. She feels frustrated. Larger interactive seat markers would support accessibility and satisfaction."
    ],
    "responsibility": ["developer", "design"]
  },
  "accesskeys": {
    "title": "Duplicate Accesskey Values",
    "summary": "Duplicate accesskey values cause confusion or trigger the wrong action for users relying on keyboard shortcuts.",
    "description": "Non-unique accesskey assignments can cause unexpected behavior, especially for users who depend on consistent keyboard interactions. Screen readers and voice input software may misinterpret which element to activate, leading to misnavigation or lost input. Each accesskey should be distinct to support usability.",
    "severity": "serious",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student using keyboard shortcuts, tries to navigate his school’s website. Two links use the same `accesskey='n'`. Pressing the shortcut doesn’t take him where he expects. He feels confused. If each accesskey were unique, navigation would be predictable.",
      "Fatima, a motor-impaired user, relies on accesskeys to move quickly through forms. On a government site, three inputs use the same `accesskey='s'`. She presses the shortcut, but nothing useful happens. She feels frustrated. Unique keys would restore efficient access.",
      "Leo, a blind researcher, uses a screen reader that announces accesskeys. On a medical site, identical keys appear for two actions. He’s unsure which will trigger. He feels unsure and slows down. Ensuring distinct accesskey values would remove ambiguity.",
      "Sofia, a student with repetitive strain injury, uses custom key mappings. On her university portal, conflicting accesskeys mean her shortcut overlaps with unintended functions. She feels disrupted. Unique keys would preserve her custom workflow.",
      "Carlos, a screen reader user, accesses a public health portal. Pressing `Alt+P` takes him to a form and also submits it. He’s confused and loses progress. He feels discouraged. Separating accesskeys would avoid such conflicts.",
      "Jenna, a blind teen, uses accesskeys for navigation. Her favorite game site uses `accesskey='g'` for both the gallery and the guide. She can’t reach the guide consistently. She feels stuck. Assigning unique keys would fix this.",
      "George, a voice control user, triggers commands via spoken shortcuts. On a support site, `accesskey='h'` activates two links. The software picks one at random. He feels frustrated. Unique keys would give him reliable control.",
      "Yuki, a user with limited arm mobility, uses accesskeys to skip long pages. A shopping site duplicates keys, making shortcuts ineffective. She feels overwhelmed. Consistent, unique accesskeys would improve her experience.",
      "Tariq, a keyboard-only user, navigates an educational portal. Several sections use the same `accesskey='e'`. It’s unclear where he’ll land. He feels uncertain. Distinct shortcuts would allow confident navigation.",
      "Aisha, a low-vision user, relies on browser hints for accesskeys. A weather app has multiple links with `accesskey='w'`. She can’t rely on shortcuts. She feels annoyed. Unique keys per element would support her use.",
      "Mei, an elder using a keyboard interface, presses `Alt+L` expecting to log in. The key also opens the language menu. She feels confused and makes mistakes. Assigning clear, unique accesskeys would solve this.",
      "Isaac, a user testing accessibility, finds a financial site with multiple `accesskey='a'` values. Screen readers behave inconsistently. He reports confusion. He recommends unique keys per page function.",
      "Lena, a busy parent, uses keyboard navigation while holding her child. A learning site reuses accesskeys, sending her to the wrong module. She feels frustrated. Unique keys would streamline multitasking.",
      "Samira, a blind designer, reviews a client site with repeating `accesskey='s'`. Her screen reader can’t resolve where it leads. She feels frustrated with the ambiguity. Distinct keys would ensure accessibility.",
      "Haruto, a developer with a mobility impairment, audits a codebase. Multiple menu items have the same accesskey. He flags this as a barrier. Assigning one per function would fix usability.",
      "Zainab, an admin working across tabs, uses accesskeys to streamline tasks. Repeated values cause overlaps and errors. She feels her workflow is disrupted. Unique values per tab would restore clarity.",
      "Ben, a blind retiree, uses accesskeys on a news site. Duplicates cause articles to open or refresh unpredictably. He feels stressed. Unique keys per command would prevent confusion.",
      "Grace, a keyboard-only user, customizes accesskey triggers in her browser. A travel site reuses several keys. She experiences conflict and can’t override. She feels helpless. Ensuring unique accesskeys would fix this.",
      "Omar, navigating with a single-switch device, relies on predictable shortcuts. Reused keys on an NGO site cause erratic jumps. He feels disoriented. Using different accesskeys would preserve focus.",
      "Fatima, testing accessibility compliance, finds duplicated accesskeys on a banking platform. She logs it as an advisory but critical UX issue. She recommends validating accesskeys to ensure uniqueness across pages."
    ],
    "responsibility": ["developer"]
  },
  "aria-allowed-role": {
    "title": "Invalid ARIA Role",
    "summary": "Inappropriate role attributes cause confusion for users relying on assistive technologies.",
    "description": "Assigning invalid roles can disrupt how content is interpreted by assistive technologies. For instance, a <div> marked as role='link' but lacking link behavior creates inconsistencies. This undermines trust and predictability in navigating the interface.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student using a screen reader, encounters a `<div>` with `role='link'` but no associated `href`. His screen reader announces it as a link, but nothing happens when activated. He feels confused. If the role matched the element's behavior, he'd know what to expect.",
      "Fatima, a screen reader user, browses a site where a `<section>` has `role='button'`. Her screen reader announces it as a button, but it’s not interactive. She feels misled. Using valid roles would align announcements with functionality.",
      "Leo, a blind software tester, checks a dashboard with `<ul role='table'>`. His screen reader expects table-like behavior but receives list structure. He feels disoriented. Using valid ARIA roles would prevent confusion.",
      "Sofia, a student with dyslexia, uses a browser plugin to simplify site structures. Incorrect ARIA roles cause it to misinterpret elements. She gets overwhelmed. Correct roles would ensure reliable parsing and support.",
      "Carlos, a blind manager, accesses an HR portal. A `<nav>` is incorrectly given `role='main'`, conflicting with the actual main content. He jumps to the wrong region. He feels frustrated. Assigning roles accurately would fix navigation.",
      "Jenna, a blind teen, uses a gaming forum. A `<span>` is assigned `role='form'`, which doesn’t render or behave like a form. She feels confused. Removing or correcting the role would improve clarity.",
      "George, a voice control user, relies on semantic roles for command targeting. A `<p>` is mislabeled with `role='heading'`. He gives a voice command, but nothing responds. He feels blocked. Valid roles would restore control.",
      "Yuki, a developer with vision loss, checks a site that assigns `role='listitem'` to a `<div>` outside a `<ul>`. His screen reader announces it, but the structure is broken. He feels misled. Matching role and HTML context would help.",
      "Tariq, a student using speech recognition, targets `role='dialog'` to close a modal. It’s set on a `<div>` without correct attributes. Nothing happens. He feels stuck. Correct role usage with required properties would enable interaction.",
      "Aisha, a screen reader user, reads an FAQ page. Questions are in `<h2>` tags but labeled with `role='button'`, though not clickable. Her reader treats them as buttons. She feels annoyed. Accurate ARIA use would clarify meaning.",
      "Mei, a blind shopper, browses a product page. A `<span>` with `role='checkbox'` doesn't behave like one. Her screen reader misleads her. She feels uncertain. Removing incorrect roles would improve accuracy.",
      "Isaac, a blind accountant, reviews a financial dashboard. `<table>` elements have `role='gridcell'`, disrupting screen reader interpretation. He hears illogical descriptions. He feels frustrated. Valid semantic use would help.",
      "Lena, a blind accessibility auditor, flags a site where `<article>` is labeled with `role='alert'`. Screen readers announce content out of context. She feels alarmed. Proper ARIA use would avoid false urgency.",
      "Samira, a low-vision user, zooms into a page where `role='presentation'` is used incorrectly on a meaningful `<th>`. Her screen reader ignores it. She misses data context. She feels misinformed. Removing the role would preserve table semantics.",
      "Haruto, a QA engineer with blindness, tests a blog where `role='heading'` is added to decorative `<div>`s. His screen reader treats them as structural elements. He feels confused. Only semantic headings should have that role.",
      "Zainab, a blind policy analyst, accesses a legislative archive. A `<form>` is mislabeled with `role='article'`. Her screen reader skips key inputs. She feels frustrated. Using correct roles would keep her informed.",
      "Ben, a screen reader user, tries to navigate a page with multiple `role='main'` assignments. His assistive tech can’t distinguish the main content. He feels overwhelmed. Ensuring a single `main` role would fix this.",
      "Grace, a low-vision user using text-to-speech, finds modal elements labeled with `role='tooltip'` but containing actionable controls. Her software treats them as tips, not dialogs. She feels misled. Accurate roles would reflect the function.",
      "Omar, reviewing a site for compliance, notices `role='banner'` on non-header elements like sidebars. Screen readers misplace navigation. He feels lost. Correcting role placement would aid orientation.",
      "Fatima, a keyboard-only user, relies on ARIA landmarks to skip content. The misuse of `role='complementary'` on unrelated elements disrupts her flow. She feels slowed down. Appropriate role use would improve efficiency."
    ],
    "responsibility": ["developer"]
  },
  "aria-dialog-name": {
    "title": "ARIA Dialog Element Missing Accessible Name",
    "summary": "Dialogs using ARIA roles like dialog or alertdialog lack descriptive labels, preventing users from understanding the context.",
    "description": "When a dialog appears without a descriptive accessible name, users who rely on screen readers cannot distinguish whether it contains a warning, success message, form, or confirmation. This creates uncertainty and increases cognitive load. Naming dialogs meaningfully improves clarity and trust.",
    "severity": "serious",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, tries to reset his password on a college website. A dialog opens but has no accessible name. His screen reader says 'dialog' without context. He doesn’t know what it’s for. He feels confused. Adding a descriptive accessible name would help him understand its purpose.",
      "Fatima, a blind journalist, uploads a photo on a news platform. An alert dialog appears, but her screen reader just announces 'alert dialog' with no title. She doesn’t know if the upload succeeded or failed. She feels anxious. Providing a name like 'Upload failed' would clarify the message.",
      "Leo, a screen reader user, accesses a feedback form. When he clicks 'Submit', a dialog opens with no title. His screen reader says 'dialog'. He wonders if it's a success, error, or confirmation. He feels frustrated. Naming the dialog clearly would guide him.",
      "Sofia, a teen with vision loss, changes her profile photo. A crop tool opens in a dialog with `role='dialog'` but no accessible name. Her screen reader doesn’t identify what it is. She feels lost. Giving it a name like 'Crop image' would orient her.",
      "Carlos, a screen reader user, tries to confirm a payment. An alertdialog appears, but there's no accessible name. He only hears 'alert dialog'. He doesn’t know if it succeeded or failed. He feels nervous. Naming it 'Payment successful' or 'Payment error' would help.",
      "Jenna, a blind student, logs into a university portal. A modal with `role='dialog'` appears to display important announcements, but it's unnamed. Her screen reader doesn’t identify it. She misses key updates. She feels excluded. Adding a heading would make it accessible.",
      "George, a blind retiree, clicks 'Help' on a website. A dialog opens, but it lacks an accessible name. He hears 'dialog' and nothing else. He closes it, unsure. He feels unsupported. A title like 'Help Center' would solve the issue.",
      "Yuki, a screen reader user, uses a language learning app. A dialog appears with grammar tips but has no accessible name. It interrupts her lesson without explanation. She feels disoriented. Giving it a label like 'Grammar Tip' would add context.",
      "Tariq, a blind designer, previews a design approval modal. It lacks a name, so his screen reader only says 'dialog'. He doesn’t know what he’s approving. He feels frustrated. Including a heading like 'Design Approval' would clarify the function.",
      "Aisha, a blind screen reader user, selects 'Delete Account'. A confirmation dialog opens, but has no name. She’s unsure if she's in the right place. She feels cautious. A clear title like 'Confirm Deletion' would provide confidence.",
      "Mei, a blind editor, sees a grammar warning appear in a dialog while editing. It has no accessible name. Her screen reader skips it. She feels unaware of issues. A label like 'Grammar Alert' would improve awareness.",
      "Isaac, a blind lawyer, accesses legal documents through a dialog-based viewer. The dialog lacks an accessible name. He can’t distinguish it from the rest of the page. He feels confused. Labeling it 'Document Viewer' would assist navigation.",
      "Lena, a blind parent, checks out on an e-commerce site. A final confirmation dialog appears but is unnamed. Her screen reader doesn’t distinguish it. She feels unsure about placing the order. A label like 'Confirm Purchase' would reassure her.",
      "Samira, a blind user, opens a subscription upgrade modal. The screen reader says 'dialog' but provides no details. She doesn’t know what she’s accepting. She feels hesitant. An accessible name like 'Upgrade Plan' would help.",
      "Haruto, a blind musician, uses a mixing tool that opens track settings in a dialog. The dialog has no accessible name. He doesn’t know if it’s for volume, effects, or inputs. He feels disoriented. Giving it a title would clarify the purpose.",
      "Zainab, a blind policy analyst, downloads reports. A save settings dialog opens with `role='dialog'` but is unnamed. She’s unsure what settings she’s modifying. She feels lost. A title like 'Download Options' would provide clarity.",
      "Ben, a blind user, is reviewing his cart. A dialog appears after clicking 'Check Discounts', but his screen reader only says 'dialog'. He’s unsure if it’s working. He feels uncertain. Labeling it 'Discount Details' would help.",
      "Grace, a screen reader user, joins a video call. A permissions dialog appears without an accessible name. She hears 'dialog' and nothing more. She can’t tell what it’s asking. She feels stuck. Naming it 'Microphone Access' would guide her.",
      "Omar, a developer with a screen reader, tests a login modal. The dialog has no name. He can't verify what users will hear. He feels it's incomplete. Adding a clear accessible name like 'Login' would improve user trust.",
      "Fatima, a project manager with vision loss, opens a status update dialog. Without an accessible name, her screen reader doesn’t orient her. She can’t tell if she’s editing or reading updates. She feels unsure. A name like 'Project Status' would help her focus."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-text": {
    "title": "Focusable Elements Inside role=\"text\"",
    "summary": "When interactive elements are placed inside role=\"text\" containers, screen readers often ignore them, causing accessibility issues.",
    "description": "Interactive components inside role=\"text\" regions are suppressed by assistive technology. This results in important actions—like confirming a choice, navigating to related information, or submitting inputs—being inaccessible to users who depend on screen readers. Removing the role or separating interactive elements ensures full usability.",
    "severity": "serious",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, uses a screen reader to explore a tutoring site. A `<div role='text'>` contains a focusable link, but his screen reader skips it. He misses the link to join a class. He feels frustrated. Removing focusable elements from inside `role='text'` containers would restore proper navigation.",
      "Fatima, a screen reader user, browses a charity website. A block with `role='text'` includes a form input. Her screen reader doesn’t detect the field. She feels blocked. If the input were outside the `role='text'` region, she could complete the form.",
      "Leo, a blind researcher, reviews a summary section labeled with `role='text'`, which contains a button to download a report. His screen reader skips the button. He feels confused. Structuring the markup without interactive elements inside the `role='text'` region would make the button accessible.",
      "Sofia, a blind teen, reads a guide on a hobby site. The `role='text'` container includes a toggle switch. Her screen reader ignores it. She feels lost. Removing the role or restructuring the content would help her access the control.",
      "Carlos, a screen reader user, uses a customer support tool. A section marked `role='text'` has a clickable icon for live chat. His screen reader doesn't announce it. He feels unsupported. Keeping only static content within `role='text'` elements would solve the issue.",
      "Jenna, a blind user, checks a job board. A `role='text'` region includes links to job postings. They are skipped by her screen reader. She feels frustrated. Removing the role or separating interactive elements would improve usability.",
      "George, a blind retiree, reads his medical history on a portal. One expandable section uses `role='text'` and contains focusable tabs. He can't navigate to them. He feels confused. Avoiding focusable elements within `role='text'` would fix this.",
      "Yuki, a voice navigation user, targets links by role. One region labeled `role='text'` includes a focusable feedback link. It’s inaccessible via command. He feels frustrated. Removing the conflicting role would support his workflow.",
      "Tariq, a blind user, checks a dashboard. An announcements area uses `role='text'` and includes action buttons. His screen reader skips them. He feels uninformed. If action elements were outside the `role='text'`, they would be accessible.",
      "Aisha, a screen reader user, accesses a language learning app. Tips shown with `role='text'` include a speaker icon to play audio. Her reader skips it. She feels excluded. Ensuring such regions have only passive content would fix this.",
      "Mei, a blind commuter, checks a transit app. A notice with `role='text'` contains a link to delays. It’s not announced. She feels unprepared. Removing the role or separating interactive elements would help.",
      "Isaac, a blind analyst, accesses a data tool where instructional overlays use `role='text'` but include form fields. His screen reader ignores them. He feels blocked. Avoiding interactive elements within `role='text'` ensures they remain visible to assistive tech.",
      "Lena, a blind parent, uses a school platform. A `role='text'` section has interactive calendars. She can’t access them. She feels left out. Placing interactive widgets outside text-only containers would help.",
      "Samira, a blind voter, accesses an election site. A `role='text'` labeled panel includes a poll submission link. It’s skipped. She feels like her voice doesn’t count. Ensuring clickable elements aren’t within `role='text'` would fix this.",
      "Haruto, a blind developer, inspects a mobile app. He finds modal content using `role='text'` with a confirm button. His screen reader misses the button. He feels it's a critical oversight. Proper semantic separation would prevent errors.",
      "Zainab, a blind researcher, opens an academic article. A sidebar marked `role='text'` includes footnote toggles. They’re not announced. She misses references. She feels frustrated. Clear markup would support access.",
      "Ben, a blind senior, uses an e-reader app. Notes in `role='text'` containers include interactive citations. His screen reader can’t activate them. He feels stuck. Keeping citations outside the role would help.",
      "Grace, a blind jobseeker, accesses a resume builder. A help panel with `role='text'` contains a dropdown menu. It’s not read. She can’t customize options. She feels blocked. Using standard roles would improve interaction.",
      "Omar, testing a mobile form, finds the help tooltip uses `role='text'` but has a clickable FAQ link. His screen reader ignores it. He feels confused. Restructuring the element would ensure it’s accessible.",
      "Fatima, reviewing a health site, finds a `role='text'` section with embedded media controls. Her screen reader doesn’t see them. She can’t play the video. She feels disappointed. Ensuring controls aren’t hidden by roles would solve this."
    ],
    "responsibility": ["developer", "content"]
  },
  "aria-treeitem-name": {
    "title": "Unlabeled ARIA Treeitems",
    "summary": "Tree items without accessible names prevent screen reader users from understanding or navigating the structure.",
    "description": "When a tree view is used for navigation or organization and items lack text labels, screen reader users are unable to distinguish between entries. This leads to confusion, errors, and an inability to interact with the content. Providing meaningful, descriptive names ensures users can make informed choices.",
    "severity": "serious",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, navigates a course catalog in a tree structure. Each node is a `treeitem` but lacks a name. His screen reader just says 'tree item' repeatedly. He can’t distinguish courses. He feels stuck. Providing meaningful names would help him choose classes confidently.",
      "Fatima, a screen reader user, browses a file directory with tree items. Many nodes have no labels. She hears 'tree item, tree item' with no context. She feels lost. Giving each item a text label would provide clarity.",
      "Leo, a blind developer, reviews a project structure in a code editor. Tree items representing files have no accessible names. His screen reader can’t tell what file he’s on. He feels blocked. Including accessible labels would improve navigation.",
      "Sofia, a blind gamer, explores a game’s settings menu using a tree view. The treeitems have no names. Her screen reader announces them as blank. She feels frustrated. Adding text labels like 'Graphics', 'Audio' would fix this.",
      "Carlos, a blind manager, organizes team folders in a document management tool. Treeitems show as empty in his screen reader. He doesn’t know which folder is which. He feels disorganized. Accessible names for each tree item would restore usability.",
      "Jenna, a blind user, accesses a government benefits portal. The navigation uses a tree structure but items have no accessible names. She can’t reach the correct service. She feels unsupported. Labeling items would guide her accurately.",
      "George, a screen reader user, tries to set permissions in an enterprise app. The roles are shown as treeitems with no labels. He can’t select or confirm anything. He feels confused. Naming each item like 'Admin', 'Viewer' would solve this.",
      "Yuki, a blind student, explores a university library’s catalog. The tree structure for topics has no labeled items. She can’t follow the hierarchy. She feels discouraged. Providing labels like 'History', 'Science' would help her learn.",
      "Tariq, a blind voter, uses a candidate tracker. The tree of elections and regions is unlabeled. His screen reader announces nothing useful. He feels uninformed. Accessible names like '2025 General', 'Local' would assist.",
      "Aisha, a blind designer, explores project assets in a tree view. Assets show up with no name, just 'tree item'. She can’t find images or text files. She feels frustrated. Adding appropriate names would support her work.",
      "Mei, a blind commuter, checks a public transit app with tree menus. Routes are treeitems with no names. Her screen reader can’t tell which line she’s viewing. She feels stranded. Labeling each route would clarify navigation.",
      "Isaac, a blind accountant, reviews financial categories in a tax app. Tree items labeled with `role='treeitem'` are not announced properly. He can’t sort expenses. He feels blocked. Including names like 'Income', 'Expenses' would fix this.",
      "Lena, a blind parent, manages school documents. The sidebar uses treeitems but lacks accessible names. She feels unsure what she’s selecting. Providing specific names like 'Report Cards', 'Homework' would guide her.",
      "Samira, a blind entrepreneur, uses a business tool with feature toggles in a tree. Without names, she doesn’t know what features are active. She feels overwhelmed. Naming each feature would ensure clarity.",
      "Haruto, a blind musician, browses audio presets in a tree. Each option has no accessible name. He has to guess blindly. He feels discouraged. Providing preset names would support informed choices.",
      "Zainab, a blind researcher, uses a digital archive with tree navigation. Collections are treeitems with no labels. She misses key folders. She feels limited. Accessible labels would improve discovery.",
      "Ben, a blind retiree, explores family tree software. Each generation is represented as a treeitem, but unnamed. He can’t follow his lineage. He feels disconnected. Labeling each item like 'Parent', 'Child' would enhance the experience.",
      "Grace, a blind user, uses an investment tool. The sectors and stocks appear in a tree without names. She can’t analyze her portfolio. She feels worried. Adding names like 'Technology', 'Healthcare' would solve this.",
      "Omar, reviewing a travel planner, sees destinations grouped in a tree menu. With no accessible names, his screen reader offers no guidance. He feels lost. Naming each destination would improve planning.",
      "Fatima, an accessibility tester, audits a career platform. The job filter tree has unlabeled items. She notes confusion in assistive tech. She feels it’s a major flaw. Adding accessible names would make filters usable."
    ],
    "responsibility": ["developer", "content"]
  },
  "empty-heading": {
    "title": "Headings Are Missing Text Content",
    "summary": "Empty headings are announced without any descriptive content, confusing users who rely on them for page structure.",
    "description": "Empty heading tags confuse users who rely on screen readers to jump through sections of a page. Without a descriptive label, these headings are useless as landmarks, and can make it harder to find relevant content or understand the page hierarchy. Populating headings with relevant text supports clarity and accessibility.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [
      {
        "name": "Heading has non-empty accessible name",
        "link": "https://act-rules.github.io/rules/ffd0e9"
      }
    ],
    "user_stories": [
      "Omar, a blind student, uses a screen reader to skim a college blog by jumping between headings. He encounters several empty headings. His screen reader announces 'heading level 2' with no text. He feels lost. If each heading had clear text, he could understand the page’s structure.",
      "Fatima, a blind jobseeker, uses a resume builder with headings for sections like 'Skills' and 'Experience'. Some headings are visually styled but empty in markup. She hears 'heading' with no content. She feels frustrated. Adding meaningful text would help her fill out her resume accurately.",
      "Leo, a blind analyst, uses a screen reader to navigate a report. Several sections have `h2` tags with no labels. He can't tell what the sections cover. He feels confused. Filling in the headings would clarify content structure.",
      "Sofia, a blind high schooler, visits a study guide with nested empty headings. She hears 'heading level 3' multiple times with no context. She feels disoriented. Giving each heading a label like 'Step 1' or 'Summary' would provide direction.",
      "Carlos, a blind shopper, visits a product site where categories are separated by empty `h2`s. His screen reader lists meaningless headings. He can’t find the item he wants. He feels annoyed. Descriptive text like 'Electronics' or 'Clothing' would improve browsing.",
      "Jenna, a blind parent, accesses a school calendar page. The events are under empty heading tags. She can’t tell what date or week she’s viewing. She feels frustrated. Populating the headings with dates would give her orientation.",
      "George, a screen reader user, reviews an FAQ. The questions are wrapped in headings, but some are empty due to styling errors. He skips useful info. He feels excluded. Ensuring headings have text would help him navigate.",
      "Yuki, a blind user, accesses a banking site with dashboard sections. Several `h3`s are used for layout only, and have no text. He hears 'heading level 3' over and over. He feels overwhelmed. Removing or labeling headings would clarify structure.",
      "Tariq, a blind user, opens an email settings page. Each section is marked with an empty heading. He can’t jump to what he needs. He feels lost. Providing names like 'Notifications' or 'Security' would solve the issue.",
      "Aisha, a blind reader, checks a news app. Several articles start with `h2` tags but have no visible or screen reader text. She can’t differentiate between them. She feels disappointed. Filling in headlines would support her experience.",
      "Mei, a blind community member, accesses a city planning site. Updates are listed under empty headings. She misses critical details. She feels under-informed. Headings like 'Zoning', 'Meetings' would offer clarity.",
      "Isaac, a blind lawyer, browses court updates. Case summaries use empty `h2` tags. His screen reader provides no information. He feels frustrated. Providing each case title would aid legal review.",
      "Lena, a blind parent, accesses a learning app for her child. Lesson units start with empty headings. She can’t track progress. She feels unsure. Clear, labeled headings would fix this.",
      "Samira, a blind project manager, reviews a report that uses decorative headings with no content. Her screen reader announces 'heading' without meaning. She feels misled. Adding text or removing decorative headings would help.",
      "Haruto, a blind musician, explores a music library. Each genre section starts with a heading tag that’s empty. He can’t tell what songs he’s viewing. He feels lost. Text like 'Jazz' or 'Pop' would guide him.",
      "Zainab, a blind researcher, explores a research database. Each dataset section starts with `h2` tags with no content. She can’t identify data groups. She feels confused. Adding names like 'Population Study' would fix this.",
      "Ben, a blind retiree, reads health info online. Subsections use headings, but many are empty. He skips vital tips. He feels unsafe. Headings with content like 'Symptoms', 'Treatment' would help him navigate.",
      "Grace, a blind user, tries to use an airline booking site. The heading for each travel step is empty. She doesn’t know where she is in the process. She feels frustrated. Naming each step would guide her properly.",
      "Omar, a tester, finds that a site uses headings purely for spacing. His screen reader lists them, but they provide no context. He feels it's misleading. Using proper styling instead of heading tags would improve clarity.",
      "Fatima, a blind accessibility auditor, inspects a government site. Many headings are used for layout with no text. Screen readers list them but offer no content. She flags it. Adding descriptive labels or using correct elements would resolve this."
    ],
    "responsibility": ["developer", "content"]
  },
  "empty-table-header": {
    "title": "Table Headers Missing Text Labels",
    "summary": "When <th> elements are empty, assistive technologies cannot convey the meaning of the data, leading to confusion.",
    "description": "Data tables with blank header cells cause screen readers to announce “blank” or nothing at all, leaving users unsure what each cell refers to. This creates confusion and undermines the value of tabular information, especially in contexts like finances, grades, or travel plans.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, accesses a grading table on his school portal. The column headers are empty `<th>` elements. His screen reader can’t tell what each grade represents. He feels confused. Adding meaningful header text like 'Assignment' and 'Score' would make it usable.",
      "Fatima, a screen reader user, reviews her billing history. The table shows amounts and dates, but the headers are blank. She can’t determine what the values mean. She feels anxious. Including labels like 'Date', 'Amount' would solve this.",
      "Leo, a blind QA tester, checks an admin dashboard table. Several `<th>` tags are visually styled but empty. His screen reader announces ‘blank’. He feels blocked. Providing descriptive headers would support effective testing.",
      "Sofia, a blind student, accesses a course schedule table. The days of the week are missing from the headers. She hears data with no context. She feels frustrated. Adding headers like 'Monday', 'Tuesday' would give meaning.",
      "Carlos, a screen reader user, views his bank transactions. The headers for 'Description', 'Amount', and 'Balance' are missing. He hears numbers but doesn’t know what they relate to. He feels unsure. Descriptive headers would clarify.",
      "Jenna, a blind parent, checks a lunch menu table. Each column is missing header text. Her screen reader can't tell which foods are served when. She feels disoriented. Including headers like 'Monday', 'Lunch' would guide her.",
      "George, a blind retiree, tracks medication in a health app. The table includes dosage and time fields, but the headers are empty. He feels overwhelmed. Labels like 'Medication', 'Time' would ease confusion.",
      "Yuki, a screen reader user, reads a comparison chart of subscription plans. Each column header is blank. She doesn’t know which features belong to which plan. She feels lost. Naming the headers 'Basic', 'Premium' would help.",
      "Tariq, a blind user, explores a product pricing table. The headers above each tier are empty. He can’t distinguish between options. He feels stuck. Adding names like 'Standard', 'Pro' would resolve the issue.",
      "Aisha, a screen reader user, accesses an academic performance report. The quarterly headers are blank. She can’t tell which score belongs to which period. She feels unsure. Including 'Q1', 'Q2' would provide clarity.",
      "Mei, a blind commuter, checks a bus schedule. The column headers for time slots are empty. She hears times but doesn’t know which direction or stop. She feels misinformed. Adding proper headers would help her plan.",
      "Isaac, a blind auditor, reviews a client report. The financial table lacks header text. His screen reader provides data but no meaning. He feels limited. Including 'Revenue', 'Expenses' would aid his work.",
      "Lena, a blind user, accesses a recipe table. Ingredient rows are labeled, but the `<th>`s above quantity, unit, and notes are empty. She feels confused. Providing labels would ensure accurate measurements.",
      "Samira, a blind editor, checks a table of editorial tasks. The task statuses are under blank headers. She hears entries but can’t interpret them. She feels disoriented. Adding status names would clarify.",
      "Haruto, a blind music teacher, accesses a student performance log. The grade headers are blank. He can’t tell which entry matches which subject. He feels blocked. Proper `<th>` labels would fix this.",
      "Zainab, a blind user, tracks expenses in a budgeting app. The headers for date, category, and amount are visually styled but not labeled for screen readers. She feels frustrated. Accessible text would restore clarity.",
      "Ben, a blind retiree, accesses a government tax summary. The table has several blank `<th>`s. He hears figures but no context. He feels overwhelmed. Including 'Year', 'Deduction', 'Refund' would help.",
      "Grace, a blind traveler, compares flights. The table shows times and prices, but the headers are empty. She can’t tell what each value refers to. She feels confused. Adding 'Departure', 'Arrival' would fix this.",
      "Omar, testing a charity platform, finds donation history tables with blank headers. His screen reader announces only data. He feels something’s missing. Adding headings like 'Donor Name', 'Amount' would complete the experience.",
      "Fatima, a screen reader user, audits an academic data dashboard. Several visual tables have styled headings that aren’t tagged. She notes that users hear ‘blank’ at the top of each column. She feels it’s misleading. Proper use of accessible header text would solve it."
    ],
    "responsibility": ["developer", "content"]
  },
  "heading-order": {
    "title": "Headings Are Used Out of Logical Order",
    "summary": "When headings are out of order, assistive technologies cannot accurately present the structure of the content.",
    "description": "A properly ordered heading structure allows screen reader users to navigate quickly and orient themselves within a page. Skipping from an h1 to an h4 without intermediate levels, for example, suggests missing sections and can lead users to believe content is missing or miscategorized.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, uses a screen reader to explore an online course. The first heading he encounters is an `h3`, followed by an `h5`. He’s unsure what the structure is. He feels confused. Using headings in logical order (like `h1` > `h2` > `h3`) would help him understand the content flow.",
      "Fatima, a screen reader user, reads a travel blog. After the main title (`h1`), the next heading jumps to `h4`. Her screen reader skips context, making it hard to follow. She feels disoriented. Keeping headings in proper sequence would improve readability.",
      "Leo, a blind QA tester, reviews a tutorial site. The guide starts with an `h2`, then `h1`, then `h3`. His screen reader jumps erratically. He feels frustrated. Fixing heading hierarchy would create a logical outline.",
      "Sofia, a blind teen, explores a recipe page. The section on ingredients uses `h4` without a preceding `h2`. She misses important structure. She feels lost. Proper heading nesting would clarify content.",
      "Carlos, a blind shopper, navigates a product comparison page. The first heading is an `h3`, suggesting sub-content with no parent. He can’t tell what section he’s in. He feels confused. Using correct heading levels would guide him.",
      "Jenna, a blind parent, reviews a school policy site. It jumps from `h1` to `h5`, skipping intermediate levels. Her screen reader reads it as a disjointed list. She feels overwhelmed. Maintaining consistent heading order would help.",
      "George, a blind retiree, checks his health dashboard. Each section uses `h2` headings, but one jumps to `h4` without context. He can’t tell it’s part of a larger section. He feels unsure. Fixing the hierarchy would improve comprehension.",
      "Yuki, a blind user, accesses an FAQ with `h3` for questions but no `h2` for categories. The structure feels flat and confusing. He feels disoriented. Introducing category headings would add clarity.",
      "Tariq, a blind user, uses an academic journal site. The abstract starts with an `h5` heading, suggesting deep nesting where there is none. He feels misled. Using `h2` for top-level sections would restore structure.",
      "Aisha, a screen reader user, browses a government site. The navigation uses `h3`s directly under an `h1`, skipping `h2`. She struggles to scan major sections. She feels frustrated. Correct heading levels would make scanning easier.",
      "Mei, a blind commuter, views a transportation schedule. The headings use `h4`, `h6`, and then `h2` in no order. Her screen reader presents a jumbled view. She feels confused. Sequential heading use would improve logic.",
      "Isaac, a blind accountant, reviews a financial report. Subheadings start at `h5` despite no prior headings. He can’t map the data structure. He feels lost. Logical heading order would clarify report sections.",
      "Lena, a blind parent, uses a learning platform. Lesson titles are `h2`s but sub-lessons are `h5`s with no `h3` or `h4`. She feels unsure of relationships between topics. Using nested heading levels would clarify the course flow.",
      "Samira, a blind user, explores a community forum. Posts are `h3`s without any `h2` topics. She hears each as a top-level item, missing the grouping. She feels overwhelmed. A proper hierarchy would aid navigation.",
      "Haruto, a blind teacher, checks an exam portal. The instructions section uses `h6` as its only heading. His screen reader interprets it as deeply nested. He feels misled. Using `h2` or `h3` would better reflect the layout.",
      "Zainab, a blind researcher, accesses a database. The headings skip from `h1` to `h4` and back. She can't build a mental map of the sections. She feels disoriented. Consistent heading levels would improve orientation.",
      "Ben, a blind senior, reviews a pension site. The headings jump between levels without logic. He struggles to follow the site’s flow. He feels anxious. Logical heading use would make the site easier to understand.",
      "Grace, a blind investor, reads a financial blog. The sections use random heading levels (`h1`, `h3`, `h6`) for styling. Her screen reader doesn’t reflect visual layout. She feels misled. Styling should be separate from semantic structure.",
      "Omar, testing an e-commerce site, finds that product categories use `h5`s with no preceding headers. He can’t group them correctly. He feels confused. Proper heading levels would improve the hierarchy.",
      "Fatima, an accessibility auditor, reviews a learning site. Lessons and subtopics are inconsistently marked (`h1`, `h4`, `h2`). She flags it as a structure issue. She feels it impacts comprehension. Consistent heading use would support all users."
    ],
    "responsibility": ["developer", "content"]
  },
  "image-redundant-alt": {
    "title": "Redundant Alternative Text in Images",
    "summary": "Redundant alt attributes reduce clarity and efficiency for users relying on assistive technology.",
    "description": "Users who rely on screen readers expect alternative text to complement, not duplicate, surrounding content. Repeating visible text in the image’s alt attribute causes unnecessary clutter and reduces the efficiency of navigation and comprehension.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, visits a university homepage. He hears 'University Logo – University Logo' because the logo image’s alt text duplicates the nearby caption. He feels annoyed. Removing the redundant alt text would streamline the experience.",
      "Fatima, a screen reader user, browses a cooking blog. Each recipe header has an image with alt text identical to the visible title right next to it. She hears the title twice. She feels irritated. Leaving the alt empty or more descriptive would help.",
      "Leo, a blind developer, checks a website that shows charts with titles above each image. The image alt reads the same title again. He hears it twice. He feels it wastes time. Eliminating redundancy would make reading efficient.",
      "Sofia, a blind teen, reads a fan site where every character image says 'Character Name'—right next to the name in text. Her screen reader repeats it. She feels bored. Omitting the alt or making it unique would improve the experience.",
      "Carlos, a blind user, explores a shopping site. Product images have alt text like 'Red Shoes' next to bold text that also says 'Red Shoes'. He hears it twice. He feels it’s unnecessary. Custom alt text describing the image visually would help.",
      "Jenna, a blind parent, checks a school newsletter. A heading reads 'Principal’s Message' and the image beside it has the same alt text. She hears 'Principal’s Message' twice. She feels distracted. More specific or omitted alt text would solve it.",
      "George, a screen reader user, browses a news article with an image of a politician labeled with the same caption and alt text. He hears it back-to-back. He feels it's redundant. Removing or varying the alt would reduce clutter.",
      "Yuki, a blind student, checks an academic portal. Icons with labels like 'Submit' also have alt='Submit'. Her screen reader says 'Submit, Submit'. She feels confused. Omitting the alt or using `aria-hidden='true'` would help.",
      "Tariq, a blind retiree, looks at a travel booking site. Each location image reads 'Paris' followed by a text label 'Paris'. It feels repetitive. He feels it wastes time. A more visual alt like 'Eiffel Tower at sunset' would be better.",
      "Aisha, a blind editor, browses a magazine. Author photos have alt='Jane Doe' right beside text saying 'Jane Doe'. She hears the name twice. She feels annoyed. Omitting alt or providing visual context like 'Jane Doe smiling' would improve clarity.",
      "Mei, a screen reader user, shops for books online. Cover images have alt='Book Title' next to the same title in large text. She hears it repeated. She feels it's inefficient. Describing the cover art instead would offer more value.",
      "Isaac, a blind accountant, uses a dashboard. Icons for 'Save', 'Download', and 'Print' all repeat their label as alt text. He hears double. He feels it slows him down. Removing the alt text would clean up navigation.",
      "Lena, a screen reader user, accesses a nonprofit site. Their mission statement starts with an image with alt='Our Mission', followed by a heading 'Our Mission'. She hears both. She feels distracted. Reducing redundancy would improve focus.",
      "Samira, a blind entrepreneur, checks an investor site. Each section starts with a branded icon with alt='Invest Now', just like the heading. She hears the same phrase twice. She feels it interrupts flow. A visual alt or empty alt would help.",
      "Haruto, a blind musician, explores a playlist site. Album cover images say the album name in alt text, repeated beside it. He hears every album title twice. He feels overwhelmed. Omitting redundant alt would improve usability.",
      "Zainab, a blind historian, reads a blog on ancient coins. Each coin image has an alt tag repeating the coin's name shown in bold below. She hears it twice. She feels annoyed. Using alt to describe the coin's appearance would help.",
      "Ben, a blind senior, visits a news site. Weather icon images have alt='Rainy' right beside the word 'Rainy'. He hears it twice. He feels it’s unnecessary. A silent or richer visual alt would improve the experience.",
      "Grace, a screen reader user, browses a recipe site. Icons beside steps have alt text like 'Step 1', but each step is already labeled. She hears the label twice. She feels distracted. Suppressing alt text would help her follow steps more easily.",
      "Omar, a screen reader tester, evaluates a portfolio site. Project thumbnails use alt='Project Title', right beside visible titles. He hears each one twice. He feels it’s repetitive. Custom alt text that describes visuals would enhance clarity.",
      "Fatima, auditing an educational site, finds logo images and heading images with the same text content in both places. Screen readers echo them. She feels this harms usability. Removing redundant alts would streamline access."
    ],
    "responsibility": ["developer", "content"]
  },
  "label-title-only": {
    "title": "Missing Visible Labels for Form Elements",
    "summary": "Fields using only hidden labels or tooltips confuse users who rely on visual cues or assistive technology.",
    "description": "Fields without visible labels cause confusion and errors for users of all abilities. Hidden labeling techniques like aria-label or title do not benefit sighted users or those using zoom or voice input. Providing a persistent text label ensures clarity and supports collaboration and comprehension across contexts.",
    "severity": "serious",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, is applying for a scholarship on his school’s portal. A form field for 'Student ID' uses only a `title` attribute for labeling. His screen reader announces it, but there’s no visible label. He’s unsure what to enter. He feels frustrated. Adding a clear visible label would help all users understand the form.",
      "Fatima, a dyslexic jobseeker, uses a career site with form fields labeled only with `aria-describedby`. She can’t quickly scan or match labels to inputs. She feels overwhelmed. Including visible labels would give her clear visual guidance.",
      "Leo, a blind developer, tests a login form where the password field has no visible label—just a `title`. His screen reader reads it, but sighted users may miss it entirely. He feels the design is incomplete. Adding a label element would improve clarity.",
      "Sofia, a teen with ADHD, signs up for a newsletter. The email field has no visible label, just a `title` tooltip. She skips over it. She feels unsure what’s expected. A proper label would anchor her attention.",
      "Carlos, a screen reader user, fills out a contact form where name and email fields lack visible labels. They use `aria-describedby`, but he misses the context. He feels frustrated. Adding visible text above each field would improve comprehension.",
      "Jenna, a blind parent, registers her child for school online. The form fields for medical info use `title` attributes instead of labels. Her screen reader reads them, but she’s not confident. She feels hesitant. Visible, persistent labels would reassure her.",
      "George, a retiree with low tech literacy, encounters a donation form. The fields have no labels, only placeholders. When he types, the placeholder disappears. He forgets what info to enter. He feels embarrassed. Static labels would support memory and confidence.",
      "Yuki, a visually impaired student, zooms in on a sign-up form. The zoomed view cuts off tooltips used for labeling. She can’t see what fields are for. She feels lost. Consistent visible labels would fix this issue.",
      "Tariq, a blind user, accesses a feedback form. One input uses `aria-describedby` pointing to help text far below the field. He misses it. He feels disoriented. A label directly next to the field would offer clarity.",
      "Aisha, a screen reader user, shops online. The payment form has fields labeled only with `title`. Her reader announces them, but when validation fails, she doesn’t know which field is wrong. She feels anxious. Proper visible labels would make errors easier to resolve.",
      "Mei, a commuter with tremors, uses voice dictation to fill forms. Labels are used only as tooltips. She can’t reference them easily. She feels limited. Static labels would make voice input more effective.",
      "Isaac, a blind accountant, fills a tax form online. Several inputs have no labels—just ARIA attributes. He has to guess context from nearby text. He feels it’s inefficient. Visible labels would reduce ambiguity.",
      "Lena, a blind user, accesses a job application form. Field labels are hidden with `aria-label`. She can fill them out, but others helping her can’t see what the fields mean. She feels isolated. Visible labels would support collaboration.",
      "Samira, a blind entrepreneur, fills out a grant form. Input fields use only tooltips that appear on hover. She doesn’t know what they’re for. She feels confused. Label elements tied to each input would solve the problem.",
      "Haruto, a teacher with low vision, accesses a feedback form. Labels are hidden and only used with screen readers. He uses magnification but sees empty fields. He feels lost. Providing visible labels would help him use the form independently.",
      "Zainab, a blind researcher, registers for a journal. The password confirmation field is labeled with `aria-describedby`. She isn’t sure which field it refers to. She feels unsure. A visible label above the field would clarify intent.",
      "Ben, a blind retiree, uses a medical form online. One field has a `title='Insurance Number'`, but no visible label. He relies on screen reader cues, but wants to confirm with family. He feels frustrated. Visible labels would allow shared understanding.",
      "Grace, a screen reader user, tries to leave a review on a site. The rating field has no visible label—just ARIA markup. She isn’t sure what it’s asking for. She feels hesitant. Adding visible, descriptive text would help.",
      "Omar, auditing a website, finds multiple fields labeled with `title` attributes but no `label` elements. He notes that it breaks usability for both assistive tech and visual users. He flags it as a major concern. Visible labels would ensure universal access.",
      "Fatima, a usability expert, tests a mobile app. The fields disappear when tapped, because the only labels were placeholders. Users forget what to enter. She feels it fails accessibility basics. Persistent visible labels would correct this flaw."
    ],
    "responsibility": ["developer", "content"]
  },
  "landmark-banner-is-top-level": {
    "title": "Banner Landmark Not at Top-Level",
    "summary": "Screen readers may skip banner content when it's not placed at the top level of the page structure.",
    "description": "Banner landmarks provide crucial orientation at the start of a page, especially for screen reader users. When nested inside secondary containers, the banner becomes inaccessible or misclassified. As a result, users may miss tools like search, login, or branding, reducing clarity and usability. Placing the banner directly under the body element restores proper recognition.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, accesses a university site where the banner search bar is nested inside a sidebar. His reader doesn’t detect it as header content. He feels disoriented. If the banner landmark were placed at the page top level, he could access the search functionality reliably.",
      "Fatima, a blind jobseeker, uses a nonprofit site. The banner landmark with login links is buried inside a navigation panel. Her screen reader skips it. She feels lost. Moving the banner to top-level would allow consistent access to login tools.",
      "Leo, a blind customer, visits an e-commerce site. The logo and main nav are inside a form landmark. His screen reader misses the header region. He can’t locate account links. He feels frustrated. Placing the banner at the top would restore clear navigation.",
      "Sofia, a blind teen, explores a blog. The banner with the site title is buried under div layers. Her screen reader doesn’t reach it. She feels confused. Lifting the banner to document-level would provide context immediately.",
      "Carlos, a blind manager, uses a government site. The banner with accessibility toggle is nested under an aside. He can’t find it. He feels stranded. Top-level placement would give him dependable access to adjust settings.",
      "Jenna, a blind parent, accesses a digital library. The banner search field is in a nested region. Her reader skips it. She feels frustrated. Flattening the banner to top-level improves search discoverability.",
      "George, a low-vision user, visits a travel portal. The banner content appears after hidden skip-links. His controls are skipped. He feels overwhelmed. A top-level banner would create a clear entry point.",
      "Yuki, a blind student, uses a forum. The banner nav is inside a form. His screen reader ignores it. He feels blocked. Moving it to the top level would restore main navigation focus.",
      "Tariq, a blind job applicant, visits a recruitment portal. The banner with site-wide toggle is nested inside sections. His screen reader misses it. He feels unsupported. Positioning the banner as a top-level landmark would fix this.",
      "Aisha, a blind designer, tests a client site. The banner is inside an article. Her screen reader treats it as part of content. She feels confused. Placing it at top of `<body>` would ensure correct landmark use.",
      "Mei, a blind researcher, reviews a science site. The banner is buried under tab panels. She can’t navigate to site navigation. She feels frustrated. Top-level placement ensures consistent access.",
      "Isaac, a blind accountant, balances his books on a finance dashboard. The banner login area is nested. He misses it. He feels overwhelmed. A top-level banner would restore clarity.",
      "Lena, a low-vision student, reads a school site. Header navigation is nested too deeply. Her reader skips it. She feels confused. Pulling it to the top would provide better context.",
      "Samira, a blind entrepreneur, tours a portfolio site. The banner is hidden in a modal container. She can’t activate it. She feels lost. Moving it to top-level solves navigation issues.",
      "Haruto, a blind musician, checks a music blog. The banner header is within a card. His screen reader misses primary nav. He feels disconnected. Removing container nesting would resolve the issue.",
      "Zainab, a blind policy analyst, uses a government site. The banner search bar is buried inside secondary nav. She misses search. She feels lost. Top-level placement would help navigate.",
      "Ben, a blind retiree, visits a weather app. The banner logo and date are nested in a section. His screen reader doesn’t pick them up. He feels confused. Promoting to top-level would support orientation.",
      "Grace, a low-vision user, visits a nonprofit’s volunteering site. The banner donation link is inside a carousel. She can't find it. She feels frustrated. Extracting it to top-level would improve accessibility.",
      "Omar, a UX tester, reviews a client portal. The banner avatar is embedded deep inside settings. It’s skipped. He flags it. Top-level placement ensures consistent discoverability.",
      "Fatima, a low-vision tutor, uses an education dashboard. The banner nav is nested. She can’t access user tools. She feels lost. Top-level banner placement would reassure context."
    ],
    "responsibility": ["developer"]
  },
  "landmark-complementary-is-top-level": {
    "title": "Complementary Landmark Not at Top-Level",
    "summary": "Asides containing related or supplementary content are skipped by screen readers when not placed at the top level.",
    "description": "When aside regions are buried under footnotes, forms, or navigation panels, their purpose and content become inaccessible. These regions often include important contextual aids such as glossaries, weather widgets, or secondary navigation. Placing them at the top level of the page structure ensures they are announced and easily reachable.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, visits a news site where related story asides are buried in article content. His reader doesn’t detect them. He misses side information. If the complementary landmark were placed at top level, he could access it more easily.",
      "Fatima, a screen reader user, studies on an education site. The 'related links' aside is nested under footnotes. She doesn’t encounter it. She feels uninformed. A top-level complementary landmark would let her find extra resources.",
      "Leo, a screen reader user and developer, visits a nonprofit page. The help panel is marked `role=complimentary`, but nested inside a `section`. He misses it. He feels frustrated. Promoting it to top-level would ensure assistive tech recognizes it.",
      "Sofia, a low-vision student, explores a travel blog. The weather widget is an aside nested in the header. It’s skipped. She misses updates. Moving it out ensures she notices live weather insights.",
      "Carlos, a blind customer, browses a shop. The 'recommended items' aside is buried in the product description. He doesn’t see it. He feels disappointed. Top-level placement would restore its visibility for screen reader users.",
      "Jenna, a blind editor, navigates a recipe site. The nutrition facts aside is buried inside content. She misses critical info. She feels uninformed. Elevating it to top-level would fix this.",
      "George, a blind retiree, visits a local classifieds site. The sidebar with map and ads is nested. He can’t reach the map. He feels blocked. A top-level complementary landmark would help him navigate ads.",
      "Yuki, a blind student, uses a technical documentation site. The 'Tip' aside is nested in paragraphs. He hears no extra info. He feels lost. A top-level `role=complimentary` would highlight helpful context.",
      "Tariq, a screen reader user, visits an academic site. The glossary aside is under a section. He can’t locate definitions. He feels limited. Moving it to top level would improve discoverability.",
      "Aisha, a blind designer, views a portfolio. The \"about me\" aside is buried under interactive elements. She misses context. Moving aside to top-level ensures discoverability.",
      "Mei, a low-vision traveler, reads a tourism page. The weather sidebar is inside a map region. She doesn’t encounter it. She feels unprepared. Top-level placement would help orientation.",
      "Isaac, a blind consultant, browses a consulting site. The quote summary aside is nested under footer. It’s skipped. He misses insights. A top-level complementary region keeps content in the reading flow.",
      "Lena, a screen reader user, visits an education portal. The sidebar tools are nested inside modules. She can't find them. She feels limited. Moving to top-level improves discoverability.",
      "Samira, a screen reader user, reads a nonprofit site. A donation aside is buried in content panels. She misses the call to action. She feels ignored. Top-level placement would ensure accessibility.",
      "Haruto, a screen reader tester, reviews a project blog. The blog-aside is nested. He flags it. He feels disoriented. Keeping it at top-level would ensure gadget recognition.",
      "Zainab, a blind researcher, reads scientific articles. The 'related articles' aside is nested inside sections. She misses references. She feels frustrated. A top-level complementary landmark would help him find cross links.",
      "Ben, a blind retiree, uses a gardening page. The seed tips aside is inside a header. He hears no side details. He feels blocked. Elevating aside would improve user experience.",
      "Grace, a low-vision parent, visits a parenting blog. The sidebar with age guides is nested in posts. She can’t reach them. She feels frustrated. A top-level aside would restore navigation.",
      "Omar, testing web standards, reviews a client site. The aside nav is nested too deep. He flags it. Removing nesting would uphold accessibility best practices.",
      "Fatima, a screen reader user, navigates a charity page. The additional info is an aside inside a form. She misses it. She feels ignored. Top-level placement ensures info accessibility."
    ],
    "responsibility": ["developer"]
  },
  "landmark-contentinfo-is-top-level": {
    "title": "Contentinfo Landmark Not at Top-Level",
    "summary": "Important footer content is skipped by assistive technologies because it isn’t placed at the top level of the document.",
    "description": "Proper landmark structure is essential for accessible navigation. When the footer is embedded within unrelated containers, screen readers cannot recognize it as the designated contentinfo region. This leads to confusion for users trying to orient themselves or locate global page features. Placing the footer at the end of the document, outside nested content, ensures it is consistently recognized.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, accesses a blog. The `<footer role='contentinfo'>` is nested in a nav. He doesn’t encounter the site footer properly. He feels lost. Placing contentinfo at top-level bottom would restore orientation.",
      "Fatima, a low-vision user, visits a nonprofit site. The contentinfo with contact links is inside an article. She doesn’t reach support info. She feels frustrated. A top-level footer would ensure availability.",
      "Leo, a blind developer, audits a corporate site. The contentinfo is buried under header before the content begins. His screen reader skips it. He flags it. Placing it after main ensures proper document flow.",
      "Sofia, a blind student, uses a university site. The site footer is inside an aside. She doesn’t find campus links. She feels lost. Proper landmark placement would aid navigation.",
      "Carlos, a blind shopper, visits a store. The contentinfo with shipping details is nested in forms. He can’t find returns info. He feels frustrated. A proper footer improves clarity.",
      "Jenna, a screen reader user, reads an information site. The contentinfo is inside modals. She misses privacy policy links. She feels uninformed. A site-level footer would ensure policies are accessible.",
      "George, a blind retiree, checks city services. The footer content is nested inside sections. It’s skipped. He feels lost. A top-level contentinfo restores access to important links.",
      "Yuki, a blind traveler, accesses a flight site. The footer with terms is under promotional carousels. She doesn’t reach it. She misses policy info. A properly placed footer ensures users locate it.",
      "Tariq, a blind reader, visits a news page. The contentinfo is within `<main>`. He hears it as part of content, not footer. He flags it. Correct markup improves structure.",
      "Aisha, a screen reader user, uses a charity portal. The footer donation links are inside menus. She misses them. She feels unsupported. Proper placement increases visibility.",
      "Mei, a blind student, browses a learning portal. The footer contact form is nested inside help dialogues. She misses it. She feels disengaged. A proper top-level contentinfo ensures discoverability.",
      "Isaac, a blind consultant, visits a policy archive. The footer with contact info is inside a panel. She misses it. He flags usability issue. Site-level footer ensures accessibility.",
      "Lena, a screen reader tester, audits a portfolio. The footer is inside a `header` landmark. She flags it. Structure errors confuse users. Correct placement at end of body fixes it.",
      "Samira, a blind entrepreneur, browses small business site. The contentinfo with license info is inside banners. She misses legal details. She feels insecure. Footer at top-level solves this.",
      "Haruto, a blind QA specialist, tests an app. The contentinfo is in a hidden panel. He flags it. It will be inaccessible. Proper placement restores footer visibility.",
      "Zainab, a blind policy analyst, uses a government site. The footer is under complementary sections, not body. She can’t reach help links. She flags it. Correcting placement ensures compliance.",
      "Ben, a blind retiree, reads a retirement planning site. The contentinfo is inside login dialogs. He never reaches it. He feels blocked. Footer at top-level ensures it's found.",
      "Grace, a low-vision user, visits a parenting blog. The footer contact info is hidden under pop-up. She can’t locate info. She feels ignored. A proper site footer makes support accessible.",
      "Omar, auditing accessibility, finds footer inside modals. He flags failure. He feels it’s incorrect. Top-level page placement fixes structural issues.",
      "Fatima, a screen reader user, visits a government registry. The footer is nested erroneously. She misses disclaimer info. She is concerned. Correct placement ensures clarity."
    ],
    "responsibility": ["developer"]
  },
  "landmark-main-is-top-level": {
    "title": "Main Landmark Not at Top-Level",
    "summary": "Users relying on assistive technologies may not find the core content because the <main> element isn’t placed at the document’s top level.",
    "description": "Assistive technologies use semantic landmarks like <main> to allow users to jump directly to a page’s core content. When <main> is placed within unrelated containers, it breaks this functionality. This causes users especially those who are blind or low vision, to miss essential information or experience disorientation.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, visits a university blog where the main content region is nested inside an aside. He hears no primary content. He feels lost. Moving `<main>` to top level would restore page structure.",
      "Fatima, a blind jobseeker, accesses a nonprofit site. The main article is nested under a banner landmark. Her reader doesn’t encounter it. She feels frustrated. A top-level main landmark would help her find core content.",
      "Leo, a developer with blindness, reads a code tutorial. The `<main>` is buried under complementary panels. His screen reader navigates through menus but not the content. He feels blocked. Flattening the structure would improve readability.",
      "Sofia, a blind student, uses an educational site. The main lecture is nested inside a `section`. It’s skipped. She feels lost. Elevating it as a top-level `<main>` would restore reading flow.",
      "Carlos, a blind shopper, visits an online store. Product descriptions in `<main>` are nested inside navigational landmarks. He doesn’t see product details. He feels excluded. Ensuring `<main>` is top-level would fix this.",
      "Jenna, a low-vision parent, checks a recipe site. The recipe is inside a complex nav structure. She hears the ingredients but not in the main landmark. She feels disoriented. Flattening to top-level would improve structure.",
      "George, a blind retiree, checks health tips. The `<main>` is nested in modals. He can’t access the article. He feels blocked. Positioning the main region at top level solves this.",
      "Yuki, a blind student, browses an assignment page. Main instructional text is nested inside a dialogue. He doesn’t see instructions. He feels confused. Relocating the main landmark to document root improves clarity.",
      "Tariq, a screen reader user, visits a government site. The main FAQ is buried inside nav tabs. He misses answers. He feels frustrated. A top-level main landmark would fix this.",
      "Aisha, a blind designer, tests a portfolio site. The `<main>` is nested under breadcrumbs. She doesn’t reach the content first. She feels lost. Main at the top ensures content discoverability.",
      "Mei, a low-vision traveler, accesses a travel article. The `<main>` is inside header sequences. She misses key details. She feels disoriented. Moving it back to top-level would improve access.",
      "Isaac, a screen reader user, checks a news site. The main story is in a secondary `section`. His reader doesn’t treat it as primary. He feels frustrated. Using a properly placed `<main>` solves hierarchy issues.",
      "Lena, a screen reader tester, audits a site. The `<main>` is buried under multiple asides. She flags it. She feels assistive tech will miss content. Flattening it would fix usability.",
      "Samira, a blind entrepreneur, browses a business portal. Main dashboard is nested inside the banner. She can’t find statistics. She feels stuck. Ensuring `<main>` is at body level would restore usability.",
      "Haruto, a blind QA engineer, tests a site. `<main>` is inside `role=contentinfo`. Content is not labelled as main. He flags it. Correcting placement restores semantics.",
      "Zainab, a blind researcher, reads research pages. `<main>` content is in a tab panel, not at top. She skips data. She feels blocked. Top-level landmarks restore content discoverability.",
      "Ben, a blind retiree, reviews retirement site. `<main>` is inside a `form`. He can’t find the content. He feels disoriented. Proper landmark placement would help.",
      "Grace, a low-vision parent, visits a parenting blog. `<main>` is nested inside a `<nav>`. She misses article body. She feels lost. Flattening hierarchy improves structure.",
      "Omar, auditing accessibility, finds `<main>` placed inside an aside. He flags it as violation. He feels it will confuse screen readers. Correcting placement improves compliance.",
      "Fatima, a screen reader user, checks an e-commerce product page. Main product details are buried in pop-up nav. She misses specs. She feels disappointed. Proper top-level `<main>` use fixes content flow."
    ],
    "responsibility": ["developer"]
  },
  "landmark-no-duplicate-banner": {
    "title": "Multiple Banner Landmarks Found",
    "summary": "Duplicate banner roles make it unclear which region is the main site header, reducing usability for assistive tech users.",
    "description": "Screen readers use landmarks like banner to let users quickly navigate to major parts of the page. When several elements are marked as banner, users can't tell which is the primary site header. This confusion makes browsing slower and less efficient, especially on complex pages.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, browses a university site. His screen reader announces two 'banner' regions on the homepage. He feels unsure which is the main site header. If there were only one banner landmark, he could navigate with more confidence.",
      "Fatima, a screen reader user, visits a news site. Her screen reader reports multiple banner landmarks, each containing different menus. She feels confused about where to start. Limiting the page to one banner would simplify navigation.",
      "Leo, a blind developer, audits a product landing page. There are three banner landmarks due to duplicated headers in iframes. He feels disoriented. If only one banner landmark were defined, screen reader focus would stay consistent.",
      "Sofia, a visually impaired teen, checks a fan blog. The screen reader finds two banners: one for the blog and one for an embedded playlist. She feels distracted. Keeping a single banner landmark would streamline her experience.",
      "Carlos, a screen reader user, explores an e-commerce site. Each section repeats the site's header marked with a banner role. He hears 'banner' multiple times. He feels annoyed. Using only one banner per page would fix this.",
      "Jenna, a blind parent, checks her school portal. She hears two banner landmarks—one for the logo and another for the site nav. She feels confused. Combining the elements into a single landmark improves orientation.",
      "George, a retiree with low vision, browses a city council site. Multiple banners are used for different navigation bars. His screen reader reads them all as main headers. He feels overwhelmed. One banner landmark would provide clarity.",
      "Yuki, a blind student, navigates a campus intranet. Each department panel uses a separate banner region. Her screen reader offers no clear distinction. She feels lost. Standardizing with one banner landmark improves consistency.",
      "Tariq, a blind jobseeker, uses a job portal. Every search result opens in a section with its own banner. He hears 'banner' every few minutes. He feels annoyed. Restricting the banner role to the top header prevents distraction.",
      "Aisha, a screen reader tester, reviews a content site. Multiple components incorrectly use `role='banner'`. She logs a bug. Fixing this to a single top-level banner resolves the issue.",
      "Mei, a blind commuter, checks a transit page. A weather widget and main header both use banner landmarks. Her screen reader mixes them up. She feels confused. Assigning the role to only the main header restores clarity.",
      "Isaac, a screen reader user, audits a nonprofit site. The site uses a duplicate banner for a popup menu. He hears two conflicting headers. He feels distracted. Refactoring to one banner landmark resolves the problem.",
      "Lena, a screen reader tester, finds a style guide site using banner roles in modals. She notes inconsistent navigation landmarks. Removing excess banner roles improves usability.",
      "Samira, a blind entrepreneur, uses a business site builder. Templates accidentally assign banner roles to multiple sections. She feels her site is hard to navigate. Ensuring only one banner per layout would help her users.",
      "Haruto, a blind musician, visits a band's site. The hero section and the nav bar both use banner landmarks. His reader flips between them. He feels confused. Consolidating these into one role improves structure.",
      "Zainab, a blind journalist, reads an article site where each post header is marked as a banner. She hears 'banner' repeatedly. She feels overwhelmed. Proper landmark hierarchy would improve her experience.",
      "Ben, a screen reader user, browses a travel blog. Ad units incorrectly use banner landmarks. His navigation becomes cluttered. He feels annoyed. Removing non-essential banners would fix the issue.",
      "Grace, a caregiver with vision loss, visits a healthcare dashboard. Each widget introduces its own banner landmark. She can’t find the main header easily. She feels lost. Using only one banner provides structure.",
      "Omar, a tester, audits a site and finds multiple banners within included components. He reports it. Consolidating them under one top-level landmark resolves confusion.",
      "Fatima, a usability expert, reviews a government site with repeated banners in embedded services. She flags it. Reducing banners to a single instance makes the site screen reader friendly."
    ],
    "responsibility": ["developer"]
  },
  "landmark-no-duplicate-contentinfo": {
    "title": "Multiple Contentinfo Landmarks Found",
    "summary": "Multiple footer regions cause duplication of links and information, leading to frustration for assistive technology users.",
    "description": "When multiple footers are marked with role=\"contentinfo\", screen reader users may hear duplicated contact info, policies, or navigation links. This can be disorienting, especially if the footers appear out of expected sequence. A single footer landmark improves consistency and comprehension.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, visits a news site with two footers announcing closing remarks twice. His screen reader repeats them, making it unclear what’s important. He feels disoriented. Having only one contentinfo landmark would provide clarity.",
      "Fatima, a blind shopper, visits an e‑commerce site that repeats contact details in both top and bottom footers. She isn’t sure which is correct. She feels confused. Removing the duplicate ensures reliability.",
      "Leo, a blind developer, audits a corporate site with two contentinfo regions. His screen reader finds them sequentially and blends policy info. He feels frustrated. Ensuring only one footer restores usability.",
      "Sofia, a blind student, visits her school portal. The site has duplicated disclaimers at start and end. Her screen reader announces it twice. She feels annoyed. Keeping one footer improves experience.",
      "Carlos, a blind traveler, accesses an airline site. Two footers contain similar legal info. He’s unsure which to reference. He feels uncertain. Removing one clarifies navigation.",
      "Jenna, a blind parent, uses a hospital portal. It has two identical contentinfo areas. She becomes uncertain which gives accurate contact info. She feels anxious. A single footer solves this.",
      "George, a blind retiree, browses a utility site. Policies are repeated in two footers. He feels confused about which applies. He feels overwhelmed. A single contentinfo region helps.",
      "Yuki, a screen reader user, visits a recipe site. Two footers repeat copyright info. She hears it twice and gets distracted. She feels annoyed. One footer removes redundancy.",
      "Tariq, a blind jobseeker, explores a resume site. It includes identical policy links in duplicated footers. He doesn’t know which to use. He feels frustrated. One footer restores clarity.",
      "Aisha, a screen reader user, accesses a banking portal. Two footers cause her reader to bounce between them. She feels disoriented. Removing duplicates helps navigation.",
      "Mei, a blind commuter, uses a transportation site. Two footers with schedule info conflict. She’s unsure which is official. She feels uneasy. A single contentinfo fixes this.",
      "Isaac, a blind accountant, visits a finance site. Duplicate regulatory disclaimers in two footers confuse him. He feels overwhelmed. Consolidating to one contentinfo helps.",
      "Lena, a blind parent, browses a school site. It has two identical footer sections. She’s uncertain about navigation links. She feels irritated. Keeping one clear footer improves flow.",
      "Samira, a screen reader user, uses a nonprofit site. Duplicate donor info in footers causes confusion. She feels uneasy. Removing the extra footer helps clarity.",
      "Haruto, a blind researcher, visits an archive. Two footers give duplicate data. He can’t tell which is updated. He feels frustrated. One contentinfo ensures accuracy.",
      "Zainab, a blind journalist, reads a news archive. Multiple footers repeat policy links. She gets lost. She feels disoriented. A single contentinfo landmark fixes this.",
      "Ben, a low-vision retiree, accesses a government portal. Two footers push screen reader past content prematurely. He misses final contacts. He feels lost. One contentinfo resolves issue.",
      "Grace, a screen reader user, browses a traveling blog. Two footers with similar info cause useless repetition. She feels annoyed. Removing duplicates improves experience.",
      "Omar, testing accessibility, finds duplicate contentinfo landmarks and flags it. He notes screen reader confusion. He feels concerned. Fixing it ensures compliance.",
      "Fatima, a blind tutor, checks a study site. Two sentence-duplicated footers overwhelm her screen reader. She feels distracted. A single contentinfo region solves the issue."
    ],
    "responsibility": ["developer"]
  },
  "landmark-no-duplicate-main": {
    "title": "Multiple Main Landmarks Found",
    "summary": "Multiple main landmarks break expected page structure, leading to disorientation for assistive technology users.",
    "description": "The main landmark is meant to designate the principal content of the page. Including more than one creates semantic confusion, especially for users who depend on landmarks to quickly locate content. Removing duplicates ensures a clear, accessible structure.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, visits a news site with two footers announcing closing remarks twice. His screen reader repeats them, making it unclear what’s important. He feels disoriented. Having only one contentinfo landmark would provide clarity.",
      "Fatima, a blind shopper, visits an e‑commerce site that repeats contact details in both top and bottom footers. She isn’t sure which is correct. She feels confused. Removing the duplicate ensures reliability.",
      "Leo, a blind developer, audits a corporate site with two contentinfo regions. His screen reader finds them sequentially and blends policy info. He feels frustrated. Ensuring only one footer restores usability.",
      "Sofia, a blind student, visits her school portal. The site has duplicated disclaimers at start and end. Her screen reader announces it twice. She feels annoyed. Keeping one footer improves experience.",
      "Carlos, a blind traveler, accesses an airline site. Two footers contain similar legal info. He’s unsure which to reference. He feels uncertain. Removing one clarifies navigation.",
      "Jenna, a blind parent, uses a hospital portal. It has two identical contentinfo areas. She becomes uncertain which gives accurate contact info. She feels anxious. A single footer solves this.",
      "George, a blind retiree, browses a utility site. Policies are repeated in two footers. He feels confused about which applies. He feels overwhelmed. A single contentinfo region helps.",
      "Yuki, a screen reader user, visits a recipe site. Two footers repeat copyright info. She hears it twice and gets distracted. She feels annoyed. One footer removes redundancy.",
      "Tariq, a blind jobseeker, explores a resume site. It includes identical policy links in duplicated footers. He doesn’t know which to use. He feels frustrated. One footer restores clarity.",
      "Aisha, a screen reader user, accesses a banking portal. Two footers cause her reader to bounce between them. She feels disoriented. Removing duplicates helps navigation.",
      "Mei, a blind commuter, uses a transportation site. Two footers with schedule info conflict. She’s unsure which is official. She feels uneasy. A single contentinfo fixes this.",
      "Isaac, a blind accountant, visits a finance site. Duplicate regulatory disclaimers in two footers confuse him. He feels overwhelmed. Consolidating to one contentinfo helps.",
      "Lena, a blind parent, browses a school site. It has two identical footer sections. She’s uncertain about navigation links. She feels irritated. Keeping one clear footer improves flow.",
      "Samira, a screen reader user, uses a nonprofit site. Duplicate donor info in footers causes confusion. She feels uneasy. Removing the extra footer helps clarity.",
      "Haruto, a blind researcher, visits an archive. Two footers give duplicate data. He can’t tell which is updated. He feels frustrated. One contentinfo ensures accuracy.",
      "Zainab, a blind journalist, reads a news archive. Multiple footers repeat policy links. She gets lost. She feels disoriented. A single contentinfo landmark fixes this.",
      "Ben, a low-vision retiree, accesses a government portal. Two footers push screen reader past content prematurely. He misses final contacts. He feels lost. One contentinfo resolves issue.",
      "Grace, a screen reader user, browses a traveling blog. Two footers with similar info cause useless repetition. She feels annoyed. Removing duplicates improves experience.",
      "Omar, testing accessibility, finds duplicate contentinfo landmarks and flags it. He notes screen reader confusion. He feels concerned. Fixing it ensures compliance.",
      "Fatima, a blind tutor, checks a study site. Two sentence-duplicated footers overwhelm her screen reader. She feels distracted. A single contentinfo region solves the issue."
    ],
    "responsibility": ["developer"]
  },
  "landmark-one-main": {
    "title": "Missing Main Landmark",
    "summary": "Without a main landmark, assistive technologies can't reliably identify the central area of content on the page.",
    "description": "Assistive technology users rely on the main landmark to understand where the main content begins. Its absence means users may have to navigate through numerous other sections without a clear indication of where the primary content starts.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, visits a blog with both the main article and related posts marked as `<main>`. His reader doesn’t know which is primary. He feels lost. Having exactly one `<main>` restores clarity.",
      "Fatima, a blind shopper, uses an online store with separate `<main>` tags for product list and cart. She’s unsure which to focus on. She feels disoriented. Only one `<main>` would fix the hierarchy.",
      "Leo, a blind developer, audits a site where each tabbed pane uses its own `<main>`. His screen reader misinterprets structure. He feels confused. Only one main region per page improves navigation.",
      "Sofia, a blind student, visits a learning portal. Both lecture and sidebar are labeled `<main>`. She doesn’t know where the main content is. She feels frustrated. Enforcing a single `<main>` helps.",
      "Carlos, a blind traveler, reads a travel itinerary and booking summary—both marked as `<main>`. He can’t determine focus. He feels uncertain. Keeping a single `<main>` ensures orientation.",
      "Jenna, a blind parent, uses a hospital site. Both the appointment form and health record table are treated as `<main>`. She feels lost. Removing secondary main roles solves structure confusion.",
      "George, a screen reader user, visits a news site. Homepage and ad block both use `<main>`. He can’t identify article content. He feels disoriented. A single main landmark clarifies intent.",
      "Yuki, a screen reader user, reads a blog and comments section – both labeled `<main>`. His reader loses track. He feels frustrated. Only the article should be `<main>`.",
      "Tariq, a blind job seeker, navigates a jobs page. Both search results and filters are `<main>`. He’s unsure which needs his attention. He feels overwhelmed. A single main region corrects this.",
      "Aisha, a blind designer, reviews a portfolio. Both gallery and project info sections are marked `<main>`. She can’t decide what’s primary. She feels confused. One `<main>` restores page structure.",
      "Mei, a screen reader user, visits a restaurant site. Menu and booking form both labeled as `<main>`. She isn’t sure which to use. She feels lost. A single main region ensures consistency.",
      "Isaac, a blind analyst, reviews a financial site. Both data chart and customer info use `<main>`. He gets mixed feedback. He feels uncertain. Single `<main>` fixes navigation flow.",
      "Lena, a screen reader tester, checks a site. Two `<main>` tags trigger accessibility alerts. She flags it. She feels it breaks semantics. Ensuring exactly one `<main>` solves issue.",
      "Samira, a blind writer, reads an article with both article content and related links overly marked as `<main>`. She can’t focus. She feels distracted. One main region improves experience.",
      "Haruto, a blind musician, uses a music site. Both playlist and player are `<main>`. His reader skips player. He feels lost. Only one main landmark ensures focus.",
      "Zainab, a blind researcher, uses an archive. List and item details both use `<main>`. He fails to detect details region. She feels disoriented. Single main region fixes it.",
      "Ben, a screen reader user, visits a government site. Both nav and policy text use `<main>`. He’s lost. He feels confused. Restricting `<main>` to policy area clarifies context.",
      "Grace, a blind investor, visits a fintech site. Both portfolio and news feed are marked `<main>`. She can’t figure focus. She feels lost. Removing extra `<main>` restores logic.",
      "Omar, a UX tester, finds duplicate `<main>` elements and flags it. He notes it breaks screen reader structure. He feels it’s a serious issue. Enforcing a single `<main>` would resolve it.",
      "Fatima, a low-vision user, checks a charity site. Both donation form and impact statement are `<main>`. She can’t focus on submission. She feels challenged. Choosing one main region helps navigation."
    ],
    "responsibility": ["developer"]
  },
  "landmark-unique": {
    "title": "Landmark Roles Are Not Unique",
    "summary": "Users who rely on assistive technology may get confused if multiple navigation, banner, or search landmarks are not clearly labeled.",
    "description": "Assistive technology relies on unique landmark roles and labels to provide a consistent navigation experience. Reusing the same roles without differentiation causes confusion, especially when navigating large or complex pages.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a screen reader user, visits a site with two `<nav role='navigation'>` elements using the same label. His reader confuses them. He feels disoriented. Giving each nav a unique ID and label restores clarity.",
      "Fatima, a blind shopper, uses an e‑commerce site that has multiple `role='search'` fields. She isn’t sure which search box is primary. She feels frustrated. Only one `search` landmark per page improves usability.",
      "Leo, a blind developer, audits an academic portal with duplicated `role='banner'`. His reader can’t identify the true banner. He feels confused. Ensuring a single, clearly labeled landmark solves the problem.",
      "Sofia, a blind student, explores a recipe site. Both header and footer include `role='complementary'`. She can’t distinguish support vs content. She feels overwhelmed. Unique, purpose-labeled landmarks would help.",
      "Carlos, a blind manager, navigates a dashboard with two `role='main'` elements. He gets lost. He feels lost. Guaranteeing only one main region solves confusion.",
      "Jenna, a blind parent, visits a nonprofit site. Both cookie banner and help panel have `role='dialog'` and generic names. She can’t tell them apart. She feels lost. Assigning unique names improves clarity.",
      "George, a screen reader user, browses a travel site where multiple site search areas are indistinguishable. He doesn’t know which one works. He feels frustrated. Ensuring unique role landmarks solves the issue.",
      "Yuki, a blind student, reviews an academic platform with two `role='contentinfo'` regions. She hears duplicate footers. She feels confused. Having a single contentinfo region restores structure.",
      "Tariq, a screen reader user, accesses a university site with three navigation bars labeled just 'navigation'. He doesn’t know which one contains course links. He feels confused. Giving each nav a unique label would improve usability.",
      "Aisha, a blind designer, explores a digital portfolio with two complementary regions—both labeled 'More Info'. Her screen reader reads them identically. She feels disoriented. Naming each complementary landmark differently would fix this.",
      "Mei, a screen reader user, shops online. The site has two `role='search'` fields on one page, both unlabeled. She tries both, unsure which works. She feels frustrated. Distinct landmark roles or labels would help her decide.",
      "Isaac, a blind consultant, reviews a dashboard site with multiple banners and footers. His screen reader repeats them, cluttering navigation. He feels overwhelmed. Ensuring unique roles avoids this confusion.",
      "Lena, a screen reader tester, audits an app where both the banner and a hero image section use `role='banner'`. Her screen reader can’t differentiate them. She flags it. Ensuring unique landmarks would solve it.",
      "Samira, a blind entrepreneur, browses a business site with identical sidebars using `role='complementary'`. She hears duplicate menus. She feels distracted. Naming them specifically (e.g., 'filters', 'resources') would improve clarity.",
      "Haruto, a blind musician, uses a music blog where multiple `<aside>` sections are marked `role='complementary'` without distinction. He feels lost switching contexts. Adding unique aria-labels to each would restore usability.",
      "Zainab, a screen reader user, reads a health site where contentinfo appears at both top and bottom. She isn’t sure where policy links are. She feels unsure. Keeping only one uniquely identified contentinfo fixes this.",
      "Ben, a blind retiree, visits a city services site with two main regions—one for alerts, another for news. Both use `role='main'`. He gets stuck in a loop. He feels irritated. Only one `main` role should exist per page.",
      "Grace, a low-vision user, reads a parenting blog with multiple navigation bars marked only as `nav`. She can’t track her place. She feels confused. Adding descriptive labels like 'Main nav' or 'Article nav' improves context.",
      "Omar, a UX tester, audits a platform that reuses the same landmark roles multiple times without unique identification. He notes assistive tech confusion. He flags it. Ensuring each landmark is unique resolves the problem.",
      "Fatima, a blind writer, accesses a publishing site where banner and nav are duplicated on each tab panel. Her screen reader sees them repeatedly. She feels overwhelmed. Removing redundant landmarks enhances the user journey."
    ],
    "responsibility": ["developer"]
  },
  "meta-viewport-large": {
    "title": "Zoom Disabled by Meta Viewport Tag",
    "summary": "Users with visual impairments are unable to scale content to a readable size due to restrictive viewport settings.",
    "description": "Restricting zoom functionality through the meta viewport tag prevents users with visual impairments from scaling text and elements to readable sizes. This exclusionary practice makes it harder for users to read content, follow instructions, or complete tasks, especially on small screens. Allowing greater zoom flexibility supports independent use and improves access.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a senior with low vision, visits a city services site on his tablet. The site restricts zoom with `maximum-scale=1`. He can’t enlarge the text enough to read comfortably. He feels strained. If the viewport allowed larger scaling, he could navigate with ease.",
      "Fatima, a visually impaired student, uses her phone to review lecture notes. The site disables pinch-to-zoom. She struggles to read small fonts and misses details. She feels anxious. Allowing larger zoom through the viewport tag would resolve this.",
      "Leo, who has diabetic retinopathy, tries to read health information. The text is too small, and the site blocks zooming. He can’t follow important instructions. He feels helpless. Removing zoom restrictions in the meta viewport would help.",
      "Sofia, a teen with astigmatism, accesses a blog on her phone. Zooming is disabled. She can’t adjust for clarity. She feels frustrated. A more flexible meta viewport setting would make it readable.",
      "Carlos, a low-vision accountant, checks a banking portal during commute. The small text can’t be scaled due to restrictive viewport settings. He feels stuck. A scalable viewport would let him view his finances independently.",
      "Jenna, a legally blind user, reads medical results online. She uses zoom to enlarge everything. But the site limits scaling. She misses critical information. She feels unsafe. Removing maximum-scale caps would solve this.",
      "George, a retiree with vision issues, reads news on a tablet. He tries to zoom in but the page won’t scale. He gives up. He feels excluded. Allowing generous zoom helps him stay informed.",
      "Yuki, a student with partial blindness, reads course material. The site disables zoom. She struggles with comprehension. She feels left out. Removing zoom constraints would support her learning.",
      "Tariq, a low-vision developer, tests a platform where the viewport restricts zoom. He can’t review his changes on mobile. He feels frustrated. A better meta viewport supports accessibility testing.",
      "Aisha, a mother with visual fatigue, uses a parenting site. The text is tiny and she can’t zoom in. She feels irritated. If the site allowed full pinch-to-zoom, she could read comfortably.",
      "Mei, who has a cataract, uses a government service site. The restricted zoom makes details hard to see. She misses deadlines. She feels stressed. Removing viewport limits improves accessibility.",
      "Isaac, an investor with glaucoma, accesses a financial dashboard. Text is too small and zooming fails. He misses updates. He feels vulnerable. Allowing large scale zoom ensures independence.",
      "Lena, a librarian with vision loss, uses a catalog site. The interface is unreadable due to fixed zoom. She can’t assist patrons. She feels helpless. Enabling flexible viewport zooming fixes this.",
      "Samira, a screen reader and magnifier user, can’t zoom on a recipe blog. She struggles to read steps while cooking. She feels unsafe. A scalable viewport would ensure usability.",
      "Haruto, a musician with keratoconus, uses a music tutorial site. He can’t enlarge content due to meta tag limits. He feels blocked. Relaxing the scaling restrictions would enhance his learning.",
      "Zainab, a journalist with presbyopia, checks articles on mobile. She’s unable to zoom into dense text. She feels frustrated. Allowing a larger maximum-scale in the viewport helps her stay productive.",
      "Ben, a visually impaired retiree, browses a charity site. The meta viewport disables zoom. He can’t donate easily. He feels discouraged. Removing the limitation supports inclusive giving.",
      "Grace, a caregiver with poor eyesight, visits a hospital site. The content doesn’t scale. She misses key emergency instructions. She feels stressed. A better viewport configuration could prevent this.",
      "Omar, an accessibility tester, checks a healthcare portal. The meta viewport restricts zoom and violates accessibility guidelines. He flags it. Allowing more zoom would pass accessibility standards.",
      "Fatima, a screen magnifier user, encounters a city map tool that can’t zoom due to meta settings. She’s unable to find locations. She feels limited. Enabling high-scale zoom would restore access."
    ],
    "responsibility": ["developer"]
  },
  "page-has-heading-one": {
    "title": "Missing <h1> Heading on Page",
    "summary": "Without a level-one heading, users relying on assistive technologies might have problems to understand the page's main topic.",
    "description": "A well-structured page starts with a primary heading. Without an <h1>, users relying on headings for navigation may struggle to determine the focus or purpose of the page. This creates unnecessary barriers, especially for users with vision impairments. A single, well-placed <h1> ensures clarity and usability.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, visits a course portal. The page has no `<h1>` heading, so his screen reader can’t identify the page’s main topic. He feels confused. Including a clear `<h1>` heading would help him understand the page purpose quickly.",
      "Fatima, a screen reader user, accesses a news site. The homepage skips a level-one heading. Her navigation starts mid-content. She feels disoriented. Adding an `<h1>` gives her context right away.",
      "Leo, a visually impaired developer, uses a reader tool to scan a dashboard. Without an `<h1>` tag, the hierarchy is unclear. He feels frustrated. A single top-level heading would organize content better.",
      "Sofia, a blind teen, visits a blog. Each post lacks an `<h1>`, making it hard to differentiate entries. She feels overwhelmed. Providing a main heading for each post would improve orientation.",
      "Carlos, a low-vision user, checks a services page. The largest text is styled but not marked as `<h1>`. His assistive tech skips it. He feels disconnected. Using semantic tags correctly would restore meaning.",
      "Jenna, a blind parent, visits a hospital site. No page has a level-one heading, so screen reader navigation doesn’t work. She feels lost. Adding one helps her find essential info quickly.",
      "George, a retiree with low vision, accesses a library portal. Pages start with paragraphs and images. He can’t tell what the page is about. He feels frustrated. A heading-one gives immediate clarity.",
      "Yuki, a student with vision loss, uses a virtual campus. Without an `<h1>`, her reader can’t orient her to different sections. She feels disoriented. Consistent top-level headings solve this.",
      "Tariq, a blind jobseeker, visits a careers page. No level-one heading describes job listings. He can’t tell if he’s on the right page. He feels unsure. A meaningful `<h1>` improves confidence.",
      "Aisha, a screen reader user, explores a nonprofit site. The site uses `<h2>` and `<h3>` only. She can’t find the primary topic. She feels confused. Adding `<h1>` would fix heading hierarchy.",
      "Mei, who uses a braille display, browses an online store. The landing page lacks an `<h1>`. She can’t determine the product category. She feels disoriented. A top-level heading would guide her.",
      "Isaac, a blind financial advisor, visits an investment site. The absence of `<h1>` headings causes his reader to skip the main page title. He feels frustrated. Adding one restores reading flow.",
      "Lena, a screen reader tester, audits a new platform. All pages lack `<h1>`, breaking navigational structure. She flags it. A clear heading improves screen reader access.",
      "Samira, a blind entrepreneur, explores a business tool. She can’t tell what section she’s on due to missing `<h1>` tags. She feels lost. Including a clear level-one heading clarifies context.",
      "Haruto, a blind musician, checks a tutorial site. There’s no main heading on lessons. He can’t orient himself. He feels stuck. A single top-level heading would solve the issue.",
      "Zainab, a journalist with vision loss, reads articles online. Without `<h1>`, her screen reader can’t summarize page topics. She feels overwhelmed. Proper semantic structure would help.",
      "Ben, a retiree with vision issues, explores a pension site. He navigates using headings, but there’s no `<h1>`. He can’t tell where he is. He feels confused. Adding one clarifies navigation.",
      "Grace, a caregiver with low vision, checks a medical site. Each frame lacks a primary heading. She has trouble switching contexts. She feels frustrated. Including `<h1>` in each frame helps her stay oriented.",
      "Omar, a tester using NVDA, finds that frames on a service portal are missing `<h1>` tags. He logs the issue. Including one per frame improves structure and usability.",
      "Fatima, a blind tutor, uses an education platform. Multiple tools in iframes don’t include heading ones. She loses track. She feels scattered. Ensuring each frame starts with a clear `<h1>` would restore navigation."
    ],
    "responsibility": ["developer", "content"]
  },
  "presentation-role-conflict": {
    "title": "Presentational Elements Should Not Be Focusable or Labeled",
    "summary": "Some elements styled as decorative are still announced by assistive tech due to remaining ARIA attributes or tabindex.",
    "description": "Screen readers rely on ARIA roles to interpret page content. When elements are marked as decorative but retain ARIA labels or keyboard focus, it misleads users. For instance, focusable elements without function can cause users to become stuck or unsure what action is possible. Removing unnecessary attributes maintains a clear and accessible experience.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [
      {
        "name": "Element marked as decorative is not exposed",
        "link": "https://act-rules.github.io/rules/46ca7f"
      }
    ],
    "user_stories": [
      "Omar, a blind student, navigates an academic dashboard. A decorative icon is marked with `role='presentation'` but also has `tabindex=0`. His screen reader announces it as focusable, though it adds no meaning. He feels confused. Removing tabindex ensures it's ignored properly.",
      "Fatima, a screen reader user, explores an art portfolio. Arrows meant to be purely visual are labeled as presentational but still include ARIA labels. Her screen reader reads them aloud. She feels distracted. Removing ARIA attributes from decorative elements would help.",
      "Leo, a blind developer, tests a product page where `role='none'` is used but the element still has `aria-label`. His screen reader exposes the element unnecessarily. He feels frustrated. Cleaning up conflicting attributes avoids confusion.",
      "Sofia, a visually impaired teen, visits a recipe site. Icon-only buttons use `role='presentation'` but are still keyboard-focusable. She gets stuck tabbing through useless elements. She feels annoyed. Ensuring presentational elements aren’t interactive would improve flow.",
      "Carlos, a screen reader user, checks a shopping site where visual spacers have ARIA roles and `tabindex`. He hears meaningless elements read aloud. He feels distracted. Removing focus and ARIA roles from decorative content improves clarity.",
      "Jenna, a blind parent, reads a school newsletter. Icons meant only for styling are announced by her screen reader due to an `aria-label` despite having `role='none'`. She feels disoriented. Cleaning up roles and labels ensures proper silence.",
      "George, a retiree with vision loss, browses a travel blog. Line separators marked as presentational still respond to focus. He doesn’t understand their purpose. He feels confused. Removing global attributes would solve it.",
      "Yuki, a screen reader user, navigates a tech site. A layout box with `role='presentation'` is mistakenly labeled with `aria-describedby`. She hears unhelpful information. She feels frustrated. Ensuring no ARIA attributes are present on decorative elements fixes this.",
      "Tariq, a blind tester, audits a tourism site. Elements used for layout are exposed via ARIA attributes despite `role='none'`. His screen reader announces them redundantly. He feels annoyed. Removing global roles and labels avoids this.",
      "Aisha, a blind editor, browses a magazine page. Styling icons are presentational but include ARIA hints meant for interactive components. She hears unrelated context. She feels confused. Cleaning up conflicting attributes improves accessibility.",
      "Mei, a blind commuter, reads transit schedules. Graphical separators with `role='presentation'` are focusable due to `tabindex`. She gets stuck cycling through them. She feels disoriented. Removing focus attributes corrects this.",
      "Isaac, a blind accountant, uses a finance site. Icons meant to visually indicate currency are presentational but exposed via screen reader. He feels distracted. Properly removing conflicting ARIA attributes prevents unnecessary noise.",
      "Lena, a screen reader tester, finds a client site where purely visual elements have both `role='presentation'` and `aria-label`. She flags the mismatch. Removing the ARIA attribute would align with intent.",
      "Samira, a blind entrepreneur, reviews a site with sliders. Decorative arrow icons marked as presentational still receive focus. She feels confused about their purpose. Ensuring they’re not focusable would restore clarity.",
      "Haruto, a blind musician, visits a tutorial site. Time markers on a track are presentational but include `aria-hidden=false`. His reader announces them. He feels distracted. Consistent markup would prevent this.",
      "Zainab, a blind researcher, reads a science blog. A chart legend box meant for layout only is marked presentational but exposes `aria-labelledby`. She hears a confusing label. She feels misled. Cleaning it up fixes the issue.",
      "Ben, a visually impaired senior, checks a weather site. Visual flourishes with `role='none'` still show up in his screen reader navigation. He feels it clutters the experience. Removing other conflicting attributes solves this.",
      "Grace, a screen magnifier user, uses a charity site. Elements with `role='none'` are still interactive due to scripting. She activates non-functional areas by accident. She feels lost. Fixing ARIA and focus states avoids confusion.",
      "Omar, an accessibility consultant, audits a client site. Many elements styled as decorative use `role='presentation'` but retain ARIA roles. He reports false screen reader exposure. Removing global ARIA fixes the design intent.",
      "Fatima, a usability advocate, tests a dashboard. She finds that empty containers with `role='none'` still announce as regions due to `aria-` tags. She flags this. Aligning ARIA attributes with visual purpose would restore harmony."
    ],
    "responsibility": ["developer"]
  },
  "region": {
    "title": "Content Outside Landmarks",
    "summary": "Some important information lies outside structural landmarks like main, region, or article, which causes screen readers to skip over it.",
    "description": "Proper use of landmarks gives structure to a web page and helps screen reader users move directly to relevant sections. If content is placed outside landmark regions, users may struggle to find key actions, data, or information. This can lead to disorientation and exclusion. Wrapping this content in appropriate regions supports usability and access.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, uses a screen reader to browse his university portal. Some important content is outside of any landmark region, making it hard to find. He feels frustrated. Wrapping the content in a `main` landmark would help him locate it easily.",
      "Fatima, a blind shopper, browses a store page where the product grid isn't inside a landmark. Her screen reader skips it during quick navigation. She feels confused. Placing the grid inside a `main` or `region` landmark would solve this.",
      "Leo, a blind developer, audits a finance site. Key stats are outside landmarks. His screen reader can’t find them with landmark shortcuts. He feels blocked. Assigning proper landmarks ensures quicker access.",
      "Sofia, a blind teen, visits a fan blog. Articles aren’t wrapped in any landmark regions. She has to read linearly. She feels overwhelmed. Using `main` or `article` landmarks would allow better orientation.",
      "Carlos, a blind accountant, reviews an invoice dashboard. Details appear between landmarks. His screen reader misses important figures. He feels disoriented. Encapsulating all content in landmarks would fix this.",
      "Jenna, a blind parent, accesses a school site. Lunch menus and event lists sit outside any landmarks. She can’t locate them via screen reader. She feels annoyed. Placing them within complementary or `main` landmarks would improve discoverability.",
      "George, a retiree with vision loss, browses a community forum. Comments are outside landmark areas. His reader can’t navigate efficiently. He feels lost. Proper use of `main`, `region`, or `article` elements would help.",
      "Yuki, a blind student, accesses a video tutorial site. Chapters are not in landmark regions. She can’t skip to them. She feels limited. Adding `region` or `aside` roles around them would solve this.",
      "Tariq, a screen reader user, explores a charity site. Donation information sits outside the `main` tag. He misses it. He feels embarrassed. Ensuring content is within landmark regions would guide him.",
      "Aisha, a blind designer, browses a portfolio. Project details are outside landmark structures. Her screen reader doesn’t pick them up. She feels confused. Wrapping these in proper landmarks like `main` or `article` would help.",
      "Mei, a blind commuter, visits a transit site. The schedule table appears between landmarks. She can’t access it using landmarks. She feels anxious. Including it in a defined region solves this.",
      "Isaac, a screen reader user, checks a site’s policies. The legal text isn’t in any landmark. His reader doesn’t find it. He feels uncertain. Adding a `region` or `main` tag helps clarify purpose.",
      "Lena, a blind librarian, accesses a digital archive. Descriptions and filters are outside landmarks. She misses crucial tools. She feels frustrated. Proper region roles would help guide her.",
      "Samira, a blind writer, uses a submission portal. The form is between landmark sections. She skips over it. She feels confused. Wrapping the form in a `main` or `form` region fixes this.",
      "Haruto, a blind musician, browses a band site. Events appear outside structural landmarks. He struggles to find dates. He feels disoriented. Using complementary or `main` landmarks would help.",
      "Zainab, a blind researcher, visits a study database. Search results load outside `main` or `region` areas. She can’t reach them easily. She feels blocked. Placing results in a landmark region would solve it.",
      "Ben, a screen reader user, accesses a weather site. Forecasts sit between landmark roles. He can’t skip to them. He feels annoyed. Including them in `region` or `main` tags improves usability.",
      "Grace, a caregiver with low vision, navigates a healthcare site. Tips and alerts float outside landmarks. Her screen reader misses them. She feels uninformed. Defining those as landmark content would help.",
      "Omar, an accessibility tester, finds that key content lies outside any landmark. He flags the issue. He knows assistive tech users will struggle. Wrapping all interactive or key content in landmarks ensures inclusive navigation.",
      "Fatima, a usability reviewer, checks a mobile site. Cards with crucial data aren’t part of a landmark region. She marks it inaccessible. She knows that enclosing content in structural landmarks aids screen reader efficiency."
    ],
    "responsibility": ["developer"]
  },
  "scope-attr-valid": {
    "title": "Incorrect Scope Attributes",
    "summary": "Without valid scope on table headers, users relying on assistive technologies can't properly associate data with corresponding labels.",
    "description": "The scope attribute is critical for defining relationships between header and data cells in tables. When it’s misapplied—like using scope='col' on row headers, or omitting it entirely—screen readers fail to interpret the data structure correctly. This leads to confusion, especially in data-heavy contexts like schedules, comparisons, or forms.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, uses a screen reader to read his class schedule. The table headers have incorrect `scope` values, so the screen reader mismatches subjects and times. He feels confused. Using the correct `scope='col'` and `scope='row'` attributes would clarify the layout.",
      "Fatima, a blind researcher, examines a data table on a health site. Without proper scope attributes, her screen reader doesn’t announce which headers belong to which rows. She feels lost. Applying correct scope helps her analyze the data accurately.",
      "Leo, a screen reader user, reviews a government budget table. The `scope` attribute is missing or misused, so values don’t align with their labels. He feels uncertain. Ensuring correct scope improves his comprehension.",
      "Sofia, a blind teen, checks a gaming leaderboard. The table’s header cells use `scope='row'` when they should be `scope='col'`. Her screen reader mixes up player names and scores. She feels frustrated. Fixing scope values ensures accuracy.",
      "Carlos, a low-vision user, accesses a charity donation table. The column headers are labeled with `scope='row'`, confusing his assistive tech. He misinterprets data. He feels embarrassed. Correcting the scope attribute clarifies relationships.",
      "Jenna, a screen reader user, reads a nutritional info table. Because `scope` isn’t used or is misapplied, she can’t associate values with nutrients. She feels confused. Using `scope='col'` on column headers solves this.",
      "George, a retiree with vision loss, checks a transit timetable. Row headers are incorrectly marked as `scope='col'`. He mishears routes and times. He feels disoriented. Proper `scope='row'` attributes would fix this.",
      "Yuki, a blind student, reviews lab results in a table. The header cells don’t use scope at all, so the screen reader treats them as data. She feels overwhelmed. Adding `scope` attributes improves her orientation.",
      "Tariq, a blind jobseeker, uses an employment site with a job comparison table. Headers are mis-scoped, making it hard to compare benefits. He feels discouraged. Using valid scope attributes would make the table navigable.",
      "Aisha, a blind designer, reads a pricing chart where the first column has `scope='col'` instead of `row`. Her screen reader misreads rows. She feels irritated. Proper scope usage improves semantic understanding.",
      "Mei, a blind traveler, checks airline pricing options in a table. No `scope` attributes are used, so she can’t link fares to dates. She feels unsure. Including correct scope values solves this problem.",
      "Isaac, a visually impaired auditor, examines a tax report. Table headers lack scope, making voice feedback unreliable. He feels slowed down. Adding `scope` to `<th>` elements boosts productivity.",
      "Lena, a screen reader tester, finds a sports stats table using `scope='row'` on all header cells. She flags it. She knows assistive tech reads columns incorrectly. Assigning accurate scope values ensures accessibility.",
      "Samira, a blind entrepreneur, reviews business metrics in a dashboard. The scope attribute is applied to data cells instead of header cells. She gets confused. Removing invalid scope and using it correctly restores meaning.",
      "Haruto, a blind musician, uses a music sheet comparison table. Rows are labeled with `scope='col'`. He mishears tempo info. He feels distracted. Correcting scope attributes solves the confusion.",
      "Zainab, a blind journalist, accesses an editorial calendar. Header cells aren’t scoped, so her screen reader doesn’t read the right topic per date. She feels misinformed. Adding accurate scope to table headers helps her organize content.",
      "Ben, a blind retiree, checks a Medicare plan comparison. Incorrect scope usage leads to misinterpretation of coverage. He feels frustrated. Properly setting `scope='row'` and `scope='col'` would clarify options.",
      "Grace, a caregiver with low vision, accesses a health record system. The absence of scope attributes in tables makes it hard to match patients to results. She feels uncertain. Using valid scope helps her avoid mistakes.",
      "Omar, a tester using NVDA, finds a public report with misused scope values. He logs the issue after hearing confusing labels. He recommends correcting `scope` placement to improve screen reader behavior.",
      "Fatima, a content strategist, reviews a page before publishing. She notices scope applied to `<td>` elements instead of `<th>`. She corrects it, knowing that only `<th>` should have scope for proper semantics."
    ],
    "responsibility": ["developer"]
  },
  "skip-link": {
    "title": "Skip Link Does Not Target a Focusable Element",
    "summary": "When activated, the skip link doesn’t work properly due to missing or improperly configured target elements. Users are forced to tab through the entire page.",
    "description": "Skip links that point to non-interactive or visually hidden containers cause confusion. If the element is not focusable or its ID is missing, screen readers cannot relocate focus. To fix this, ensure the target element is visible, present in the DOM, and accepts focus through tabindex or semantic roles.",
    "severity": "moderate",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, uses a screen reader to browse his university’s site. He activates a 'Skip to main content' link, but nothing happens. The target is missing. He feels stuck. Fixing the link to point to a valid, focusable element would let him skip repetitive navigation.",
      "Fatima, a screen reader user, visits a cooking blog. The skip link leads to a non-focusable container. Her focus doesn’t move. She feels confused. Ensuring the target is focusable would guide her to the recipe directly.",
      "Leo, a blind developer, checks a new site with a 'Skip to content' link. The ID it targets doesn’t exist. His screen reader does nothing. He feels annoyed. Adding a valid ID to the target solves this issue.",
      "Sofia, a visually impaired teen, navigates a music site. The skip link targets a hidden div. It’s not focusable. She still has to tab through the whole menu. She feels frustrated. Making the target visible and focusable would fix it.",
      "Carlos, a screen reader user, uses a government portal. The skip link’s target exists, but it’s an unstyled `<div>` that isn’t focusable. He doesn’t know where he landed. He feels disoriented. Adding `tabindex='-1'` would allow the element to receive focus.",
      "Jenna, a blind parent, checks a school lunch schedule. The skip link points to an anchor that’s not rendered. Her reader stays in the header. She feels stuck. Ensuring the target element is present and focusable would improve navigation.",
      "George, a retiree with vision loss, accesses a healthcare site. He presses a skip link, but the page doesn’t scroll or focus on content. He feels lost. Linking to a focusable heading or section would help.",
      "Yuki, a student with low vision, uses a skip link on a science blog. The link jumps but doesn't update screen reader focus. She gets confused. She feels disoriented. Fixing the target to be keyboard-focusable resolves this.",
      "Tariq, a blind screen reader user, browses a tech store. The skip link leads to an image container. It can’t take focus. He can’t skip the top menu. He feels annoyed. Making the target a landmark or heading would guide him properly.",
      "Aisha, a keyboard-only user, hits a skip link on a portfolio. It points to an element styled with `display: none`. Her focus disappears. She feels blocked. Removing `display: none` and using `visibility: hidden` correctly would preserve focusability.",
      "Mei, who navigates by keyboard, lands on a content site with a skip link targeting `#main`. But the main content has no matching ID. She keeps tabbing through the header. She feels frustrated. Adding the missing ID makes the skip link functional.",
      "Isaac, a blind consultant, audits a dashboard. The skip link points to a widget container not set to receive focus. His screen reader doesn't move. He feels disappointed. Making the container focusable solves this.",
      "Lena, a screen reader tester, finds a skip link targeting an iframe. Her screen reader skips past it. She flags it. Adding a label and ensuring the iframe content is focusable would improve usability.",
      "Samira, a blind entrepreneur, accesses a startup landing page. The skip link goes to a `div` with no semantic value. She hears no change. She feels confused. Using a `main` landmark with a valid ID would resolve this.",
      "Haruto, a blind musician, browses a concert page. The skip link points to a list inside a `<section>` that isn’t keyboard focusable. He misses the lineup. He feels disoriented. Ensuring that section can take focus helps.",
      "Zainab, a blind journalist, checks an editorial page. The skip link leads to an `<article>` tag with no ID. Her focus stays in the nav. She feels frustrated. Assigning a proper ID and `tabindex='-1'` would improve the experience.",
      "Ben, a screen reader user, visits a weather site. The skip link’s target is a flex container without a role or focusable attributes. His reader doesn’t move. He feels lost. Adding a heading or region and making it focusable would help.",
      "Grace, a caregiver with vision issues, hits the skip link on a medical resource site. It appears to work, but focus remains at the top. She doesn’t realize the content changed. She feels confused. Visually moving and programmatically focusing the target solves this.",
      "Omar, an accessibility auditor, tests a legal portal. He finds multiple skip links with broken anchors. Users can’t jump past headers. He flags it. Fixing IDs and ensuring target focusability makes the site compliant.",
      "Fatima, a usability tester, checks a university site. The skip link scrolls to a section but doesn’t shift screen reader focus. She feels this breaks user flow. She recommends ensuring the target has a role and can receive programmatic focus."
    ],
    "responsibility": ["developer"]
  },
  "tabindex": {
    "title": "Tabindex Value Greater Than 0",
    "summary": "Using tabindex values greater than 0 overrides the natural DOM order and causes users to skip or jump unpredictably between elements. This disrupts keyboard navigation.",
    "description": "When interactive elements are assigned high tabindex values, they can steal focus from more relevant content, leading users to miss key information. This can particularly affect users with visual impairments or limited dexterity. Fixing the tab order helps users complete tasks smoothly.",
    "severity": "serious",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, navigates a university dashboard using the keyboard. A widget uses `tabindex=5`, jumping him out of logical order. He feels disoriented. Using `tabindex=0` instead would preserve the expected flow.",
      "Fatima, a keyboard-only user, browses a blog. Some social icons use `tabindex=10`, sending her to the footer before she’s finished reading. She feels frustrated. Removing or reducing `tabindex` keeps navigation intuitive.",
      "Leo, a screen reader user, accesses a form. A submit button uses `tabindex=2`, while earlier fields use `tabindex=0`. He lands on the button too early. He feels confused. Keeping a consistent natural tab order solves this.",
      "Sofia, a teen with a motor disability, tabs through a game site. Custom cards skip the main content due to high `tabindex` values. She feels lost. Avoiding `tabindex>0` maintains accessible navigation.",
      "Carlos, a low-vision accountant, tries to fill a timesheet. The focus jumps unpredictably between fields with mixed `tabindex` values. He feels disoriented. Using `tabindex=0` or natural DOM order would help.",
      "Jenna, a blind parent, uses a government service site. Buttons with `tabindex=3` appear before headings and instructions. She feels confused. Proper order would preserve comprehension.",
      "George, a retiree with limited dexterity, navigates a medication reminder tool. Focus jumps from bottom to top due to `tabindex=9`. He feels frustrated. Removing manual tab ordering restores predictability.",
      "Yuki, a blind student, checks a class forum. Posts use high `tabindex` values to prioritize visibility, but it disrupts navigation. She feels annoyed. Sticking to sequential tab order solves this.",
      "Tariq, a screen reader user, browses a museum site. Exhibits use `tabindex=7` to force custom layouts. Focus jumps irrationally. He feels disoriented. Using CSS for layout and natural DOM focus fixes it.",
      "Aisha, a screen reader tester, reviews a news app. The hero section’s elements jump ahead due to `tabindex=1-6`. She flags it. Using semantic structure and `tabindex=0` avoids user confusion.",
      "Mei, who uses a head pointer, tabs through a shopping cart. Buttons marked with `tabindex=4` skip key totals. She feels irritated. Removing arbitrary tab orders restores usability.",
      "Isaac, a blind advocate, checks a social platform. Interactive tiles use `tabindex=15`. He misses the search bar. He feels disconnected. Reducing or removing high values restores accessibility.",
      "Lena, a tester, finds a help center with FAQs reordered using `tabindex`. Tabbing causes erratic jumps. She flags it. Natural DOM order would solve the navigation issue.",
      "Samira, a blind business owner, reviews a product tool. Widgets use `tabindex=20`. She skips important context. She feels frustrated. Keeping to `tabindex=0` maintains expected flow.",
      "Haruto, a musician with limited mobility, tabs through an events page. Focus lands on less important content first due to high tab values. He feels overwhelmed. Logical structure avoids this.",
      "Zainab, a journalist with vision loss, checks a publication site. An image gallery uses high tabindex to force a layout. Navigation is jarring. She feels annoyed. Keeping tabindex at zero preserves order.",
      "Ben, a keyboard-only user, accesses a donation portal. Focus jumps to a call-to-action before reading info. He feels rushed. Using natural tab sequence solves the issue.",
      "Grace, a screen reader user, visits a medical tool. High `tabindex` on tooltips interferes with form navigation. She skips steps. She feels confused. Logical tab flow would help her focus.",
      "Omar, a tester, audits a grant application portal. He finds `tabindex=9` on unrelated elements, causing erratic focus. He flags it. Removing these values maintains accessibility.",
      "Fatima, a low-vision tutor, checks an educational site. Navigation menus reorder with `tabindex` instead of layout CSS. She skips entire sections. She feels frustrated. Fixing the tab order enhances user flow."
    ],
    "responsibility": ["developer"]
  },
  "table-duplicate-name": {
    "title": "Redundant Table Caption and Summary Content",
    "summary": "Identical caption and summary in a table leads to unnecessary repetition for screen reader users, making the information seem redundant or like an error.",
    "description": "When the summary and caption of a table are identical, assistive technologies present the same information twice. This repetition adds unnecessary cognitive load and may cause users to assume there is an error in the markup. Providing a unique and informative summary improves table accessibility and orientation.",
    "severity": "minor",
    "type": "advisory",
    "wcag": [],
    "act_rules": [],
    "user_stories": [
      "Omar, a blind student, accesses a course page with a table listing assignments. The caption and summary both say 'Assignment Table'. His screen reader reads the phrase twice. He feels annoyed. Differentiating the caption and summary would reduce unnecessary repetition.",
      "Fatima, a screen reader user, checks a nutrition site. The food chart’s caption and summary are identical. She hears it read twice and thinks it’s an error. She feels confused. Using distinct, complementary descriptions would improve clarity.",
      "Leo, a blind researcher, reads a data table. The caption and summary both state 'Climate Data for 2025'. His screen reader announces it twice in a row. He feels distracted. Giving the summary more context avoids redundancy.",
      "Sofia, a visually impaired teen, accesses a gaming leaderboard. The table’s summary and caption both read 'Top Players'. She hears the same thing twice. She feels irritated. Rewriting one to add detail fixes this.",
      "Carlos, a low-vision user, uses a screen reader to review a budget table. The caption and summary are the same. He assumes it's a bug. He feels unsure. Differentiating the two would clarify the structure.",
      "Jenna, a blind parent, checks a school calendar. The table caption and summary both read 'School Events'. Her reader echoes it twice. She feels it’s redundant. A more descriptive summary would enhance usability.",
      "George, a retiree with low vision, browses a medical report. Table summaries and captions match exactly. He gets annoyed by repeated speech. Creating unique but related text would resolve this.",
      "Yuki, a blind student, reads a table of exam results. Caption and summary are both 'Exam Results'. She’s confused whether the table is duplicated. She feels uncertain. Clarifying the summary avoids this.",
      "Tariq, a screen reader user, checks an accessibility audit. Each table repeats the caption in the summary. He gets fatigued hearing the same words. Adjusting one to describe the structure helps.",
      "Aisha, a blind editor, reviews a layout mockup. A table caption says 'Style Guide', and so does the summary. She hears it double and loses focus. She feels distracted. More precise summary content would aid clarity.",
      "Mei, a low-vision traveler, views a transit table. The summary and caption are both 'Train Timetable'. She’s unsure what each part means. She feels confused. Differentiating the purpose of each improves understanding.",
      "Isaac, a blind analyst, examines a finance chart. The summary just repeats the caption. He expects more detail and is disappointed. He feels underserved. Using the summary for structure or tips would help.",
      "Lena, a screen reader tester, reviews a client’s table. The caption and summary match word-for-word. She flags it as redundant. She suggests making the summary describe how to read the table.",
      "Samira, a blind entrepreneur, reviews her profit report. The summary and caption are both 'Monthly Sales'. She gets bored of repetition. Providing structure context in the summary helps comprehension.",
      "Haruto, a blind musician, reads a table comparing gear. Caption and summary both say 'Synth Features'. His reader echoes the phrase. He feels irritated. Revising the summary to explain layout improves the experience.",
      "Zainab, a blind journalist, checks a survey report. A table’s caption is 'Poll Results', and so is its summary. She hears them both back-to-back. She feels it’s a waste of time. Adding layout tips to the summary helps.",
      "Ben, a screen reader user, browses a health portal. A table labeled 'Blood Pressure Log' has the same text for both caption and summary. It sounds like a mistake. He feels distracted. Differentiation solves the issue.",
      "Grace, a caregiver with low vision, uses a screen reader to review a patient care chart. The summary and caption are identical. She gets confused. Rewriting the summary to reflect table structure resolves this.",
      "Omar, a tester, audits a website for accessibility. He notices tables with repeated caption/summary text. He logs them as issues. He recommends making summaries more descriptive.",
      "Fatima, a UX reviewer, flags duplicate text in table markup. She knows screen readers will repeat them. She suggests using the summary to guide users through how to interpret the table."
    ],
    "responsibility": ["developer", "content"]
  }
}
