AI가 고객 대신 예약 버튼을 누르려면 홈페이지에 무엇이 있어야 할까?
버튼과 입력 칸에 이름표를 붙이면 AI가 홈페이지를 읽고 누르기 쉬워진다
AI가 고객 대신 홈페이지에 들어가 예약하고 문의 양식까지 채우는 일이 시작되고 있다. 이때 홈페이지의 버튼과 입력 칸에 코드로 된 이름표가 없으면 AI가 무엇을 눌러야 하는지 알아보기 어렵다. 2026년 2월 세계 홈페이지 100만 곳을 검사한 결과, 51%에 이름표 없는 입력 칸이 있었고 30.6%에는 이름 없는 버튼이 있었다.
AI가 대신 예약하게 하려면 버튼과 입력 칸마다 코드로 이름을 붙여야 한다.
우리 홈페이지의 예약 버튼도 AI가 알아볼까?
사람이 보기에는 예약 버튼이 멀쩡해 보여도 AI에게는 그렇지 않을 수 있다. 「예약하기」라는 글자 없이 그림만 있는 버튼이라면 AI가 그 버튼의 역할을 알아내기 어렵다. 입력 칸 옆에 「연락처」라고 써 있기만 하고 그 글자와 입력 칸이 코드로 연결돼 있지 않다면, AI는 그 칸이 무엇을 넣는 곳인지 정확히 알기 어렵다.
구글이 2026년 4월 1일 갱신한 개발자 안내서는 AI가 홈페이지를 읽는 방법을 세 가지로 나눈다. 화면을 찍어 보는 방법, HTML 코드를 읽는 방법, 접근성 트리를 읽는 방법이다. 접근성 트리는 버튼과 입력 칸의 역할·이름·상태를 모아 둔 목록으로, 원래는 시각장애인용 화면 낭독기를 위해 만든 것이다.
| 보는 방법 | AI가 얻는 것 | 약한 점 |
|---|---|---|
| 화면 찍기(스크린샷) | 색· | 느리고 처리 비용이 크다 |
| HTML 코드 읽기 | 요소가 어떻게 묶였는지 | 버튼처럼 꾸민 div는 버튼인지 모른다 |
| 접근성 트리 읽기 | 역할· | 이름표가 없으면 빈칸으로 보인다 |
구글은 AI 에이전트가 이 방법들을 섞어 쓴다고 설명한다. 코드와 접근성 트리로 누를 수 있는 요소를 찾고, 화면 그림으로 위치를 확인하는 식이다.
오픈AI와 구글은 무엇을 하라고 하나?
오픈AI 도움말은 화면 낭독기를 돕는 ARIA 표시로 페이지 구조와 버튼·메뉴·양식을 해석한다고 적고, 버튼·메뉴·양식에 역할·이름·상태를 붙이라고 권한다. 아틀라스 브라우저는 2026년 8월 9일 작동을 멈췄지만, 오픈AI는 브라우저에서 일을 대신하는 에이전트 기능을 챗GPT 데스크톱 앱과 코덱스로 옮긴다고 밝혔다.
구글도 기본 HTML 태그를 제대로 쓰라고 안내한다. 버튼처럼 꾸민 div보다 실제 button이나 a 태그를 쓰고, 입력 칸에는 label을 연결하라고 권한다. 투명한 덮개처럼 누르기를 방해하는 요소를 없애라는 안내도 있다.
| 회사 | 문서 | 권하는 것 |
|---|---|---|
| 오픈AI | 게시자· | 버튼· |
| 구글 | 「에이전트 친화 사이트 만들기」(2026년 4월 1일 갱신) | div 대신 button· |
| 구글 | 같은 문서 | 누르는 요소는 8제곱픽셀보다 크게, 투명 덮개 없애기 |
| 구글 | 같은 문서 | 상품마다 버튼 위치가 흔들리지 않게 |
구글은 이 안내서 끝에 「에이전트를 위해 권하는 것은 모두 사람에게도 더 좋은 사이트를 만든다」고 적었다.
다른 홈페이지들은 얼마나 준비돼 있을까?
미국 유타주립대 산하 웹에임은 2026년 2월 세계 상위 홈페이지 100만 곳을 자동 검사했다. 95.9%의 홈페이지에서 웹 접근성 기준 위반이 발견됐고, 한 페이지의 오류는 평균 56.1개로 1년 전보다 10.1% 늘었다.
| 문제 | 2025년 | 2026년 |
|---|---|---|
| 글자와 배경 대비 부족 | 79.1% | 83.9% |
| 사진 대체 글 없음 | 55.5% | 53.1% |
| 입력 칸 이름표 없음 | 48.2% | 51% |
| 빈 링크 | 45.4% | 46.3% |
| 빈 버튼 | 29.6% | 30.6% |
| 문서 언어 표시 없음 | 15.8% | 13.5% |
홈페이지 한 곳의 입력 칸은 평균 6.9개였고, 그중 33.1%에는 이름표가 없었다. ARIA를 쓴 페이지의 평균 오류는 59.1개로 쓰지 않은 페이지의 42개보다 많았다. 표시를 많이 붙인다고 읽기 쉬워지는 것은 아니다.
한국어 홈페이지는 괜찮을까?
웹에임이 조사한 한국어 홈페이지 6,628곳에서는 페이지당 오류가 평균 94.6개였다. 전체 평균보다 68.7% 많다. 과학기술정보통신부가 2026년 3월 26일 발표한 실태조사에서는 8개 업종 웹사이트 1,000곳의 웹 접근성 평균이 70.4점이었다.
| 조사 | 대상 | 결과 |
|---|---|---|
| 웹에임 2026 | 한국어 홈페이지 6,628곳 | 페이지당 오류 94.6개(평균 대비 +68.7%) |
| 웹에임 2026 | 영어 홈페이지 52만 1,826곳 | 페이지당 오류 46.0개(−18.0%) |
| 과기정통부 조사(2026년 3월 발표) | 8개 업종 1,000곳 | 평균 70.4점(전년 대비 +3.7점) |
| 과기정통부 조사(2026년 3월 발표) | 금융· | 79.0점 / 65.7점 |
두 조사는 잣대가 다르다. 동네 가게 홈페이지만 따로 잰 숫자는 아직 없다. 다만 국내 조사에서 쇼핑몰이 속한 도매·소매업이 65.7점으로 가장 낮았다. 주문이나 예약 양식을 쓰는 가게라면 먼저 확인해 볼 이유가 있다.
AI 에이전트는 지금 얼마나 잘 누를까?
UC버클리·미시간대 연구진이 일상 과제 60개를 AI 에이전트에게 맡긴 실험에서는 마우스로 누르게 했을 때 성공률이 78.3%였지만, 키보드만 쓰게 하자 41.67%, 화면 확대 상태에서는 28.3%로 떨어졌다.
| 조건 | 과제 성공률 |
|---|---|
| 평소(마우스로 누르기) | 78.3% |
| 키보드만 사용 | 41.67% |
| 화면 확대 상태 | 28.3% |
인터넷에는 이 숫자를 「접근성이 나쁜 사이트에서 성공률이 떨어졌다」고 옮긴 글이 있다. 원래 실험은 사이트가 아니라 에이전트의 조작 방식을 바꾼 것이다. 지금의 에이전트가 아직 완벽하지 않다는 뜻이고, 그래서 화면과 코드 양쪽에서 헷갈리지 않게 만들어 두는 편이 안전하다.
우리 가게는 무엇부터 고치면 될까?
「예약하기」 같은 기능은 글자가 든 button이나 a 태그로 만들고, 「이름」, 「연락처」, 「희망 날짜」 같은 입력 칸은 label과 연결한다. 「자세히」 대신 「가격표 보기」처럼 무엇을 하는 링크인지 알 수 있게 쓴다. 예약 창을 덮는 팝업이나 투명 덮개는 없애고, HTML의 lang 속성을 ko로 표시한다. ARIA는 기본 태그를 정리한 다음에 덧붙인다.
| 할 일 | 근거 |
|---|---|
| 예약· | 빈 버튼 30.6%, 구글 안내 |
| 입력 칸마다 「이름」「연락처」「희망 날짜」 이름표를 label로 연결 | 이름표 없는 입력 칸 33.1% |
| 「자세히」 대신 「가격표 보기」처럼 링크 글자 쓰기 | 모호한 링크 글자 15.2%, WCAG 2.4.4 |
| 예약 창을 덮는 팝업· | 구글 안내 |
| html 태그의 lang 속성을 ko로 표시 | 언어 표시 없음 13.5%, WCAG 3.1.1 |
| ARIA를 덧붙이기 전에 기본 태그부터 | ARIA 쓴 페이지 오류 59.1개 대 42개 |
점검은 무료로 할 수 있다. 웹에임의 WAVE 검사 도구에 주소를 넣으면 빈 버튼과 이름표 없는 입력 칸이 표시되고, 크롬 개발자 도구에서는 접근성 트리를 직접 볼 수 있다. 이렇게 고친 홈페이지는 시각장애 고객과 글씨를 키워 보는 나이 든 고객에게도 그대로 도움이 된다.
① 2026년 2월 홈페이지 100만 곳 중 51%에 이름표 없는 입력 칸, 30.6%에 빈 버튼이 있었다. ② 오픈AI와 구글은 AI 에이전트가 화면 낭독기용 이름표(ARIA·접근성 트리)를 읽는다고 안내한다. ③ 한국어 홈페이지 6,628곳의 오류는 평균 94.6개로 전체 평균보다 68.7% 많았다. ④ 국내 1,000곳 평균은 70.4점이고 도매·소매업이 65.7점으로 가장 낮았다.
같이 읽을 글
- 오픈AI가 브라우저를 접으면 AI도 홈페이지를 안 볼까?
- 장보는 AI가 쇼핑몰에 오면 무슨 일이 생길까?
- AI가 물건을 사 주면 우리 가게는 어디에 있어야 할까?
- 사진 뒤에 글씨를 쓰듯이 — AI에게 사진과 영상을 읽히는 법
자료 출처
- 웹에임(WebAIM) 「The WebAIM Million — The 2026 report on the accessibility of the top 1,000,000 home pages」(2026년 2월 조사·3월 30일 갱신, 상위 홈페이지 100만 곳, WAVE 자동 검사) — WCAG 위반 95.9%·오류 56.1개·여섯 가지 오류 비율·입력 칸 6.9개·33.1%·ARIA 59.1 대 42·한국어 6,628곳 94.6개
- 오픈AI 도움말 「Publishers and Developers - FAQ」(2026년 9월 확인) — 아틀라스는 ARIA 표시로 페이지 구조와 버튼·메뉴·양식을 해석, WAI-ARIA 권장
- 오픈AI 도움말 「Evolving Atlas into ChatGPT for browser-based agentic work」(2026년 9월 확인) — 아틀라스 2026년 8월 9일 종료, 브라우저 에이전트 기능은 챗GPT·코덱스로
- 구글 web.dev 「Build agent-friendly websites」(2026년 4월 1일 갱신) — 에이전트가 보는 세 방법(스크린샷·HTML·접근성 트리), button·a 태그, label 연결, 8제곱픽셀, 투명 덮개 금지, WebMCP
- W3C 「Web Content Accessibility Guidelines (WCAG) 2.2」(2024년 12월 12일 권고안) — 4.1.2 이름·역할·값, 3.3.2 이름표, 2.4.4 링크 목적, 3.1.1 페이지 언어, 1.4.3 대비 4.5:1
- 이투데이 「과기정통부, 디지털 정보격차‧웹 접근성‧스마트폰 과의존 실태조사…디지털포용 수준 개선 흐름」(2026년 3월 26일, 8개 업종 웹사이트 1,000곳) — 평균 70.4점·+3.7점·금융 79.0점·도소매 65.7점
- Mohanbabu·Natalie·Kim·Guo·Pavel 「A11y-CUA Dataset: Characterizing the Accessibility Gap in Computer Use Agents」 arXiv 2602.09310(2026년 2월, UC버클리·미시간대, 과제 60개) — 에이전트 성공률 평소 78.3%·키보드만 41.67%·확대 28.3%
작성일
← 칼럼 목록