웹 접근성 준수 지침 - 인식의 용이성 - 6. 자동 재생 금지

웹 접근성은 모든 사용자, 특히 장애가 있는 사용자들이 웹 콘텐츠를 편리하게 이용할 수 있도록 하는 것을 목표로 합니다. 자동으로 재생되는 소리는 사용자에게 불편을 줄 수 있으며, 특히 시각 장애인, 청각 장애인, 주의력 결핍 장애가 있는 사용자들에게 더 큰 문제를 일으킬 수 있습니다. 따라서 웹 접근성 준수 지침에서는 자동 재생을 금지하고 있습니다.

1) 페이지 진입 시 자동 재생되는 3초 이상의 배경음 콘텐츠(동영상 포함)

자동 재생음을 제공하지 않도록 합니다. 이는 사용자에게 갑작스럽고 원치 않는 소리가 발생하는 것을 방지하기 위한 것입니다. 예를 들어, 웹페이지에 들어가자마자 3초 이상의 배경음이나 동영상이 자동으로 재생되는 경우, 사용자가 이를 제어할 수 없는 상황에서 불쾌감을 느낄 수 있습니다.

구현 예시

자동 재생을 막기 위해 HTML5 비디오 태그에서 autoplay 속성을 제거합니다.

<video controls>
  <source src="example-video.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>

2) 불가피하게 제공해야 하는 경우

특정 상황에서는 자동 재생이 불가피할 수 있습니다. 이러한 경우, 사용자에게 자동 재생을 제어할 수 있는 기능을 제공해야 합니다. 이는 3초 내에 정지하거나, ESC 키를 누르면 정지하거나, 소스 상 가장 먼저 위치해 정지 기능을 실행할 수 있도록 하는 방법을 포함합니다.

구현 예시

자동 재생이 필요한 경우, 사용자가 이를 제어할 수 있는 기능을 제공해야 합니다. JavaScript를 사용하여 구현할 수 있습니다.

<video id="myVideo" autoplay muted>
  <source src="example-video.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>
<button onclick="stopVideo()">Stop Video</button>

<script>
  function stopVideo() {
    var video = document.getElementById('myVideo');
    video.pause();
    video.currentTime = 0;
  }

  // ESC 키를 누르면 동영상 정지
  document.addEventListener('keydown', function(event) {
    if (event.key === "Escape") {
      stopVideo();
    }
  });
</script>

위와 같이, 자동 재생이 불가피한 경우에는 사용자에게 정지 기능을 제공하여 불편을 최소화할 수 있습니다. 또한, 정지 기능을 쉽게 찾을 수 있도록 시각적으로 잘 보이는 위치에 배치하는 것이 중요합니다.

자동 재생 금지는 사용자 경험을 개선하고, 웹 접근성을 높이는 중요한 요소 중 하나입니다. 이를 통해 모든 사용자가 웹 콘텐츠를 불편 없이 이용할 수 있도록 하는 것이 목표입니다.

---

이 블로그 포스트는 자동 재생 금지의 중요성을 강조하고, 이를 구현하기 위한 실질적인 예시를 제공함으로써, 웹 개발자들이 사용자에게 더 나은 경험을 제공하는 데 도움을 주고자 작성되었습니다.