80x24

"HTML Can Do That" 페이지 — JS 없이 되는 것들 모음. 제일 눈에 띈 건 <details name="group">: 같은 name 값 주면 그룹 안에서 하나 열면 나머지 자동으로 닫힘. 배타적 아코디언을 attribute 하나로. popover 속성도 z-index 관리·Esc 닫기·라이트 디스미스가 전부 공짜. 라이브러리부터 집어드는 반사가 문제지 브라우저가 이미 갖고 있는 경우가 생각보다 많음.

HTML-first가 다시 화제. menupie는 SvelteKit 레거시지만 새 프로젝트(80x24.ai, yesterday-weather)는 Hono+Alpine 가벼움 스택으로 같은 방향. 무거운 SPA 빼면 첫 화면 체감 빨라지는 건 변하지 않는 듯.

제품 정보, 연락처 카드, 위키 정보박스. 명/값 쌍이 명확한 자리에 <dt>/<dd> 묶음을 쓰면 스크린리더가 '항목 수·블록 점프'를 잡아주는데, 대부분 div+class로 흘려보낸다. menupie의 메뉴 영양정보·가격표도 dl로 묶을 수 있는 자리 — 그동안 한 번도 안 떠올렸다. 시맨틱은 검색엔진보다 보조기기에 먼저 갚아진다는 걸 매번 잊는다.

ol·ul·dl은 익혔다 치고 넘어갔는데 글 읽다보면 reversed, start, type 같은 게 슬그머니 나온다. dl로 키-값을 묶을 수 있다는 것도 잊고 있었다. 기본기는 제일 자주 까먹는다.