정보 우선순위
좁은 화면에서 숨길 것과 남길 핵심 정보를 먼저 정한다.
레이아웃 전환
column 수, gap, ordering이 breakpoint 또는 container 크기에 따라 바뀐다.
상호작용 확인
버튼 터치 영역, 폼 입력, modal 높이를 모바일에서 검증한다.
콘텐츠 스트레스
긴 텍스트, 큰 숫자, 이미지 실패, 빈 데이터로 레이아웃을 시험한다.
Breakpoint
viewport 기준
전체 화면 폭에 따라 navigation과 grid를 전환
디바이스 이름보다 콘텐츠 기준
Container
부모 크기 기준
카드가 놓인 영역 폭에 맞춰 내부 배치를 바꿈
재사용 컴포넌트에 적합
Fluid
유동 크기
minmax, clamp가 아니라 안정적 제약으로 공간을 조정
폰트 viewport 스케일 남용 금지
Touch
모바일 조작
버튼 크기, 간격, sticky 영역, 키보드 등장 대응
hover 의존 제거