Tooltip은 언제 좋은 도움말이 되지 못하는가

먼저 던질 질문

짧은 설명 UI는 언제 오히려 정보를 숨기는가

핵심 관점

Tooltip은 중요한 정보를 담는 장소가 아니라 보조 설명을 잠깐 보여주는 장치다. 사용자가 반드시 알아야 하는 정보는 숨어 있으면 안 된다.

첫 성공에 가까워지는 장면

아이콘 버튼의 의미를 짧게 알려주는 Tooltip. 사용자는 현재 상태를 이해하고, 다음에 무엇을 할 수 있는지 알며, 행동의 결과를 어느 정도 예측할 수 있다.

고급 옵션의 짧은 용어 설명.

학습 부담이 커지는 흐름

가격 조건이나 삭제 결과를 Tooltip에만 숨긴다.

모바일에서 hover 기반 Tooltip에 중요한 안내를 넣는다.

온보딩 사례와 근거

Tooltip은 핵심 정보를 숨기기에 좋지 않다

Tooltip은 부가 설명에는 유용하지만 작업 완료에 꼭 필요한 정보를 숨기는 장소가 되어서는 안 된다. 모바일에는 hover가 없고 키보드나 스크린 리더 사용자는 Tooltip을 발견하기 어려울 수 있다.

Material Design의 Tooltip은 짧은 설명을 제공하는 보조 패턴에 가깝다. 가격 정책, 오류 이유, 법적 동의처럼 중요한 정보는 본문, 도움말 텍스트, 세부 설명 영역에 노출해야 한다.

실무 해석

WCAG의 Content on Hover or Focus 기준을 생각하면 Tooltip은 닫을 수 있고, 가리키는 동안 유지되며, 사용자가 내용을 읽을 수 있어야 한다. Tooltip이 많아진다면 UI 문구 자체가 불명확한지 먼저 봐야 한다.

학습 비용 판단 기준

• 없어도 주요 행동이 가능한 정보인지 확인한다
• 모바일과 키보드에서 접근 가능한지 본다
• 긴 설명은 Inline Help나 문서로 분리한다

자주 빠지는 함정

화면이 복잡하다는 이유로 중요한 설명을 Tooltip에 숨기면 문제는 사라지지 않고 발견 가능성만 낮아진다.

추가로 비교할 학습 사례

• 아이콘 버튼 Tooltip, 가격 조건 Tooltip, 모바일 Tooltip 사례를 비교한다
• Tooltip 대신 Help Text가 나은 사례를 찾는다
• 키보드 focus에서 Tooltip이 동작하는 사례를 모은다

온보딩 설계 질문

• 중요한 정보를 Tooltip에 숨기면 안 되는 이유가 명확한가
• Popover, Help Text, 문서 링크와 구분했는가

출처

• Material Design 3, Tooltips: https://m3.material.io/components/tooltips/overview
• W3C, Web Content Accessibility Guidelines WCAG 2.2: https://www.w3.org/TR/WCAG22/
• Nielsen Norman Group, 10 Usability Heuristics for User Interface Design: https://www.nngroup.com/articles/ten-usability-heuristics/
• Apple Human Interface Guidelines: https://developer.apple.com/design/human-interface-guidelines/