누구나 쓸 수 있게 만들기

눈이 침침한 손님, 색을 구분하기 어려운 손님, 손이 떨려 버튼을 잘 못 누르는 손님도 주문을 끝까지 마칠 수 있게 만드는 일이에요. 가게 입구의 문턱을 낮추는 것과 같고, 법으로 정해진 부분도 있어요.

쉽게 말하면

가게 입구에 경사로를 놓는 일과 똑같아요. 처음엔 휠체어 손님을 생각해서 놓지만, 정작 그 경사로를 제일 많이 쓰는 건 유모차 끌고 온 손님, 캐리어 든 손님, 짐수레 미는 배달 기사예요. 문턱 하나 치웠을 뿐인데 들어오는 사람이 늘어요. 화면도 같아요. 글씨를 키우고 색을 진하게 하면 시력이 나쁜 손님만 편해지는 게 아니라, 햇빛 아래에서 폰을 보는 손님도, 한 손에 짐을 든 손님도 편해져요.

그래서 이 일은 착한 일이 아니라 문턱 낮추기예요. 못 들어와서 그냥 나간 손님은 항의도 안 하고 후기도 안 남겨요. 조용히 사라져요. 매출에서 제일 안 보이는 손실이 그거예요.

문턱이 있는 주문 화면
연한 회색 글씨, 아주 작게 [주문] 버튼은 손톱만 하게 품절은 빨간 칸으로만 표시 잘못 입력하면 빨간 테두리만

어르신은 글씨를 못 읽고, 색을 구분하기 어려운 손님은 칸이 다 똑같아 보여요. 무엇을 잘못 적었는지도 모른 채 창을 닫아요.

문턱을 낮춘 주문 화면
검정에 가까운 글씨, 넉넉하게 [주문하기] 버튼은 손가락만 하게 빨간 칸 안에 "품절" 글자도 함께 "전화번호는 숫자만 적어 주세요"

누가 봐도 읽히고, 눌러야 할 곳이 눈에 띄고, 막혔을 때 무엇을 고치면 되는지 글로 알려 줘요. 전화 응대 시간이 줄어요.

이게 그거예요: 증상으로 알아보기

이 문제는 "접근성 문제입니다"라는 이름을 달고 오지 않아요. 늘 다른 말로 와요. 아래 왼쪽 칸이 사장님이 실제로 듣거나 느끼는 말이에요. 하나라도 익숙하면 이 문서가 맞게 온 거예요.

손님이 하는 말, 내가 느끼는 것실제로 벌어진 일누가 막히나
"홈페이지 글씨가 깨알 같아서 못 하겠네. 전화로 하면 안 되나"본문 글씨가 작고, 회색이 옅어서 밝은 곳에서 사라져요노안이 온 40대 후반 이상, 밖에서 폰 보는 모든 손님
"어떤 게 되는 날인지 모르겠어요"가능·마감을 초록과 빨강 칸으로만 구분했어요. 글자가 없어요색을 구분하기 어려운 손님, 흑백으로 인쇄한 사람
"눌렀는데 딴 게 눌려요"버튼이 작고 버튼끼리 붙어 있어요손이 떨리는 손님, 버스에서 한 손으로 쓰는 손님
"메뉴가 뭐가 있는지 안 읽혀요"메뉴판을 예쁜 그림 한 장으로 올렸어요. 그 안의 글자는 기계가 못 읽어요화면을 소리로 듣는 손님, 검색엔진, 글자를 복사하려던 손님
"결제가 자꾸 안 넘어가요"입력이 틀렸을 때 빨간 테두리만 생겨요. 무엇이 왜 틀렸는지 글이 없어요거의 모든 손님. 특히 소리로 듣는 손님은 아무 일도 안 일어난 것처럼 느껴요
폰 설정에서 글씨를 키웠더니 화면이 겹쳐 보인다글자 크기가 고정돼 있거나, 칸이 글자보다 먼저 잘려요글씨를 키워 쓰는 손님 전부. 생각보다 아주 많아요
"손가락으로 벌려도 확대가 안 돼요"화면 확대를 못 하게 막아 둔 설정이 들어가 있어요작은 글씨를 확대해서 읽던 손님
"화면이 번쩍여서 어지러워요"자동으로 넘어가는 배너나 큰 움직임이 계속 돌아요어지럼증이 있는 손님, 멀미가 잦은 손님

여덟 줄의 공통점이 하나예요. 정보를 한 가지 방법으로만 전달했다는 것. 색으로만, 사진으로만, 테두리 색으로만, 마우스로만요. 길을 하나 더 놓아 주면 대부분 풀려요.

손님은 원인을 말해 주지 않아요

손님은 "대비가 부족하네요"라고 말하지 않아요. "글씨가 안 보여요"라고 하거나, 아무 말 없이 전화를 걸어요. 그래서 전화·문의로 들어온 말을 그대로 적어 두는 것이 점검 목록이 돼요. 같은 말이 세 번 오면 그건 화면 문제예요.

AI에게 그대로 말하면 되는 문장

사장님이 직접 고칠 일은 없어요. 증상을 그대로 말로 시키면 돼요. 아래 가운데 칸을 복사해서 그대로 붙여도 됩니다. 전문 용어를 외울 필요는 전혀 없어요.

이런 증상이면이렇게 말해요말한 뒤 이렇게 확인해요
글씨가 작고 흐리다"본문 글씨를 더 키우고, 연한 회색 글씨는 검정에 가깝게 진하게 바꿔줘"폰 밝기를 낮추고 밖에 나가서 봐요. 그래도 읽히면 통과
색으로만 구분했다"색으로만 구분한 곳에 글자 표시를 같이 넣어줘. 색이 안 보여도 뜻이 통하게"폰을 흑백 모드로 바꾸고 봐요. 뜻이 통하면 통과
버튼을 잘못 누른다"누르는 버튼을 손가락이 닿는 크기로 키우고, 버튼끼리 간격을 벌려줘"한 손으로, 걸어가면서 눌러 봐요
사진에 설명이 없다"정보를 담은 사진마다 한 줄 설명을 넣어줘. 장식용 사진은 설명을 비워줘"인터넷을 끊고 새로 고쳐요. 사진 자리에 글자가 뜨면 통과
메뉴가 그림 한 장이다"사진 속에 있는 글자를 화면 글자로도 한 번 더 적어줘"메뉴 이름을 마우스로 긁어 봐요. 선택되면 통과
왜 막혔는지 안 알려 준다"입력이 잘못됐을 때 빨간 테두리만 말고, 무엇이 왜 잘못됐는지 글로 알려줘"일부러 틀리게 적고 보내 봐요
마우스 없이는 못 다닌다"탭 키만으로 화면 전체를 다닐 수 있게 하고, 지금 선택된 곳에 테두리 표시를 남겨줘"마우스를 손에서 놓고 탭 키만 스무 번 눌러 봐요
글씨를 키우면 깨진다"브라우저 글씨를 두 배로 키워도 글자가 겹치거나 잘리지 않게 해줘"브라우저에서 확대를 200%로 올려 봐요
확대가 막혀 있다"손님이 손가락으로 화면을 확대할 수 있게 막아 둔 설정을 풀어줘"폰에서 손가락으로 벌려 봐요
화면이 번쩍인다"자동으로 넘어가는 배너는 멈춤 버튼을 넣고, 손님 기기가 움직임 줄이기 설정이면 효과를 멈추게 해줘"배너를 멈출 수 있는지 눈으로 확인

한 번에 열 개를 시키지 마세요

열 줄을 한 문장에 몰아 넣으면 몇 개는 조용히 빠져요. 두세 개씩 끊어서 시키고, 그때마다 화면을 눈으로 보고 넘어가요. 처음부터 이 문장들을 프롬프트에 넣어 두면 아예 문턱이 낮은 화면으로 나와요.

더 깊게 손보고 싶으면 항목별 문서로 가세요. 색 문제는 색 대비, 사진 설명은 사진에 설명 붙이기, 글씨는 글꼴과 글씨 크기, 막혔을 때 안내 문구는 입력 확인 쪽이 자세해요.

사장님이 실제로 겪는 장면

장면 1 · 단골 어르신 손님이 전화를 걸어왔다

예약은 홈페이지로 하라던데, 글씨가 깨알 같아서 못 하겠네. 그냥 전화로 하면 안 되나?

이 전화 한 통에 사장님 시간 5분이 나가요. 하루 다섯 통이면 한 달에 열두 시간이에요. 글씨 크기와 색만 손봐도 이 손님은 혼자서 예약해요. 문턱 낮추기가 인건비를 줄이는 지점이 정확히 여기예요.

장면 2 · 화면을 소리로 듣는 손님이 남긴 문의

메뉴가 전부 사진이라 뭐가 있는지 안 읽혀요. 가격만 알려주실 수 있을까요?

화면을 못 보는 손님은 글자를 소리로 바꿔 주는 프로그램으로 웹을 써요. 그 프로그램은 사진 속 글자를 못 읽어요. 이렇게 문의를 남겨 주는 손님은 드문 경우예요. 대부분은 아무 말 없이 다른 가게로 갑니다.

확인해 보세요

예약 가능은 초록 칸, 마감은 빨강 칸으로만 표시했어요. 무엇을 더하면 될까요?

지금은 신경 쓰지 않아도 되는 때

정직하게 말할게요. 이 주제는 겁주기 쉬운 주제예요. 점검 도구를 돌리면 경고가 수십 개씩 나오니까요. 그런데 손님이 하루 열 명인 가게에서 그 경고를 전부 잡는 건 시간 낭비예요. 그 시간에 손님을 한 명 더 데려오는 게 맞아요.

이런 상황이면지금 안 해도 되는 것대신 이것만
아직 공개도 안 한 시험용 화면이다전부. 화면이 몇 번 더 바뀔 텐데 지금 다듬으면 그 작업이 버려져요만들 때 프롬프트에 "글씨 크고 대비 진하게" 한 줄만 넣어 둬요
나 혼자, 또는 직원 두 명만 쓰는 내부용 도구다인증·전문 점검·모든 항목 대응쓰는 사람 눈에 맞추면 끝이에요. 그게 정답이에요
손님이 하루 열 명 남짓이다점검 도구 경고 전부 잡기, 이미지 용량 줄이기 같은 세부 최적화돈이 오가는 길 하나만 봐요. 아래에 그 길 목록이 있어요
공공기관 납품이나 입찰 계획이 없다웹 접근성 품질인증 심사. 심사비와 개선 작업이 따로 들어요인증 없이도 실무 문제는 대부분 사라져요. 인증은 필요해질 때 해요
손님층이 특정 연령대로 아주 좁다모든 상황을 다 상상해서 대비하기실제 손님이 쓰는 기기 두세 개로만 직접 해 봐요

대신 규모와 상관없이 미루면 안 되는 길이 있어요. 돈과 약속이 오가는 네 곳이에요. 주문·결제 화면, 예약 화면, 로그인·본인 확인, 문의하기. 이 네 곳에서 막힌 손님은 다시 오지 않고, 그 손해는 손님 한 명이 아니라 한 건의 매출로 계산돼요.

판단 기준은 하나예요

"이걸 안 고치면 손님이 돈을 못 낼 수 있나?" 답이 예면 지금 고쳐요. 답이 아니오면 개업 점검표에 적어 두고 나중에 해요. 겁이 나서 하는 일보다, 순서를 알고 미루는 일이 더 잘 굴러가요.

법으로 정해진 부분

이 일은 권장 사항만은 아니에요. 우리나라에는 장애인차별금지 및 권리구제 등에 관한 법률이 있고, 웹사이트를 포함한 정보 접근에 정당한 편의를 제공하도록 정하고 있어요. 공공기관은 오래전부터 의무였고, 민간에도 업종과 규모에 따라 단계적으로 적용돼 왔어요.

실제로 화면을 소리로 듣는 손님들이 온라인 쇼핑몰을 상대로 소송을 내서, 법원이 사이트 개선을 인정한 사례가 알려져 있어요. 즉 과태료보다 소송과 평판이 먼저 오는 종류의 문제예요. 다만 판결은 사건마다 다르니 내 경우에 그대로 적용된다고 생각하면 안 돼요.

장면 3 · 공공기관 납품 담당자가 보내온 조건

제출 전에 웹 접근성 인증 사본을 첨부해 주셔야 합니다.

동네 가게에는 안 오는 요구지만, 공공기관·학교·큰 회사에 납품하는 순간 조건표에 등장해요. 인증은 심사 기관에 신청해서 받는 절차예요. 공고문 조건을 먼저 읽고, 필요하면 기간과 비용을 미리 확인하세요. 급하게 준비하기 어려운 항목이에요.

적용 대상과 기준은 꼭 직접 확인하세요

어떤 업종이 언제부터 대상인지, 어디까지 갖춰야 하는지는 개정될 수 있어요. 이 문서의 설명으로 판단하지 마세요. 내 사업이 대상인지는 소관 부처 안내와 국가인권위원회 안내를 확인하거나, 변호사에게 물어보세요. 인증이 필요하면 심사 기관의 공식 안내가 기준이에요.

그렇다고 겁먹을 필요는 없어요. 동네 가게 홈페이지에 인증 마크를 붙일 일은 드물어요. 앞의 증상표에 나온 것만 손봐도 실무에서 문제가 되는 부분의 대부분은 사라져요. 인증은 그다음 이야기예요.

돈 안 드는 점검 세 가지

전문 도구를 사기 전에, 오늘 5분이면 끝나는 점검이 세 개 있어요. 기계가 못 잡는 것을 이 세 개가 잡아요.

  1. 1밖에 나가서 보기. 폰 밝기를 절반으로 낮추고 밝은 곳에서 내 화면을 봐요. 여기서 사라지는 글씨가 실전에서도 사라지는 글씨예요.
  2. 2흑백으로 보기. 폰 설정에서 화면을 흑백으로 바꾸고 주문을 끝까지 해 봐요. 색이 빠져도 뜻이 통하면 색 문제는 통과예요.
  3. 3글씨를 두 배로 키워 보기. 브라우저 확대를 200%로 올려요. 글자가 겹치거나 버튼이 화면 밖으로 나가면 그게 고칠 자리예요.
  4. 4마우스를 놓고 탭 키만 눌러 보기. 주문 버튼까지 갈 수 있는지, 지금 어디에 있는지 테두리로 보이는지 확인해요.

직접 해보기

스튜디오에서 내 화면 문턱을 낮춰 보세요

만든 화면에 대고 이렇게 말해 보세요. "본문 글씨를 키우고 연한 회색 글씨는 진하게 바꿔줘. 색으로만 표시한 곳에는 글자를 같이 넣어줘." 바뀐 화면을 밝은 곳에서 다시 보면 차이가 바로 보여요.

스튜디오 열기

하나 더

손님이 하루 열 명인 가게예요. 지금 무엇을 먼저 해야 할까요?

자주 묻는 것

Q. 제 손님 중에 그런 분이 몇이나 될까요?
생각보다 훨씬 많아요. 눈이 침침한 어르신, 색을 구분하기 어려운 분, 다친 팔로 한 손만 쓰는 분에 더해서 밝은 데서 폰 보는 손님, 흔들리는 차 안에서 예약하는 손님, 소리를 못 켜는 손님까지 전부 같은 이득을 봐요. 특별한 손님을 위한 배려가 아니라 평범한 상황을 위한 준비예요.
Q. 예쁜 디자인이랑 부딪히지 않나요?
연한 회색 글씨가 세련돼 보이는 건 사실이에요. 다만 그 유행은 큰 모니터 앞의 젊은 눈을 기준으로 만들어진 거예요. 고급스러움은 여백·정렬·서체로 만들고, 글자 색은 양보하지 않는 게 정답이에요. 진한 글씨로도 얼마든지 세련될 수 있어요.
Q. AI가 알아서 해 주지 않나요?
기본적인 것은 꽤 지켜요. 다만 사진 설명이나 색 표시는 사장님만 아는 정보라서 비어 있을 수 있어요. 만든 뒤에 위의 문장표에서 두세 개를 골라 한 번 더 시키면 확실히 좋아져요. 처음부터 프롬프트에 넣어 두는 게 제일 편해요.
Q. 다 고치려면 돈이 많이 들까요?
증상표에 있는 것들은 대부분 설정과 문구를 바꾸는 수준이라 비용이 거의 안 들어요. 돈이 드는 건 공식 인증 단계예요. 심사 비용과 개선 작업이 따로 들어가니, 인증이 지금 꼭 필요한 상황인지부터 확인하는 게 순서예요.
Q. 점검 도구가 통과라고 하면 끝난 건가요?
아니에요. 기계는 "사진 설명 칸이 비었다" 같은 것만 잡아요. 설명이 엉뚱한지, 순서가 이상한지는 사람만 알아요. 도구 통과는 시작점이고, 위의 점검 세 가지가 나머지를 잡아요.
Q. 폰만 신경 쓰면 되나요?
손님 대부분이 폰으로 오니 폰부터가 효율은 좋아요. 다만 화면이 커지고 작아질 때 글씨와 버튼이 어떻게 변하는지는 화면 크기 대응 쪽 이야기와 이어져요. 폰에서 잘 되면 큰 화면은 대개 따라와요.
Q. 손님이 직접 글씨 크기 버튼을 눌러 키우게 하면요?
있어도 나쁘진 않지만 그게 해결은 아니에요. 손님은 이미 자기 폰 설정에서 글씨를 키워 놓고 다녀요. 그 설정을 내 화면이 따라가게 만드는 쪽이 먼저예요.

더 깊이 (안 읽어도 괜찮아요)

화면을 소리로 듣는 프로그램은 이렇게 읽어요 · 이 프로그램은 화면을 사진처럼 보는 게 아니라 글의 뼈대를 따라 읽어요. 큰 제목과 작은 제목의 순서를 훑어서 목차처럼 건너뛰고, 버튼에 붙은 이름을 읽어 무엇을 누르는지 알려 줘요. 그래서 제목을 그냥 크고 굵은 글씨로만 만들면 이 프로그램에는 제목으로 안 보여요. 신문에서 기사 제목과 본문이 구분되는 것과 같은 뼈대가 화면 안에도 따로 있어야 해요. 화면에 보이는 모습과 기계가 읽는 뼈대가 어긋나는 것, 그게 이 분야에서 제일 자주 나는 사고예요.

마우스 없이 다니는 손님의 경로 · 손이 불편한 분이나 마우스를 쓸 수 없는 상황에서는 키보드의 탭 키로만 화면을 돌아다녀요. 여기서 두 가지가 자주 망가져요. 하나는 지금 어디에 있는지 표시하는 테두리를 못생겼다고 지워 버리는 것. 그러면 그분들은 눈을 감고 가게를 걷는 셈이 돼요. 지우지 말고 예쁘게 바꾸는 게 맞아요. 다른 하나는 순서가 화면과 어긋나는 것이에요. 눈에는 위에서 아래로 보이는데 탭 키는 엉뚱한 데로 튀는 경우가 있어요. 팝업 창에 들어갔다가 못 나오는 것도 같은 종류예요.

숫자 기준과 그 한계 · 글자와 배경의 색 차이는 밝기로 계산해서 숫자로 나와요. 검정 글씨에 흰 배경이 가장 큰 값이고, 회색이 옅어질수록 값이 내려가요. 본문은 4.5대 1, 큰 제목은 3대 1이 널리 쓰이는 선이에요. 여기서 중요한 해석은 작은 글씨일수록 색 차이가 더 중요하다는 것이에요. 자세한 계산과 도구는 색 대비 쪽에 있어요. 다만 이 숫자를 다 맞춰도 "쓰기 편한가"는 별개예요. 숫자는 최저선이고, 실제 판단은 손님 기기로 직접 해 보는 것이 기준이에요.

이것만 기억하세요

  • ·문턱 낮추기예요. 경사로는 휠체어만이 아니라 유모차와 짐수레도 씁니다
  • ·증상으로 알아보고, 증상 그대로 말로 시키면 돼요. 용어를 외울 필요 없어요
  • ·판단 기준 하나: 이걸 안 고치면 손님이 돈을 못 내나. 아니면 미뤄도 돼요
  • ·손님 열 명 가게에 인증과 세부 최적화는 시간 낭비예요. 주문·결제·예약·문의만 봐요
  • ·법으로 정해진 부분이 있어요. 내 업종이 대상인지는 소관 부처와 변호사에게 확인하세요
VibeCampus新規ビルド