요약

  • W3C의 2013년 HTML 5.1 초안은 dialog, showModal(), 대화 상자 스택과 최상위 층, 문서 차단, autofocus, 닫기와 반환값을 설명했다. 같은 날의 사용자 상호작용 장은 모달 창 밖의 요소를 비활성 상태로 만든다.
  • 2014년 HTML5 후보 권고안과 2017년 HTML 5.2 권고안은 그 역할 분담을 이어 갔다. 현재 HTML 표준은 초점과 닫기 요청을 더 세밀하게 다룬다.

기사 보관함을 비우기 전에 한 번 더 묻는 창을 만들기는 어렵지 않다. 하얀 상자를 올리고 배경을 흐리게 하고 단추 둘을 붙이면 된다. 문제는 사람이 실제로 움직일 때 시작된다. 키보드가 어두운 배경의 메뉴를 돌아다니거나, 읽기 도구가 뒤쪽 입력 칸을 현재 작업처럼 읽어 준다면 “지금은 이 질문에 답해 달라”는 화면의 부탁이 거짓말이 된다. 보기 좋은 장막이 출입 통제까지 해 주지는 않는다.

2013년 5월 28일 HTML 5.1 초안은 dialog를 응용 프로그램에서 작업을 수행하는 부분으로 설명했다. show()는 평범한 대화 상자를 연다. showModal()은 그 상자를 문서의 대화 상자 스택에 올리고 최상위 층으로 보내며 문서를 차단한다. 무엇을 물을지는 페이지가 정하지만, 지금 어느 대화가 차례인지는 브라우저가 관리한다.

같은 초안의 사용자 상호작용 장은 차단의 뜻을 풀었다. 모달 대화 상자 바깥의 노드는 비활성 상태가 된다. 어두워진 배경이 실제 행동에서도 잠시 물러나는 것이다. 사이트마다 키 입력을 붙잡고 뒤쪽 단추를 숨기는 자기만의 자물쇠를 만들던 일에 공통 규칙이 생겼다. 작은 변화처럼 보이지만, 초점이 어디로 갈 수 있는지를 정하는 일은 독자의 손길 전체를 바꾼다.

문지기는 사람을 내보내는 법도 알아야 한다. 2013년 문서는 autofocus로 첫 초점을 지정할 수 있게 하고, 맨 위 대화 상자에 취소 요청을 보내며, close()와 returnValue로 결과를 돌려주었다. “삭제하지 않기”를 고른 사람이 있다면 브라우저는 창을 닫고 답을 전한다. 실제로 기사를 남길지는 페이지의 처리 로직이 결정한다. 출입 절차와 대답의 의미가 서로 다른 책임이라는 뜻이다.

2014년 2월 HTML5 후보 권고안은 스택과 최상위 층, 취소와 닫기 절차를 유지했다. 2017년 12월 HTML 5.2 권고안은 대화 상자에 초점을 두는 단계를 더 구체적으로 썼다. 이 날짜들은 표준 문서의 이력이다. 모든 브라우저가 같은 날 같은 방식으로 움직였다는 달력은 아니다. 그래도 문서들이 꾸준히 붙잡은 문제는 뚜렷하다. 창 하나가 독자의 주의를 요구할 때, 나머지 페이지를 누가 잠시 기다리게 하는가.

show()와 showModal()을 같은 것으로 취급하면 예의가 어긋난다. 설명 패널은 글을 읽는 동안 옆에 열어 둘 수 있다. 삭제 확인은 잠깐 독점적인 답을 요구한다. 모서리가 둥근 상자라는 외형은 두 경우 모두 같을 수 있다. 하지만 뒤의 경우에만 브라우저가 복도에 대기 줄을 세운다. 이 줄을 세울 가치가 있는지는 웹사이트가 스스로 판단해야 한다.

현재 HTML 표준은 시작 초점, 닫기 요청과 반환값을 더 자세히 설명하고, 2013년 초안 이후에 마련된 requestClose()와 closedby도 담고 있다. 역사를 읽을 때 새 도구를 옛 문서에 끼워 넣을 이유는 없다. 남는 핵심은 간결하다. 페이지가 독자를 불러 세웠다면, 어떻게 안전하게 대답을 듣고 원래 읽던 자리로 돌려보낼 것인가.

좋은 문지기는 일을 마치면 길을 비켜 준다. 좋은 대화 상자도 그렇다. 기사보다 창이 더 자주 말을 건다면, 문제는 문지기의 근무 태도가 아니다.