색상 선호보다 먼저 정할 판단 기준
문의 버튼의 색과 크기는 특정 색상이나 고정 수치로 단정하지 않고, 글자가 함께 표시되는 버튼이 화면 크기와 입력 방식에 맞게 구별되고 선택되는지를 기준으로 정합니다. 병원은 업체 시안에서 버튼 글자와 색 조합, 화면별 크기와 누르는 영역, 키보드 선택 표시를 차례로 확인한 뒤 적용안을 확정합니다.
병원 로고에 쓰인 색은 버튼의 색 후보로 요청할 수 있습니다. 하지만 로고에서 선명한 색도 홈페이지 배경이나 버튼 글자와 조합하면 읽기 어려울 수 있습니다. 담당자는 색상표만 승인하지 말고, 실제 페이지 내용과 함께 배치한 버튼 시안을 요구합니다.
| 결정 항목 | 업체에 요구할 시안·설명 | 병원이 확인할 질문 |
|---|---|---|
| 버튼 색 조합 | 글자색·버튼 바탕색·주변 배경을 함께 표시한 화면 | 글자를 읽을 수 있고 주변 장식과 버튼을 구별할 수 있습니까? |
| 글자가 포함된 형태 | 아이콘을 쓰더라도 글자가 함께 표시되는 버튼 | 그림의 뜻을 추측하지 않고 문의 기능을 알아챌 수 있습니까? |
| 버튼 크기 | 화면별 표시 크기와 실제 누르는 영역의 설명 | 작은 화면에서도 글자가 온전히 표시되고 버튼을 선택할 수 있습니까? |
| 키보드 선택 표시 | 키보드로 버튼에 도달했을 때의 테두리나 강조 상태 | 현재 선택된 버튼을 화면에서 알아볼 수 있습니까? |
색을 정할 때는 버튼 바탕만 진하게 만드는 방식으로 결론을 내리지 않습니다. 바탕을 변경한 뒤 글자가 흐려지거나 주변의 강조 요소와 비슷해지면 다른 조합을 요청합니다. 승인 대상은 색 이름이 아니라 글자와 주변 화면까지 포함한 조합입니다.
글자가 함께 표시되는 버튼 형태
더블유쓰리씨의 웹 접근성 설계 안내는 아이콘과 그래픽 버튼에 텍스트를 함께 제공하는 설계를 예로 제시합니다. 병원은 문의 버튼을 아이콘만으로 표현한 시안보다 글자가 함께 표시되는 형태를 요청할 수 있습니다. 이때 글자가 버튼 안에서 잘리거나 바탕 무늬에 묻히지 않는지도 판단 항목에 포함합니다.
아이콘을 추가했다는 이유만으로 버튼 전체를 승인할 필요는 없습니다. 담당자는 아이콘과 글자가 서로 압박해 글자 영역이 좁아지는지, 화면이 줄어들 때 글자가 사라지는지 업체에 묻습니다. 작은 화면용 시안에서도 문의 기능을 읽어서 알아낼 수 있는 형태를 요구합니다.
버튼의 역할을 색만으로 전달하려는 설명도 승인 근거로 삼지 않습니다. 방문자가 특정 색의 뜻을 미리 알고 있다는 전제를 피하고, 글자와 버튼 형태를 함께 사용하도록 요청합니다. 색 후보에 대한 내부 의견은 이 조건을 충족하는 조합 안에서 조율합니다.
업체 시안을 확인하는 순서
담당자는 업체가 제출할 화면과 설명을 먼저 정리한 뒤 색과 크기를 논의합니다. 준비 자료에는 병원에서 사용하는 색상 자료, 버튼이 포함된 페이지 화면, 문제가 발생한 기기와 입력 방식을 포함합니다. 이전에 승인한 이미지가 있다면 현재 화면과 혼동하지 않도록 적용 상태를 함께 기재합니다.
- 버튼 글자와 색 조합을 확인합니다. 실제 페이지 배경을 포함한 시안에서 읽기 어려운 조합과 주변 요소에 묻히는 형태를 가립니다.
- 화면별 버튼 크기와 누르는 영역을 확인합니다. 업체에 표시된 외형과 실제 선택 가능한 범위를 각각 설명하도록 요청합니다.
- 키보드 선택 표시를 확인합니다. 구현 화면에서 버튼에 도달했을 때 나타나는 표시를 시험하고, 필요한 수정 내용을 정리합니다.
웹닷데브의 반응형 웹 디자인 설명은 화면 크기에 따라 스타일을 적용하고 터치 화면이나 작은 화면에 맞게 화면 구성을 조정할 수 있다고 안내합니다. 병원은 이를 바탕으로 넓은 화면의 버튼을 단순히 축소한 이미지 대신, 작은 화면과 터치 입력에 맞춘 시안을 요청할 수 있습니다. 크기 변경에 따라 글자와 여백이 어떻게 달라지는지도 업체 설명에 포함합니다.
| 확인 화면·입력 방식 | 버튼에서 확인할 것 | 수정 요청 내용 |
|---|---|---|
| 넓은 화면·마우스 | 글자와 바탕의 구별, 주변 요소와의 차이 | 읽기 어려운 색 조합이나 장식과 혼동되는 형태 변경 |
| 작은 화면·터치 | 글자 잘림, 버튼 외형, 실제 누르는 영역 | 글자와 여백 조정, 선택 가능한 범위 설명 |
| 글자를 크게 표시한 화면 | 글자와 버튼 테두리의 겹침, 내용 누락 | 글자 크기 변화에 대응하는 버튼 형태 수정 |
| 구현 화면·키보드 | 버튼 도달 가능 여부와 현재 선택 표시 | 선택 상태가 드러나지 않는 부분 수정 |
수정 요청에 포함할 화면 자료
수정 요청에는 전체 화면과 문제가 있는 버튼의 확대 이미지를 함께 첨부합니다. 전체 화면은 주변 배경과의 관계를 전달하고, 확대 이미지는 글자 잘림이나 테두리 문제를 설명하는 데 사용합니다. 담당자는 기기 종류, 화면 상태, 사용한 입력 방식을 각 자료에 기재합니다.
색과 크기를 한꺼번에 변경해 달라고만 요청하면 업체가 어떤 조건을 해결해야 하는지 알기 어렵습니다. 담당자는 읽기 어려운 부분, 선택되지 않은 부분, 표시가 누락된 상태를 따로 기록하고 수정 목적을 설명합니다. 업체가 수정안을 보내면 요청 항목별로 처리 내용을 받습니다.
표시 크기와 누르는 영역의 차이
버튼의 외형이 커졌다고 실제 누르는 영역도 같은 범위로 변경됐다고 판단하지 않습니다. 시안 이미지는 외형을 전달하지만, 선택 가능한 범위는 구현 방식에 따라 별도로 확인해야 합니다. 병원은 업체에 버튼 테두리와 누르는 영역의 관계를 설명하고 구현 화면에서 시험할 수 있도록 요청합니다.
담당자는 버튼 가운데뿐 아니라 가장자리에서도 같은 버튼이 선택되는지 시험합니다. 글자가 있는 부분에서만 작동하거나 여백을 누르면 반응하지 않는다면, 의도한 동작인지 업체에 묻습니다. 터치 입력에서는 어느 부분을 눌렀을 때 문제가 발생했는지 화면에 표시해 전달합니다.
주변의 다른 선택 요소까지 눌리는 경우에는 문의 버튼만 더 크게 만들라는 요청을 보류합니다. 업체가 각 요소의 선택 범위가 겹치는지 설명하도록 하고, 버튼 크기와 여백을 함께 조정하는 안을 받습니다. 외형을 유지하면서 누르는 영역만 수정할 수 있는지도 요청 사항에 포함할 수 있습니다.
마우스 반응과 키보드 표시의 차이
마우스를 올렸을 때 색이 달라지는 화면만으로 키보드 선택 표시를 승인하지 않습니다. 더블유쓰리씨는 키보드로 상호작용 요소에 도달할 수 있어야 하며 현재 초점을 가진 요소가 명확해야 한다고 설명합니다. 안내에서 제시하는 표시 예에는 키보드 이동에 따라 나타나는 테두리나 강조가 포함됩니다.
병원 담당자는 키보드로 문의 버튼에 도달한 상태를 업체와 함께 시험합니다. 현재 선택된 버튼의 테두리가 주변 배경에 묻히거나 강조가 너무 옅어 선택 상태를 알아보기 어렵다면 표시 수정을 요청합니다. 일반 상태와 키보드 선택 상태의 화면을 각각 받아 차이를 기록합니다.
키보드 표시를 버튼 색 변경만으로 처리했다면 글자 읽기에 영향을 주는지도 시험합니다. 선택 전에는 읽히던 글자가 선택 후 바탕과 비슷해지는 문제는 색 시안과 별도로 발생할 수 있습니다. 담당자는 구현 화면에서 발견한 상태를 지정하고 해당 상태의 조합을 고치도록 요청합니다.
검토용 이미지와 구현 화면의 차이
메신저로 받은 이미지의 색만으로 최종 적용 색을 판정하지 않습니다. 이미지 저장 방식이나 화면 설정이 다르면 같은 시안도 다르게 표시될 수 있으므로, 업체가 지정한 동일한 구현 화면을 기준으로 의견을 모읍니다. 색이 다르다는 요청에는 이미지 파일에서 발생한 차이인지 실제 화면에서도 발생한 차이인지 기재합니다.
제작 도중 업체가 버튼을 이미지에서 화면 요소로 다시 구현했다면 시안 승인 기록만으로 작업을 종료하지 않습니다. 담당자는 글자 두께와 테두리, 여백이 승인안과 달라졌는지 대조하고 차이가 있는 항목의 처리 설명을 받습니다. 최종 승인 기록에는 적용 화면을 식별할 정보와 승인 대상을 남깁니다.
자주 묻는 질문
병원 로고 색을 문의 버튼에 꼭 사용해야 합니까?
로고 색을 반드시 사용해야 한다는 전제로 결정할 필요는 없습니다. 병원에 별도의 브랜드 사용 규정이 있다면 업체에 전달하고, 버튼에 적용 가능한 색과 변경 가능한 범위를 설명하도록 요청합니다. 내부 승인이 필요한 색 변경은 디자인 수정과 승인 절차를 함께 정합니다.
색상 코드만 전달받으면 다른 업체도 그대로 적용할 수 있습니까?
색상 코드만으로 버튼 전체를 같은 형태로 재현하기는 어렵습니다. 병원은 글자와 바탕의 색상 정보 외에도 테두리, 글자 설정, 여백, 상태별 표현을 함께 인계하도록 요청합니다. 유지보수 업체가 달라질 예정이라면 기존 업체가 실제 적용 설정을 정리해 전달하도록 합니다.
업체가 정해진 버튼 양식만 제공하면 어떻게 합니까?
기본 양식에서 변경 가능한 항목과 추가 작업이 필요한 항목을 먼저 요청합니다. 수정할 수 없는 조건이 병원의 요구와 충돌하면 가능한 대체 형태와 작업 범위를 설명받습니다. 담당자는 비용이나 일정 협의 전에 해결되지 않는 항목을 문서에 명시합니다.
직원마다 버튼 색이 다르게 느껴지면 어떻게 합니까?
선호 의견과 읽기 어려움을 지적하는 의견을 따로 기록합니다. 선호는 내부 의사결정으로 처리하되, 읽기 어려움은 발생한 화면과 상태를 받아 업체에 전달합니다. 회의에서는 단순한 찬반 대신 어떤 글자나 표시를 알아내기 어려웠는지 설명하도록 요청합니다.
홈페이지 배경을 변경할 때 버튼도 다시 승인해야 합니까?
배경 변경으로 버튼의 표현에 영향을 받는 화면은 재승인 대상으로 정할 수 있습니다. 담당자는 변경 작업의 범위를 받을 때 버튼 관련 조정이 포함되는지 묻고, 작업 후 승인할 화면을 지정합니다. 유지보수 요청서에는 배경 작업 완료와 버튼 승인 완료를 별도 항목으로 기록합니다.