🌐HTML 기술 문서

HTML 파싱 원리, DOM 트리 생성, Critical Rendering Path까지 — 브라우저가 HTML을 어떻게 읽고 그리는지 5년 차의 언어로 설명합니다.

CSR vs SSR vs SSG vs ISR — 각 렌더링 전략이 생성하는 HTML의 차이, Hydration이란 무엇인가, Next.js App Router의 서버 컴포넌트를 HTML 관점에서 파헤칩니다.

Resource Hints (preload/prefetch/preconnect), Critical CSS, Font Loading, web.dev Core Web Vitals — HTML 수준에서 가능한 성능 최적화 기법을 집중 분석합니다.

article, section, aside, nav, main, header, footer — 의미 있는 태그 하나가 SEO, 접근성, 유지보수를 한 번에 해결하는 이유를 파헤칩니다.

meta charset, viewport, description, OG 태그, favicon, Next.js Metadata API까지 — head 안의 모든 것을 5년 차의 언어로 해석합니다.

XSS, CSRF, Content Security Policy, iframe sandbox, sri — HTML 수준에서 방어할 수 있는 보안 취약점과 방어 기법을 실전 예시로 다룹니다.

form method, input type, label, 유효성 검사(Constraint Validation), React Hook Form까지 — 폼 개발의 모든 것을 원리부터 실전까지 다룹니다.

dialog, details/summary, popover API, template/slot — 현대 브라우저 네이티브 HTML 기능으로 JS 없이 구현할 수 있는 것들을 파헤칩니다.

href, target, rel, download, tel:/mailto: — 앵커 태그의 모든 속성과 보안 함정, Next.js Link 컴포넌트와의 차이를 파헤칩니다.

img alt, srcset/sizes, picture 아트 디렉션, lazy loading, Next.js Image 컴포넌트 — 이미지가 성능을 좌우하는 이유를 파헤칩니다.

ARIA 역할, 키보드 접근성, focus ring, skip link, 스크린리더 — 접근성 없는 서비스가 놓치는 것들을 5년 차의 언어로 파헤칩니다.

table thead/tbody/tfoot, scope, caption, ul/ol/dl — 표와 목록의 시맨틱 구조와 접근성, React에서의 데이터 테이블 패턴을 다룹니다.