Codex Browser Use가 우리 사이트를 클릭한다

Codex의 브라우저가 우리 사이트를 직접 클릭하기 시작했어요

2026년 4월 마지막 주 r/codex에서 가장 표를 많이 받은 글의 제목이 인상적이에요. "가장 저평가된 Codex App 기능". 본문은 단 두 줄로 정리돼요. "Codex의 브라우저가 UI 작업을 직접 검증하고 수정한다. 이게 신세계다." Anthropic의 Computer Use, OpenAI의 Atlas, Codex Browser Use가 거의 동시에 메인스트림으로 들어왔고, 이제 진짜로 AI 에이전트가 우리 웹사이트의 첫 번째 사용자가 되는 시대가 왔어요.

지금까지 우리는 사람을 위해 UX를 설계했어요. 하지만 2026년 하반기부터는 "화면을 직접 보고 클릭하는 AI 에이전트"가 트래픽의 일부를 차지해요. 검색 엔진 봇처럼 텍스트만 긁어 가던 시대가 아니라, 마우스 좌표·픽셀·DOM·접근성 트리를 동시에 보면서 "장바구니에 담아 결제까지 마쳐 줘" 같은 명령을 수행하는 시대요. 디자이너와 PM이 가장 먼저 던져야 할 질문은 이거예요. "우리 사이트는 사람한테만 친절하게 만들어져 있나요?"

AI 에이전트가 사이트를 쓸 때 실제로 막히는 7가지

1) 아이콘만 있는 버튼 (라벨 없는 SVG)

"♡" 아이콘 하나로 좋아요·찜·팔로우 세 가지를 다 표현하는 디자인이 흔해요. 사람은 컨텍스트로 추론하지만, 에이전트는 보통 접근성 라벨(aria-label)이나 시각 인식 모델로 분류해요. 라벨이 없으면 시각 모델이 매번 추측을 해야 하고, 정확도가 70%로 떨어지죠. 결제·환불 같은 중요 동작에서는 치명적이에요.

2) 호버에 숨어 있는 메뉴

데스크톱 헤더의 드롭다운 메뉴 중 마우스 호버 시에만 등장하는 것이 많아요. Computer Use 계열 에이전트는 보통 클릭만 시뮬레이션해요. 호버 트리거를 못 잡으면 메뉴 자체가 존재하지 않는 것처럼 보여요. 해결책은 간단해요. 호버 + 키보드 포커스 + 클릭 모두에 대응하는 dual-trigger 패턴.

3) 모달 안의 모달, 그리고 사라진 닫기 버튼

"확인" → "쿠폰 적용?" → "주의사항" 3단 모달이 쌓이는 결제 플로우가 있어요. 사람은 ESC 키 한 번에 빠져나오지만, 에이전트는 각 모달의 닫기 버튼을 시각적으로 찾아야 해요. 모달의 X 버튼이 회색 배경에 흰 X라면 시각 모델이 놓쳐요. 닫기 버튼은 항상 같은 위치, 같은 스타일, aria-label="닫기"로 통일해 두는 게 안전해요.

4) 캡차와 "사람 인증"

지금까지 캡차의 적은 봇이었어요. 이제는 사용자 본인이 위임한 정당한 에이전트도 막혀요. 한국어 보안 문구("로봇이 아닙니다") 같은 추론은 LLM이 풀어 버리니 의미가 없어졌고, hCaptcha·reCAPTCHA의 시각 챌린지는 에이전트의 결제 플로우를 막아요. 로그인된 사용자에게는 캡차를 면제하거나, Browser Use 헤더(`Sec-CH-UA-Bots`)를 신뢰하는 화이트리스트를 준비해야 해요.

5) 의미 없는 div 떡칠과 시맨틱 구조 부재

React·Vue 컴포넌트 라이브러리를 그대로 쓰다 보면 <div onClick> 천국이 돼요. 시각 모델은 그래도 작동하지만 토큰 비용이 폭증해요. 한 페이지를 접근성 트리로 직렬화하면 에이전트는 1/10 토큰으로 같은 작업을 해요. <button>·<nav>·<main>·<dialog>를 제대로 쓰는 게 SEO뿐 아니라 AX 비용 절감 항목이 됐어요.

6) 스크롤 하이재킹과 무한 스크롤

"한 화면에 한 섹션" 스크롤 잭킹은 에이전트가 다음 섹션으로 못 넘어가게 만들어요. 무한 스크롤도 마찬가지예요. 에이전트는 보통 "검색 결과 5번째 항목 클릭" 같은 명령을 받는데, 인덱스가 안정적이지 않으면 매번 첫 결과만 누르게 돼요. 페이지네이션 또는 영구 URL 앵커가 안전해요.

7) "다음 단계" 버튼이 비활성화 상태로 시작하는 폼

입력값을 다 채우면 활성화되는 디자인이 깔끔해 보이지만, 에이전트는 "다음 단계 버튼이 보이지 않는다"고 판단하고 멈춰요. 차라리 활성화는 유지하되 검증 메시지를 보여 주는 패턴이 에이전트 친화적이에요.

UX 디자이너가 다음 분기에 점검해야 할 5가지

2027년 검색 트래픽의 30%는 AI 에이전트일 거예요. SEO를 GEO로 확장한 것처럼, UX는 이제 AX(Agent Experience)를 같이 설계해야 해요. 사람에게 친절하고 에이전트에게도 친절한 사이트가 트래픽을 가져가요.

UX 다음 단계가 막막하다면

"우리 사이트는 사람을 위해 잘 만들어졌는데 에이전트가 못 쓴다"는 말이 슬슬 들리기 시작하는 시점이에요. 포텐랩은 UX 진단부터 접근성 트리 감사, AX 친화 리디자인, Playwright 기반 회귀 테스트 셋업까지 한 번에 잡아 드려요. 사람과 에이전트 모두 막히지 않는 사이트를 만들고 싶다면 포텐랩 상담 신청하기를 눌러 주세요.

함께 읽으면 좋은 글