[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6},"actionData","errors","routes/hashtag",{"_7":8,"_9":10,"_11":12},"articles",[13],"authors",{},"tag","dc2626;",{"_14":15,"_16":17,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27},"content","---\n\n# Chapter 1 — Global Attributes\n\n> Global attributes can be applied to **any HTML element** — they are not specific to any one element. This chapter covers every global attribute defined in the HTML Living Standard as of April 2026, including the full set of ARIA global attributes and the newest additions from 2023–2026.\n\n---\n\n## 1.1 — Core Identity & Classification\n\n### `id`\n\nA unique identifier for the element within the document. Must be unique — no two elements in the same document may share an `id`. Used by CSS selectors (`#id`), JavaScript (`getElementById`), URL fragment navigation (`href=\"#id\"`), `for`/`aria-labelledby`/`aria-describedby` associations, and `popovertarget`/`commandfor`.\n\n**Values:** Any string without spaces. Case-sensitive.\n\n```html\n

…

\nSkip to main content\n```\n\n### `class`\n\nOne or more space-separated class names. Used by CSS selectors (`.class`) and JavaScript (`getElementsByClassName`, `querySelector`). An element can have any number of classes.\n\n```html\n

…

\n```\n\n### `style`\n\nInline CSS declarations applied directly to the element. Highest specificity of any CSS (except `!important`). Use sparingly — prefer external stylesheets.\n\n```html\n

Warning text

\n```\n\n### `title`\n\nAdvisory text — shown as a tooltip on hover in desktop browsers. **Not reliably accessible** — not announced on mobile, not reachable by keyboard-only users. Use `aria-label` or visible text for important information. Valid for supplementary hints only.\n\n```html\nWHO\n\n```\n\n---\n\n## 1.2 — Language & Direction\n\n### `lang`\n\nThe natural language of the element's content. Overrides the document-level `lang` on ``. Affects spell-checking, screen reader pronunciation, hyphenation, and quote style.\n\n**Values:** BCP 47 language tags — `en`, `en-GB`, `en-US`, `fr`, `de`, `ar`, `zh-Hans`, `ja`, etc.\n\n```html\n\n

This is English. Voici du français.

Ein deutsches Zitat.

\n```\n\n### `dir`\n\nText directionality of the element's content.\n\n**Values:**\n- `ltr` — Left to right (Latin, Cyrillic, Greek scripts)\n- `rtl` — Right to left (Arabic, Hebrew, Persian, Urdu)\n- `auto` — Browser infers direction from first strong directional character in content\n\n```html\n\n

مرحباً بالعالم

Unknown direction text

\n```\n\n### `translate`\n\nWhether the element's text content should be translated by browser translation tools and services.\n\n**Values:** `yes` (default) or `no`\n\n```html\n\nClaude\n\n\ndisplay: flex\n\n\n

Hello world

\n```\n\n---\n\n## 1.3 — Keyboard & Interaction\n\n### `tabindex`\n\nControls whether an element is keyboard-focusable and its position in the tab order.\n\n**Values:**\n- `tabindex=\"0\"` — Element is focusable; inserted into the natural tab order at its DOM position\n- `tabindex=\"-1\"` — Element is focusable via JavaScript (`element.focus()`) but excluded from keyboard tab order\n- `tabindex=\"n\"` (positive integer) — Element is focusable; tab order position is `n`. **Avoid** — creates confusing non-sequential tab order\n\n```html\n\n

Click me

\n\n\n

Error: field required

\n\n```\n\n### `accesskey`\n\nSpecifies a keyboard shortcut key. **Use sparingly** — conflicts with browser and OS shortcuts are common and vary by platform.\n\n```html\n\nSearch (Alt+F)\n```\n\n### `autofocus`\n\nBoolean. The element should receive focus automatically when the page loads (or when its containing `

`–`

This renders visually as an h3

This renders visually as an h4

Appears as h4

dc2626;

Global Attributes - HTML reference 2026 vdsology