디자인·모바일·접근성 목록으로

병원 홈페이지 애니메이션을 쓰는 정도

병원 홈페이지 애니메이션은 개수보다 움직임의 필요성과 이용자의 제어 가능성으로 사용 범위를 정합니다. 자동 전환과 사용자 조작으로 시작하는 효과를 구분하고, 업체에 요구할 제어 기능과 납품 화면의 시험 순서를 설명합니다.

목차

움직임의 필요성과 제어 가능성

병원 홈페이지 애니메이션은 개수보다 각 움직임의 필요성과 이용자의 제어 가능성으로 사용 범위를 정합니다. 자동으로 움직이는 내용에는 멈춤 수단을, 조작에 따라 발생하는 비필수 움직임에는 사용하지 않는 선택을 업체에 요구하는 방향으로 설계합니다. 원장과 실장은 안내에 필요한 효과를 결정하고, 마케팅 담당자는 효과별 시작 방식과 제어 요구를 문서로 정리합니다.

움직임을 남길 이유는 해당 효과가 어떤 안내나 조작을 돕는지로 설명합니다. 업체가 화면을 역동적으로 만든다는 설명만 제시하면, 효과가 없는 상태에서도 같은 내용을 전달할 수 있는지 묻습니다. 움직임을 제거해도 진료 안내를 읽거나 버튼을 사용하는 데 차이가 없다면 장식 효과로 분류하고 유지 필요성을 따집니다.

움직임이 적용되는 위치목적과 시작 방식유지·제거·제어 요구안
자동 전환 배너여러 안내를 순서대로 표시하며 자동 시작안내 필요성을 가리고 멈춤 수단 요구
스크롤에 반응하는 사진화면 이동에 맞춰 장식 효과 발생불필요하면 제거하고 유지 시 비활성 선택 요구
버튼 주변의 이동 효과버튼 조작에 반응해 강조 효과 발생장식 움직임과 조작 결과 표시를 구분
자동 갱신 안내표시 내용을 자동으로 갱신갱신 필요성과 이용자 제어 방식 결정

표는 병원이 효과 목록을 분류할 때 사용할 수 있는 틀입니다. 같은 위치에 있어도 시작 방식이 다르면 별도 항목으로 기재합니다. 배너가 자동 전환되면서 버튼을 누를 때 추가 효과까지 발생한다면, 담당자는 각각의 유지 이유와 제어 요구를 나누어 기록합니다.

자동 시작과 조작 반응의 적용 수준

웹 콘텐츠 접근성 지침의 자동 움직임 기준과 조작 반응 애니메이션 기준은 적용 수준이 다릅니다. 자동으로 시작하는 움직임·깜박임·스크롤 정보는 지속 시간이 정해진 조건을 넘고 다른 내용과 함께 표시될 때 일시정지·정지·숨김 수단을 요구하며, 이는 에이 수준입니다. 다만 해당 움직임·깜박임·스크롤이 활동에 필수적인 경우에는 예외를 인정합니다. 자동 갱신 정보에는 같은 지속 시간 조건을 붙이지 않고, 자동 시작과 다른 내용의 병행 표시를 조건으로 제어 수단이나 갱신 빈도 조절을 요구하되, 자동 갱신이 활동에 필수적인 경우에는 예외를 인정합니다.

조작으로 발생하는 움직임 애니메이션을 비활성화할 수 있도록 하는 기준은 트리플 에이 수준입니다. 기능이나 전달 정보에 필수적인 애니메이션에는 예외가 있으므로, 업체는 필수라고 판단한 이유를 해당 기능과 연결해 설명해야 합니다. 병원은 이 기준을 자동 움직임의 기준과 같은 수준으로 설명하지 않고, 제작 요구에 포함할 범위를 별도로 결정합니다.

더블유쓰리씨의 접근성 디자인 팁은 자동으로 시작하는 애니메이션을 멈출 수 있는 눈에 보이는 제어 요소를 마련하도록 안내합니다. 다만 병원은 이를 실제 화면에 적용하기 위해 제어 요소의 위치와 문구를 업체에 요구합니다. 조건의 일부에 해당하지 않는다는 이유만으로 장식 움직임을 승인하지 않고, 안내를 읽는 동안 계속 필요할지를 별도로 판단합니다.

효과 목록에서 납품 화면까지의 순서

실행은 효과 목록을 만든 뒤 유지 여부와 제어 요구를 결정하고, 납품 화면에서 실제 동작을 시험하는 순서로 진행합니다. 담당자는 완성 이미지뿐 아니라 움직임의 시작과 종료를 알 수 있는 시연 자료를 업체에 요청합니다. 효과가 적용되는 페이지와 화면 크기도 함께 기록해야 시험 대상을 빠뜨리지 않습니다.

  1. 마케팅 담당자는 업체의 효과 목록에 위치, 전달 목적, 시작 방식, 반복 여부를 기재하도록 요청합니다.
  2. 원장이나 실장은 안내에 필요한 효과를 승인하고, 담당자는 제거할 효과와 제어 기능이 필요한 효과를 구분합니다.
  3. 업체는 제어 요소의 위치와 동작, 효과를 사용하지 않을 때의 화면을 시안에 포함합니다.
  4. 담당자는 납품 화면을 직접 조작하고, 실패한 동작을 페이지와 발생 조건별로 정리해 수정을 요청합니다.

병원이 준비할 자료는 적용할 안내 내용, 현재 화면의 이동 경로, 효과를 유지하려는 이유입니다. 업체가 준비할 자료는 효과 목록, 제어 기능 설명, 움직임 없는 화면의 표현 방식입니다. 실장은 양쪽 자료에서 승인 내용과 구현 내용이 다른 항목을 추려 업체와 결정합니다.

제어 요구와 납품 동작의 대조

확인할 움직임업체에 요구할 제어 기능납품 화면에서 확인할 동작
자동 전환 배너찾을 수 있는 멈춤 수단과 이해할 수 있는 문구조작 뒤 자동 전환이 실제로 멈추는지 시험
자동 갱신 안내일시정지·정지·숨김 또는 갱신 빈도 조절합의한 방식으로 표시나 갱신이 제어되는지 시험
스크롤 반응 장식비필수 움직임을 사용하지 않는 선택선택 뒤 스크롤해도 장식 움직임이 발생하지 않는지 시험
버튼 조작 애니메이션비필수 효과의 비활성화와 조작 결과 표시 유지효과 없이도 버튼 기능과 결과를 알 수 있는지 시험

제어 버튼의 그림이 있다는 사실만으로 납품을 승인하지 않습니다. 담당자는 버튼을 사용한 뒤 원래 움직임을 일으키던 동작을 다시 수행합니다. 배너는 전환이 멈추는지, 스크롤 효과는 화면을 이동해도 다시 발생하지 않는지 구분해 기록합니다.

시험은 병원이 승인한 페이지에서 시작하고, 같은 효과가 적용된 다른 화면으로 확대합니다. 작은 화면에서 제어 요소가 잘리거나 다른 요소에 가려지는지도 함께 대조합니다. 업체의 설명과 결과가 다르면 담당자는 화면 위치, 수행한 조작, 기대한 결과, 실제 결과를 기재해 전달합니다.

수정 요청에는 단순히 애니메이션이 불편하다는 평가보다 실패한 동작을 적시합니다. 업체가 수정한 뒤에는 같은 조작을 반복해 해당 항목의 처리 상태를 갱신합니다. 남아 있는 문제는 승인 목록과 분리해 관리하고 공개 전 처리 여부를 결정합니다.

멈춤과 비활성화를 혼동하는 경우

자동 배너의 멈춤 버튼과 조작 반응 효과의 비활성화 선택은 같은 기능으로 처리하지 않습니다. 배너만 멈췄는데 스크롤할 때 사진이 계속 이동한다면, 조작 반응 효과에 대한 요구는 처리되지 않은 상태입니다. 담당자는 하나의 제어 요소가 어떤 효과까지 제어하는지 업체 설명과 실제 결과를 대조합니다.

마우스를 올려놓는 동안에만 멈추는 방식도 별도로 판단해야 합니다. 병원이 손가락 조작이나 키보드 사용을 포함해 요구했다면, 마우스 반응만으로 그 요구를 충족했다고 기록할 수 없습니다. 업체에는 지원하기로 한 입력 방식별로 제어 동작을 시연하도록 요청합니다.

효과의 비활성화와 기능의 제거도 구분합니다. 버튼 주변의 이동 효과를 사용하지 않아도 버튼은 작동해야 하고, 선택이나 처리 결과를 전달하는 표시는 남아 있어야 합니다. 업체가 움직임을 제거하면서 결과 안내까지 삭제했다면 병원은 효과 수정과 정보 누락을 별도 문제로 기록합니다.

반복 시험을 위한 동작 기록

점검 기록은 다음 담당자가 같은 상태를 재현할 수 있을 정도로 구체적으로 작성합니다. 페이지 이름과 사용 기기, 시작 상태, 수행한 조작, 결과를 함께 기재합니다. 화면 사진만으로 움직임의 변화를 전달하기 어렵다면 시작부터 제어 이후까지 이어지는 화면 기록을 남깁니다.

정상 동작과 실패 동작은 같은 효과 항목 아래 구분해 기록합니다. 제어 요소를 사용한 직후에는 멈췄지만 다른 안내를 선택한 뒤 다시 움직였다면, 그 전환 과정까지 적시합니다. 병원은 다시 시작되는 동작이 합의한 설계인지 업체에 묻고, 설명이 필요한 동작인지 수정할 동작인지 결정합니다.

업체가 필수 기능을 이유로 효과를 유지하려면 움직임이 없는 상태에서 전달할 수 없는 정보가 무엇인지 설명해야 합니다. 병원은 브랜드 표현이나 시각적 강조라는 설명만으로 필수성을 인정하지 않습니다. 대체 표시가 가능한지는 업체가 제안하고 병원은 안내 내용의 누락 여부를 판단합니다.

숨김 뒤 남는 안내의 완전성

움직이는 영역을 숨기는 방식으로 제어를 구현한다면, 그 안의 안내를 다른 위치에서도 읽을 수 있는지 판단합니다. 배너를 숨긴 뒤 진료 일정이나 방문 준비 안내를 찾을 경로까지 사라지면 병원은 정보 배치를 다시 결정해야 합니다. 담당자는 숨김 이후의 화면에서 필요한 안내로 이동하는 경로를 직접 사용합니다.

같은 내용을 다른 위치에 제공할 때는 배너 문구와 상세 안내의 내용이 어긋나지 않도록 관리합니다. 실장은 변경할 안내를 전달하면서 배너와 상세 페이지 중 수정할 위치를 명시합니다. 병원은 업체에 효과 영역의 수정뿐 아니라 연결된 안내의 변경 여부도 함께 보고하도록 요청합니다.

자주 묻는 질문

모든 페이지에 같은 효과를 적용해야 합니까?

같은 효과를 모든 페이지에 적용할 필요는 없습니다. 진료 설명을 길게 읽는 페이지와 짧은 안내를 선택하는 페이지는 이용 방식이 다르므로, 효과의 적용 범위를 페이지별로 정할 수 있습니다. 업체에는 공통 효과를 적용할 페이지와 제외할 페이지를 목록으로 전달합니다.

움직임 설정의 이름은 어떻게 정해야 합니까?

이용자가 선택했을 때 어떤 변화가 생기는지 알 수 있는 이름을 사용합니다. 업체 내부의 효과 이름이나 기술 용어만 표시하면 이용자가 설정의 의미를 이해하기 어렵습니다. 병원 담당자는 설정 문구를 읽고 예상한 변화와 실제 변화가 일치하는지 시험합니다.

외부에서 가져온 움직이는 요소도 포함합니까?

병원 페이지 안에 표시되는 외부 요소도 효과 목록에 포함해 관리합니다. 웹 콘텐츠 접근성 지침은 자동 움직임 기준을 페이지 전체 콘텐츠에 적용하도록 설명합니다. 직접 수정할 수 없는 요소라면 업체에 제어 가능 여부를 묻고, 사용할지 대체할지 병원이 결정합니다.

움직임을 제거하면 비어 있는 공간은 어떻게 합니까?

효과가 없어도 안내가 완성된 형태로 읽히도록 정적인 배치를 요청합니다. 이동을 전제로 비워 놓은 영역이나 나중에 나타나는 문구가 있다면 업체가 그 상태를 별도로 설계해야 합니다. 병원은 정적인 화면에서도 제목과 본문, 버튼의 관계를 이해할 수 있는지 평가합니다.

납품 뒤 새로운 배너를 추가할 때도 시험합니까?

새 배너를 추가하거나 기존 효과의 동작을 변경하면 변경된 항목을 다시 시험합니다. 운영 담당자는 교체한 내용과 효과 설정을 함께 기록하고, 기존 승인 화면과 달라진 부분을 업체에 전달합니다. 이전 납품의 승인 기록을 이후 변경까지 승인한 근거로 사용하지 않습니다.

맨 위로 이동

병원 홈페이지 디자인 서비스 자세히 보기