AI 에이전트도 길을 잃지 않는 웹 UX: 사람에게도 쉬운 7가지 점검
해외에서는 사이트가 AI 에이전트에게 발견되고 읽히며 작업까지 이어질 수 있는지 점검하는 도구가 나왔습니다. 복잡한 새 규격보다 먼저, 버튼·라벨·상태·문서 구조를 사람과 에이전트 모두 이해하게 만드는 방법을 정리합니다.
사람이 직접 페이지를 찾고 클릭하던 웹에는 새로운 방문자가 생겼습니다. 사용자를 대신해 정보를 찾고, 비교하고, 폼을 채우려는 AI 에이전트입니다. Cloudflare는 2026년 Agent Readiness 점수를 공개하며 사이트의 발견 가능성, 콘텐츠, 봇 접근 제어, 기능을 나눠 점검한다고 설명했습니다. Google의 web.dev 가이드는 에이전트가 스크린샷, HTML, 접근성 트리로 사이트를 이해할 수 있다고 안내합니다.
이 변화가 화려한 인터페이스를 버리라는 뜻은 아닙니다. 사람에게 예쁜 화면이 에이전트에게도 이해되는 구조를 가질 수 있습니다. 문제는 실제 버튼을 클릭 가능한 div처럼 꾸미거나, 중요한 상태를 색과 애니메이션에만 숨기는 경우입니다. 이 글은 검색 성과를 약속하는 AEO·GEO 기법이 아니라, 사용자가 실제 행동을 끝낼 수 있게 하는 UX 기본을 점검합니다.
에이전트는 화면만 보지 않습니다
에이전트는 보통 세 가지 신호를 함께 읽습니다. 화면의 시각적 배치, HTML의 구조, 브라우저가 만든 접근성 트리입니다. 사람 눈에는 버튼처럼 보이는 요소도 HTML에 행동 의미가 없으면 에이전트와 보조기술은 무엇을 해야 하는지 알기 어렵습니다.
그래서 첫 점검은 디자인 시안이 아니라 실제 페이지에서 시작합니다. 중요한 동작이 button 또는 a 요소인지, 입력 설명이 입력 칸과 연결되는지, 선택 후 화면에 “저장됨” 같은 결과가 보이는지 확인하세요. 이는 접근성 원칙이면서 에이전트가 작업을 끊기지 않고 이어 가는 신호입니다.
사람과 에이전트가 함께 이해하는 7가지
| 점검 | 좋은 예 | 피할 예 |
|---|---|---|
| 행동 요소 | 실제 button에 “진단 시작하기”를 쓴다 | 클릭 div에 아이콘만 둔다 |
| 입력 라벨 | “업종” 라벨을 선택 필드와 연결한다 | 칸 안의 사라지는 안내문만 쓴다 |
| 상태 안내 | “저장 중…”, “저장했습니다”를 텍스트로 보인다 | 아이콘 색만 바꾼다 |
| 다음 단계 | “3분 후 이메일로 결과를 받습니다”를 보여 준다 | 제출 뒤 빈 화면으로 이동한다 |
| 레이아웃 | 화면 크기와 데이터 길이가 달라도 주요 버튼 위치가 안정적이다 | 항목마다 버튼 위치가 크게 달라진다 |
| 콘텐츠 구조 | 제목·요약·근거·다음 행동을 순서대로 둔다 | 긴 문단과 장식 요소 사이에 핵심을 숨긴다 |
| 권한 안내 | “읽기 전용으로 연결합니다. 발송하지 않습니다.”를 적는다 | 연결 뒤에야 접근 범위를 알린다 |
일곱 항목은 에이전트를 위한 비밀 규칙이 아닙니다. 사람이 처음 방문한 페이지에서 헤매지 않게 하는 규칙입니다. 특히 레이블과 상태 문구를 정확하게 쓰는 일은 고객 문의를 줄이고, 자동화가 생겼을 때도 행동의 의미를 지키게 합니다.
UX writing은 권한과 결과를 말해야 합니다
좋은 마이크로카피는 짧지만 행동의 결과를 숨기지 않습니다. “계속하기”보다 “검토용 초안 만들기”, “연결하기”보다 “Google Drive 읽기 전용 연결”이 더 분명합니다. 사용자는 AI가 무슨 정보를 읽고 어디까지 할지 알아야 다음 버튼을 누를 수 있습니다.
나쁜 문구: 확인 좋은 문구: 문의 분류 초안 12건 만들기 나쁜 문구: 연결 완료 좋은 문구: Drive의 ‘운영 회의록’ 폴더를 읽기 전용으로 연결했습니다 나쁜 문구: 처리 중 좋은 문구: 문서 3개를 읽고 있습니다. 초안은 외부에 발송되지 않습니다
이런 문구는 사용자가 에이전트를 통제한다고 느끼게 하고, 팀 내부에서도 승인 범위를 분명하게 합니다. 단, 실제 동작이 문구와 같아야 합니다. 읽기 전용이라고 썼다면 서버와 연결 설정도 쓰기 권한을 갖지 않아야 합니다.
콘텐츠는 빠르게 찾고, 끝까지 읽게 만드세요
Cloudflare의 Agent Readiness 소개는 robots.txt, sitemap, 마크다운 형태의 콘텐츠, API와 인증 정보를 발견하는 방법을 여러 점검 축으로 제시합니다. 이는 모든 사이트가 즉시 모든 규격을 구현해야 한다는 뜻은 아닙니다. 먼저 사람들이 읽는 페이지부터 제목, 요약, 질문에 대한 직접 답, 근거, 관련 행동을 일관된 순서로 제공하세요.
콘텐츠가 길어도 시작 문단에서 “누구의 어떤 질문에 답하는 글인지”를 말하면 검색과 추천 도구가 맥락을 잡는 데 도움이 됩니다. 이어서 근거의 출처와 업데이트 날짜를 보이게 하세요. AEO·GEO는 키워드를 억지로 반복하는 일이 아니라, 사람이 확인할 수 있는 답을 구조적으로 제공하는 일에 가깝습니다.
사이트에서 30분 안에 해볼 점검
실제 고객 흐름 하나를 고르세요. 예를 들어 상담을 신청하거나 가이드를 읽고 다음 글로 넘어가는 흐름입니다. 키보드만으로 진행해 보고, 브라우저 개발자 도구의 접근성 트리에서 버튼과 입력 이름을 확인합니다. 그다음 화면이 좁아졌을 때 다음 버튼이 보이는지, 제출 후 무엇이 일어나는지 텍스트로 안내되는지 봅니다.
기술팀이 있다면 별도로 robots.txt와 sitemap이 실제로 열리는지 확인하고, 공개 문서에는 기계가 읽기 쉬운 제목과 날짜를 유지할 수 있습니다. 공개 API가 없거나 AI가 작업할 이유가 없는 사이트라면 MCP나 API 카탈로그를 새로 만들 필요가 없습니다. 실제 사용자의 필요에서 출발해야 합니다.
작은 변경의 우선순위
- 가장 중요한 CTA의 행동 이름을 구체적으로 바꿉니다.
- 폼의 모든 입력에 보이는 라벨과 오류 설명을 붙입니다.
- 저장·제출·실패 상태를 색만이 아닌 문장으로 표시합니다.
- 콘텐츠 페이지에 제목, 직접 답, 근거, 날짜, 다음 행동을 정렬합니다.
- 사이트가 공개 콘텐츠를 제공한다면 robots.txt와 sitemap의 응답을 확인합니다.
에이전트를 위한 웹은 사람을 잊은 웹이 아닙니다. 행동을 명확하게 이름 붙이고, 상태를 숨기지 않으며, 책임 있는 정보를 찾기 쉽게 만드는 웹입니다. 이 기본이 갖춰진 뒤에 사이트 특성에 맞는 접근 제어와 도구 연결을 검토하세요.
출처: Cloudflare의 Agent Readiness 소개와 web.dev의 agent-friendly 웹 가이드를 2026년 9월 19일 확인했습니다. 이 글의 7가지 점검과 문구 예시는 LeanX의 제안입니다.
자주 묻는 질문
agent-ready 웹사이트는 SEO와 같은 말인가요?
겹치는 부분은 있지만 범위가 다릅니다. SEO는 검색에서 발견되는 일을 다루고, agent-ready는 에이전트가 사이트의 내용·행동·권한을 이해하고 필요한 작업을 안전하게 이어갈 수 있는지도 봅니다.
AI 에이전트를 위해 디자인을 단순하게 바꿔야 하나요?
시각적 개성을 포기할 필요는 없습니다. 다만 실제 버튼에는 button이나 a 요소와 분명한 이름을 쓰고, 입력에는 연결된 라벨을 두고, 다음 상태가 바뀌면 화면에 보이게 해야 합니다. 이는 사람의 접근성에도 도움이 됩니다.
llms.txt만 추가하면 준비가 끝나나요?
아닙니다. 콘텐츠를 찾고 읽게 하는 파일 하나만으로는 로그인, 권한, 실제 작업 흐름이 명확해지지 않습니다. 먼저 robots.txt, sitemap, 문서 구조, 의미 있는 인터페이스, 데이터 접근 경계를 점검하세요.
고객이 이해하기 쉬운 AX 경험을 한 단계씩 설계해 보세요.
AX 가이드 읽기