#html 11

Web Component UI Kit

ชุด UI components ที่สร้างด้วย Custom Elements ล้วน — Button, Badge, Tooltip, Dialog — ใช้ร่วมกับทุก framework หรือ vanilla HTML

HTML Forms & Native Validation

Native HTML5 form validation, Constraint Validation API, custom error messages, และ patterns สำหรับ accessible forms

Web Components & Custom Elements

สร้าง reusable components ด้วย browser APIs โดยตรง: Custom Elements, Shadow DOM, HTML Templates — ไม่ต้องการ framework

HTMX — HTML Attributes แทน JavaScript สำหรับ Dynamic UI

คู่มือ HTMX — ทำ AJAX, WebSocket และ SSE ด้วย HTML attributes โดยไม่เขียน JavaScript

Accessibility Testing Tools — ตรวจ a11y อย่างมีระบบ

รวม tools สำหรับ test web accessibility ตั้งแต่ automated scan ถึง manual testing ด้วย screen reader

HTML lazy loading — โหลด resource เมื่อใกล้จะเห็น

HTML <picture> — responsive image ที่ถูกวิธี

HTML Constraint Validation API — validate form โดยไม่ต้อง JS

<details> และ <summary> — accordion โดยไม่ต้องเขียน JavaScript

details/summary ทำ accordion toggle ได้ใน HTML ล้วน — browser จัดการ open/close, keyboard และ accessibility ให้ทั้งหมด

<dialog> element — native modal โดยไม่ต้อง library

browser มี <dialog> built-in พร้อม focus trap, backdrop, Escape key — ไม่ต้อง install อะไรเพิ่ม

HTML Popover API — tooltip และ dropdown โดยไม่ต้องเขียน JS เอง

popover attribute + popovertarget ทำ overlay ที่ accessible ได้ใน HTML ล้วน — มี focus trap, light dismiss และ :popover-open selector