gtcksa.com

# Fix Fix color contrast

## CONTEXT
- Page: https://gtcksa.com/
- Issue: Insufficient color contrast
- Impact: SERIOUS
- Standard: WCAG 1.4.3 Contrast (Minimum) (Level AA)

## WHY IT FAILS
Text-to-background contrast falls below 4.5:1 for normal text or 3:1 for large text.

## ELEMENT
```html
<div class="elementor-heading-title elementor-size-default">
```

**Selector:** `div.elementor-element > div.elementor-element > div.elementor-widget-container > div.elementor-heading-title`

## HOW TO FIX
- Darken the text color or lighten the background until the ratio passes.
- Use a tool like contrast-ratio.com to verify before shipping.

## REFERENCE
<https://dequeuniversity.com/rules/axe/4.11/color-contrast>

# Fix Fix label-content-name-mismatch violation

## CONTEXT
- Page: https://gtcksa.com/
- Issue: Accessibility violation flagged by axe-core
- Impact: SERIOUS
- Standard: WCAG 2.2 (see violation details)

## WHY IT FAILS
Lighthouse / axe-core flagged this rule. See helpUrl for the full reference.

## ELEMENT
```html
<a href="https://gtcksa.com/product/fc-colored-sketchbook-220gsm/" class="wd-product-img-link product-image-link" tabindex="-1" aria-label="FC Colored Sketchbook 220gsm – 16 Sheets Artist Pad (25 X 35 cm)">
```

**Selector:** `div.wd-product > div.wd-product-wrapper > div.wd-product-thumb > a.wd-product-img-link`

## HOW TO FIX
- Open the help URL for the canonical fix recipe.

## REFERENCE
<https://dequeuniversity.com/rules/axe/4.11/label-content-name-mismatch>

# Fix Give the link an accessible name

## CONTEXT
- Page: https://gtcksa.com/
- Issue: Link has no accessible name
- Impact: SERIOUS
- Standard: WCAG 2.4.4 Link Purpose / 4.1.2 Name, Role, Value (Level A)

## WHY IT FAILS
Screen readers announce this link with no purpose attached.

## ELEMENT
```html
<a class="wd-fill" href="https://gtcksa.com/stationery-and-writing-instruments/">
```

**Selector:** `div.wd-col > div.wd-cat-inner > div.wd-cat-content > a.wd-fill`

## HOW TO FIX
- Put descriptive text inside the `<a>` tag, or set `aria-label` on the link.
- Avoid generic labels like "click here" or "read more"; describe the destination.

## REFERENCE
<https://dequeuniversity.com/rules/axe/4.11/link-name>

# Fix Fix heading hierarchy

## CONTEXT
- Page: https://gtcksa.com/
- Issue: Heading levels are out of sequence
- Impact: SERIOUS
- Standard: WCAG 1.3.1 Info and Relationships (Level A)

## WHY IT FAILS
Headings skip levels (e.g. h2 → h4) and break the document outline.

## ELEMENT
```html
<h4 class="info-box-title title box-title-style-default wd-fontsize-m" data-elementor-setting-key="title">
```

**Selector:** `div.info-box-wrapper > div.wd-info-box > div.info-box-content > h4.info-box-title`

## HOW TO FIX
- Renumber headings so they go in order: h1 → h2 → h3 with no skips.
- Reserve a single `<h1>` for the page title.

## REFERENCE
<https://dequeuniversity.com/rules/axe/4.11/heading-order>

# Fix Fix target-size violation

## CONTEXT
- Page: https://gtcksa.com/
- Issue: Accessibility violation flagged by axe-core
- Impact: SERIOUS
- Standard: WCAG 2.2 (see violation details)

## WHY IT FAILS
Lighthouse / axe-core flagged this rule. See helpUrl for the full reference.

## ELEMENT
```html
<a href="https://gtcksa.com/classroom-decoration/">
```

**Selector:** `div.wd-cat-content > div.wd-cat-header > h3.wd-entities-title > a`

## HOW TO FIX
- Open the help URL for the canonical fix recipe.

## REFERENCE
<https://dequeuniversity.com/rules/axe/4.11/target-size>