# Cchatty Website AI Policy > **Cchatty – Learn Chinese and Make Friends.** Cchatty is a Chinese language learning platform. AI agents are permitted to browse public pages but **NOT** for model training. Site: https://www.cchatty.com. Content: pinyin tools, Chinese-English dictionary with TTS, HSK/BCT/TSC courseware (PDF), community forum (discussions, stories, notebooks, QA, study groups). Accessibility standard: WCAG 2.1 AA, aligned with Google Lighthouse Agentic Browsing. Version 1.3; Last Updated 2026-08-22. --- ## AI Policy - **Permitted** — Crawling / reading public pages, building retrieval-augmented indexes, accessibility and Lighthouse agentic-browsing audits. - **Forbidden** — Scraping for LLM / embedding model training (fine-tuning, pre-training, distillation), bulk redistribution of user-generated content. - **Rate / politeness** — Respect `crawl-delay` / `robots.txt`; read this `/llms.txt` and the "Key Pages" section before wide traversal. - **Contact for issues** — See "Issue Reporting" section below. ## Website Overview Cchatty is a Chinese language learning platform offering four main pillars: 1. **Learning Tools** — Pinyin utilities, interactive Chinese phonetic (initials / finals) chart. 2. **Online Dictionary** — Chinese-English dictionary with TTS, HSK-graded vocabulary, grammar comparisons, idiom references. 3. **Courseware (PDF)** — Structured HSK 3.0 / BCT / TSC / topic courseware and teacher materials (navigated as "PDF" in the main menu). 4. **Community** — User discussions (Mstory / Story / Notebook / QA / Video boards) and themed study groups (Learn Chinese, HSK, Chinese Culture, etc.). Primary language mix: English UI shell with Chinese learning content. The `` attribute is declared per page (use `lang="zh-CN"` for Chinese-centric pages and `lang="en"` for English pages). ## Accessibility Standards We follow **WCAG 2.1 AA Level** accessibility standards, aligned with Google Lighthouse Agentic Browsing requirements. The four POUR principles with agent-specific notes: 1. **Perceivable** — Text alternatives for non-text content, synchronized media captions, adaptable layout, distinguishable presentation (min 4.5:1 color contrast ratio for body text). 2. **Operable** — Every interactive element is keyboard-accessible; logical visual / DOM tab order; visible focus ring is never removed without a replacement; no keyboard traps. 3. **Understandable** — Every page has a unique and descriptive ``; content appears in a predictable order; every form control has an associated `<label>` (placeholder is supplementary and never the sole accessible name). 4. **Robust** — Semantic HTML5 (`<header>`, `<nav>`, `<main>`, `<article>`, `<section>`, `<footer>`); ARIA used only where a native HTML element does not exist; the accessibility tree is valid and complete (no roles with invalid required children, no orphaned interactive controls). Reference: [WCAG 2.1 Standard](https://www.w3.org/TR/WCAG21/) ## Accessibility Checklist for Audits ### Image Accessibility - All content images have descriptive `alt` attributes. - Purely decorative images use explicit empty `alt=""`. - Complex images (charts, infographics) have an adjacent detailed long description. ### Color Contrast - Body text / background contrast ratio ≥ 4.5:1 (WCAG AA); large text ≥ 3:1. - Verify with: [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/). - Color is never the sole way to convey information (e.g. error states also have icons / text). ### Semantic HTML & A11y Tree Integrity - Use the correct HTML5 semantic tag for its purpose; do not use `<div>` / `<span>` where a semantic role exists. - Verify that `<nav>`, `<main>`, `<article>`, and `<section>` are used for major regions — this directly affects the Lighthouse "Tree Integrity" agent audit. - Do not hide interactive content from the accessibility tree with `aria-hidden` unless it is truly redundant. ### Keyboard Accessibility & Focus - Every interactive element is reachable and operable via the keyboard alone. - Tab order follows the visual / logical reading order (DOM order matches visual order). - A visible focus indicator (`:focus-visible`) is always present and of sufficient size/contrast. ### ARIA Attributes - Prefer a native HTML element over an ARIA equivalent (e.g. `<button>` instead of `<div role="button">`). - Use ARIA labels sparingly; do not duplicate visible text as an aria-label unless a control has no visible label. - Reference: [WAI-ARIA 1.1 Specification](https://www.w3.org/TR/wai-aria-1.1/). ### Form Labels & Controls - Every `<input>`, `<textarea>`, and `<select>` has an associated `<label>` linked via `for` / `id` attributes, or is wrapped in a `<label>`. - Placeholder text is supplementary. A visible label (or `aria-label` / `aria-labelledby` for icon-only inputs) must exist independently. - Required fields, error states, and help text are exposed programmatically (`aria-required`, `aria-invalid`, `aria-describedby`). ### Page Titles & Language Declaration - Each page has a **unique**, descriptive `<title>` that clearly describes its purpose or content (no shared default titles across different pages). - `<html lang="zh-CN">` is used for Chinese-centric content; `<html lang="en">` for English pages. - Content-language switching is reflected in both the `lang` attribute and HTTP `Content-Language` / `<meta>` equivalents. ### Media: Captions, Transcripts & Motion - All video content includes synchronized captions; audio-only content has transcripts. - Auto-playing media has a pause / stop / mute control. - `prefers-reduced-motion` media query is respected; an explicit disable-animations toggle is exposed where animations are used beyond micro-interactions. ### Agent-Centric Considerations (Lighthouse Agentic Browsing) - **Cumulative Layout Shift (CLS)**: Avoid injecting content (ads, banners, post-load widgets) that shifts interactive elements after first paint. Images and iframes must reserve space via `width`/`height` attributes or CSS aspect-ratio. - **Name and Label audit**: Every interactive element has a non-empty programmatic name (no empty-buttons, no unlabeled search boxes). - **Visibility**: Content that agents need to read must not be removed from the accessibility tree during common interactions. - **Deterministic tool registration**: If WebMCP tools are registered, do so early in the page lifecycle (before `DOMContentLoaded` where possible) so Lighthouse and agents see a consistent set. ## Issue Reporting If you identify accessibility, agent-browsing, or content-mismatch issues, please report with the following four fields: 1. **Exact page URL** where the issue was found. 2. **Description of the problem** — what element / behavior fails, and against which WCAG or Lighthouse audit item. 3. **Suggested fix** — concrete code or content improvement. 4. **Severity level** — Critical / High / Medium / Low (per WCAG impact guidelines: Critical = blocks a user from a core task; Low = cosmetic). ## Continuous Improvement We are committed to continuously improving the accessibility and agent-readiness of cchatty.com. --- ## Key Pages - [Homepage](https://www.cchatty.com) — Community feed, main navigation, top study groups. - [Chinese Pinyin Chart](https://www.cchatty.com/tools/chinese-pinyin-chart) — Interactive initials / finals phonetic table. - [Chinese-English Dictionary](https://www.cchatty.com/dictionary) — Word lookup, HSK-graded vocabulary, grammar patterns, idioms. - [Example Community Post](https://www.cchatty.com/chinese-galaxy-book-fixes-abroad-g-113993) — Sample thread in the CCHATTY study group. - [Courseware (PDF)](https://www.cchatty.com/courseware) — Main entry: downloadable HSK / BCT / TSC structured learning materials. - [Courses Category Index](https://www.cchatty.com/courses) — Chinese Courses category index (exposed in footer navigation). ## Testing Resources - [Lighthouse — Chrome DevTools](https://developer.chrome.com/docs/lighthouse/overview/) — Built-in automated audits (performance, a11y, SEO, best practices, agentic browsing). - [Lighthouse Agentic Browsing Scoring](https://developer.chrome.com/docs/lighthouse/agentic-browsing/scoring) — How agent-readiness audits are scored (WebMCP integration, a11y tree integrity, CLS, llms.txt existence). - [Lighthouse llms.txt Audit](https://developer.chrome.com/docs/lighthouse/agentic-browsing/llms-txt) — The specific Lighthouse check that validates the presence and format of this file. - [axe DevTools Chrome Extension](https://chrome.google.com/webstore/detail/axe-devtools-web-accessib/lhdoppojpmngadmnindnejefpokejbdd) — Comprehensive in-browser accessibility testing. - [WAVE Evaluation Tool](https://wave.webaim.org/) — Visual accessibility evaluation and contrast analysis. - **Screen Readers (manual testing)** — NVDA (Windows, free), VoiceOver (macOS / iOS, built-in), JAWS (commercial Windows). ## Optional - [llms.txt Official Specification v2](https://llmstxt.org/) — The standard this file follows; placed at domain root `/llms.txt`. - [WCAG 2.1 Standard (full)](https://www.w3.org/TR/WCAG21/) — W3C Web Content Accessibility Guidelines 2.1. - [WAI-ARIA 1.1 Specification](https://www.w3.org/TR/wai-aria-1.1/) — Accessible Rich Internet Applications authoring guide. - [RFC 8615 — Well-Known Uniform Resource Identifiers](https://www.rfc-editor.org/rfc/rfc8615) — Related standard for site-wide metadata placement conventions. - [WebAIM Contrast Checker](https://webaim.org/resources/contrastchecker/) — Standalone color contrast analyzer (AA / AAA ratios).