문제

~이다 모달 창/대화 상자 웹 사이트에 대한 모범 사례를 고려하십니까? 모달 창을 사용하는 것에 대해 우려하는 것 중 하나는 팝업 창과 매우 비슷하며 사용자 좌절감을 유발하거나 사용자가 방해 가기 때문에 간단히 닫을 수 있다는 것입니다. 사용자 선호도 및 사용률에 대해 이야기하는 연구를 알고 있습니까?

A Modal Window 링크가있는 것 이외의 접근성 문제가 있습니까? 당신은 ~ 처럼 모달 창을 사용하는 사이트 또는 웹 앱? 그 이유는 무엇? 모달 창을 구현하기위한 좋은 관행은 무엇입니까? 모달이 사진이나 갤러리를 표시 할 때 가장 자주 사용되는 것을 알고 있지만 다른 실제 사용 사례는 무엇입니까? 귀하의 사이트에서 사용하고 결정에 어떤 영향을 미칩니 까?

도움이 되었습니까?

해결책

연습 관점에서 - 접근성을 제외하고 Modal Windows는 대화 상자와 같이 놀랍지 않은 대안을 제공하고 팝업 창보다 덜 방해받지 않는 느낌을줍니다. 그들은 일반적으로 앞서 언급 한 두 가지 방법 중 하나보다 사이트에 더 응집력있는 느낌을줍니다. 그림이나 미디어 외에도 모달 대화 상자를 사용하여 대화 상자와 동일한 목적을 제공했습니다. 사용자가 필요한 입력 형태를 제공하거나 사이트와 다시 상호 작용하기 전에 무언가를 인정하도록합니다.

순전히 접근 가능한 관점에서 볼 때, 그들은 그렇게 크지 않습니다. 일반적으로 JavaScript가 필요하며, Modals가 DOM과 관련하여 관리되는 방식 때문에 스크린 리더는 잘 해석하지 않습니다. 이것을 싸우기 위해, 항상 우아하게 저하하는 것이 좋습니다. 한 가지 제안은 모달 대화의 내용을 가져 와서 페이지에 배치하는 것입니다. 모달 대화 할 때마다 ~해야 한다 현재 페이지를 '모달 페이지'로 리디렉션하고 사용자의 입력을 가져오고 켜져있는 페이지로 돌아갑니다.

마지막으로, 내 개인적인 의견에 관한 한, 나는 Modal Windows 신경 쓰지 않습니다. 올바르게 사용하면 괜찮은 경험을 제공한다고 생각합니다. 가지다 내 관심을 끌기 위해, 페이지에서 나를 방향을 바꾸지 않고 추악한 운영 체제 테마 대화 상자 또는 팝업 (어쨌든 내 브라우저가 차단할 가능성이 있음)을 보여주지 않고 오히려 그렇게 할 것입니다. 내가 선택해야한다면 요약 할 것 같아요 어떻게 방해 받고 싶습니다. 그러면 모달 대화 상자를 선택합니다.

다른 팁

많은 많은 사람들이 모달 창을 레이어 패널과 혼동하는 것처럼 보입니다. 대화 상자는 모달 창일 수 있고 팝업은 모달 창입니다. 계층화 된 패널은 창이 아니지만 팝업 또는 대화 상자가 나타납니다. 기본 층을 사용할 수 없다는 의미에서는 모달입니다. 모달 창은 팝업 차단제에 면역이기 때문에 웹 사이트에서 인기가 있습니다.

Modal Windows는 기본 응용 프로그램이 계속 필요한 정보 또는 사용자 조치를 얻도록 설계되었습니다. 비 모달 창을 사용하면 사용자가 창과 기본 응용 프로그램 사이에서 앞뒤로 전환 할 수 있습니다. 비 모달 창에 잘 사용하면 스크린 도움말 또는 사용자가 참조 도구가 필요하고 기본 응용 프로그램에 대한 액세스가 필요한 자습서가있을 수 있습니다.

IMHO, Modal Windows는 좁은 특정 목적으로 설계되었으며 지금은 부적절하게 사용됩니다. 당신이 무언가를 할 수 있다고해서 당신이해야한다는 의미는 아닙니다! :-)

나는 웹 앱에서 Modal Windows 만 사용하여 사용자에게 전체 집중이 필요한 간단한 질문이나 조치를 사용하여 Modal이 "배경을 잊어 버리고"응용 프로그램이 요구하는 것에 집중하기 위해 ...

예 :

"허용되는 최대 대출은 한도에 도달했습니다.이 새로운 대출을 고객에게 보내고 싶습니까?"

예를 들어 이메일을 보내기위한 사전 텍스트 선택 (예 : 오른쪽 주제 및 신체 텍스트에 사용할 수있는 모달 창 또는 클라이언트에게 보낼 사전 정의 된 제목/본문을 선택할 수 있습니다 ...

그런 것들 :)

나는 사용자가 모든 재무 데이터를 일부 클릭으로 작성하여 계약을 전송하는 데 모든 금융 데이터를 입력하는 웹 사이트에서 작동하는 많은 재무 웹 앱을 수행하며, 이는 Modal Windows를 사용하는 조치입니다.

도움이되기를 바랍니다

37Signals는 Modals에 대한 흥미로운 게시물을 가지고 있습니다 여기. 그들은 모달을 사용하여 화면 크기를 통해 중요성을 나타내는 것에 대해 이야기합니다. 여기서 모달 오버레이는 새 페이지로 탐색 할 필요가 없습니다.

데이터 입력 화면에 웹 앱에서 Modal Windows를 일반적으로 사용합니다. 예를 들어, 사용자는 목록 또는 검색 결과 화면이 있으며 레코드를 클릭하여 모달 창에서 편집 할 수 있습니다. 웹 사이트에서 Modal Windows를 많이 사용하지 않습니다. 사이트에 대한 느낌과 같은 약간 적은 '응용 프로그램'을 선호합니다.

구현 열악한 웹 센터의 대화 상자 문제의 대부분. 일부 고려 사항에는 다음이 포함됩니다.

  • 화면 크기
  • 브라우저 창 크기 조정
  • 대화 상자를 열 수있는 곳
  • 양식 요소 제출
  • 가혹한 오버레이 스트로브 라이트 효과
  • 우아한 황폐화 (앞에서 언급했듯이)

이들 모두는 일부 예측 및 프로그래밍 기술로 쉽게 극복 할 수 있으며 웹에서 대화를 올바르게 구현할 때 매우 유용합니다.

라이센스 : CC-BY-SA ~와 함께 속성
제휴하지 않습니다 StackOverflow
scroll top