에이전틱 내비게이션(Agentic Navigation)에 대해 알아야 할 모든 것
요약
에이전틱 내비게이션(Agentic Navigation)의 개념과 Google이 제안한 WebMCP 표준을 소개합니다. WebMCP는 웹사이트가 AI 에이전트에게 구조화된 도구와 기능을 직접 노출하여 상호작용의 효율성과 신뢰성을 높이는 기술입니다.
핵심 포인트
- 에이전틱 내비게이션은 AI 에이전트가 웹사이트를 읽고 이해하는 능력을 측정하는 새로운 패러다임입니다.
- WebMCP는 웹 애플리케이션과 AI 에이전트 사이의 간극을 메우는 Google의 실험적 표준입니다.
- JSON 스키마를 통해 사이트 기능을 선언함으로써 에이전트의 환각 현상을 줄이고 작업 성공률을 높입니다.
- 현재 WebMCP는 Chrome 오리진 트라이얼을 통해 실험적으로 사용할 수 있습니다.
**에이전틱 내비게이션 (Agentic Navigation)**은 (아마 이미 눈치채셨겠지만) Google의 Pagespeed Insights와 당연히 Lighthouse 라이브러리에서도 사용되고 있는 새로운 카테고리입니다. 이는 이 분석 엔진에 있어 분수령이 되는 순간입니다. 이전에는 오로지 인간 사용자의 경험에만 초점을 맞추었으나, 이제는 인공지능 에이전트(AI agents)가 당신의 사이트를 얼마나 "읽기 쉬운지"를 측정할 수 있는 (현재로서는 작은) 공간이 생겼기 때문입니다.
실제 사례: 한 고객이 아침에 저에게 전화를 걸어 놀랍다는 이야기를 했습니다. 누군가의 집 구조 개보수 견적을 내러 갔는데, 인터뷰 도중 상대방이 그녀에게 추천(referral)을 받은 적이 있는지 물었다고 합니다. 답변은 놀랍고도 재미있었습니다: Claude였습니다.
네, 그냥 그렇게, "Claude"라고 말이죠. 마치 공통된 친구인 것처럼 말입니다. 이는 우리가 되돌아올 수 없는 길에 들어섰음을 보여줍니다. 계속 따라가거나, 아니면 중요한 비즈니스를 놓치게 될 수도 있습니다.
이것이 에이전틱 내비게이션(Agentic Navigation)과 무슨 상관이냐고요? 저도 전혀 모르겠습니다. 하지만 매우 재미있는 사실임은 분명합니다.
자, 다시 주제로 돌아가겠습니다! 이 새로운 분석 카테고리는 네 가지 기둥을 가지고 있습니다:
WebMCP
사이트가 에이전트에게 구조화된 도구(structured tools)를 노출하고 있는가?
여기에 이 모든 변화의 핵심이 있습니다. WebMCP는 Google이 제안한 표준으로, 개발자가 사이트의 기능을 AI에게 직접 노출할 수 있도록 해줍니다. 당신의 사이트가 AI에게 다가가 "이봐, 친구! 스크래핑(scrape)할 필요 없어, 보물 지도가 바로 여기 있다고..."라고 말하는 것과 같습니다.
공식 문서에 따르면, "WebMCP는 상호작용을 위한 규칙을 제공함으로써 웹 애플리케이션과 에이전트 사이의 간극을 메우고, 효율성, 신뢰성 및 작업 완료율을 향상시키는 데 도움을 줄 수 있습니다. 에이전트가 버튼이나 필드와 같은 요소를 파싱(parsing)하여 그 목적을 이해하는 대신, 사이트가 요소의 목적을 선언함으로써 올바르게 사용되도록 합니다.".
사이트는 json 스키마(schema) 또는 선언적 html을 통해 에이전트에게 자신의 기능을 명시적으로 선언할 것입니다 (Schema.org가 하는 방식과 동일합니다). 이를 통해 에이전트가 혼란에 빠지거나(즉, 환각(hallucinating) 현상) 모든 것을 잘못 파악하지 않고 작업을 더 쉽게 수행할 수 있습니다. 아래의 간단하고 기초적인 예시와 같습니다:
// JS를 통한 도구(tool) 등록
document.modelContext.registerTool({
name: 'search_flights',
...
이 js 코드의 흥미로운 점들:
- **
inputSchema**는JSON Schema표준을 사용하여 함수가 실행되기 전에도 AI의 입력을 검증하므로, 처리 오류를 줄여줍니다. - **
execute**는 비동기(async) 함수이며, 반환값은 AI의 "사고(thinking)\
WebMCP는 아직 실험적 단계입니다. 즉, PageSpeed Insights에서 "무료로" 실행되지 않습니다. WebMCP 지원은 실험적이며, Chrome 150 이상 버전이 필요하고, WebMCP 감사(audits)는 오리진 트라이얼(origin trial)에 오리진(origin)을 등록해야만 작동합니다. 이를 활성화하려면 토큰(token)이 필요합니다. 흐름은 다른 Chrome 오리진 트라이얼과 동일합니다. 귀하의 오리진을 위해 생성된 토큰을 가져와서 모든 페이지의 <head> 내 메타 태그(meta tag)에 넣으면 됩니다:
<meta http-equiv="origin-trial" content="{YOUR TOKEN HERE}">
토큰 없이 로컬에서 테스트해 보려면 chrome://flags/#enable-webmcp-testing에서 플래그(flag)를 전환할 수 있습니다. 이 모든 번거로움이 가치가 있을까요? 물론입니다. 이는 단순히 유망한 수준이 아니라 자연스러운 방향이며, 경주는 이미 시작되었습니다. 미리 준비해 두는 것이 좋습니다.
llms.txt 파일
도메인 루트에 AI를 위한 컨텍스트 가이드가 있나요?
이제 robots.txt만으로는 충분하지 않습니다. 이제는 llms.txt가 필요하며, 이는 AI가 길을 잃지 않고 사이트를 이해할 수 있도록 지도 역할을 하게 됩니다. 다음의 공식 예시를 살펴보세요:
# 제목
> 선택 사항인 설명이 여기에 들어갑니다
...
문서에서는 다음과 같이 명확히 설명합니다: "사이트맵(sitemaps)이 검색 엔진을 위해 모든 페이지를 나열하는 반면, llms.txt는 LLM(대규모 언어 모델)을 위해 큐레이션된 개요를 제공합니다" 그리고 _"robots.txt와 llms.txt는 목적이 다릅니다. robots.txt는 일반적으로 자동화된 도구에 사이트의 어떤 접근이 허용되는지 알리는 데 사용되지만... 반면에 llms.txt 정보는 사용자가 특정 주제에 대한 정보를 명시적으로 요청할 때, 예를 들어 프로젝트에 코딩 라이브러리의 문서를 포함하거나 검색 기능이 있는 챗봇에게 정보를 요청할 때 온디맨드(on demand)로 사용되는 경우가 많습니다".
여러분의 llms.txt는 컨텍스트 파일 (context file), 사용 가이드 (usage guide), 그리고 사이트 콘텐츠의 큐레이션 (curation) 역할을 하게 될 것입니다. FastHTML에서 제공하는 완전한 예시가 있으니, 전체 내용을 읽어보실 수 있습니다.
가장 아이러니한 부분은 이 프로젝트가 .md를 작성하는 .txt를 사용한다는 점입니다. 직관에 어긋나죠? 분명 그렇습니다. 하지만 여기에는 이유가 있습니다. 웹 전반에 퍼져 있는 인프라는 믿기 힘들 정도로 레거시 (legacy) 상태이며, .txt를 사용하는 것은 단테(Dante) 시대부터 이어져 온 서버들에서도 보편적인 호환성 (compatibility)과 설정의 용이성을 확보하기 위한 방법입니다.
접근성 트리 (Accessibility tree)
접근성 구조가 기계에 의한 내비게이션 (navigation)을 허용하는가?
에이전트 (Agents)에게도 접근성이 필요합니다! 좋은 소식은 여러분이 이미 접근성 트리 (accessibility tree)의 모범 사례 (best practices)를 따르고 있다면, 여러분의 사이트는 이미 이에 100% 맞춰져 있을 것이라는 점입니다. 적절한 위치의 시맨틱 태그 (semantic tags), 제목과 부제목의 구성, labels가 선언된 폼 (forms) 등이 그 예입니다.
솔직히 말씀드리면, 이 기둥과 다음 기둥은 다룰 내용이 많지 않습니다. 이 두 분야는 에이전틱 내비게이션 (Agentic Navigation)이 등장하기 훨씬 전부터 이미 존재했고 잘 문서화되어 있었던 분야이며, 전혀 새로운 것이 아닙니다. 이들이 해당 카테고리의 일부이기 때문에 언급하는 것이지, 깊게 파고들지는 않겠습니다. 그것은 바퀴를 다시 발명하는 것 (reinventing the wheel)과 다름없기 때문입니다.
누적 레이아웃 이동 (Cumulative Layout Shift)
레이아웃이 에이전트가 정밀하게 클릭할 수 있을 만큼 안정적인가?
위에서 경고했듯이, 이 부분 역시 변하는 것은 없습니다! 여러분의 사이트가 인간을 위해 좋은 CLS를 가지고 있다면, 에이전트에게도 좋을 것입니다! 걱정할 거리가 하나 줄어든 셈입니다.
결론
이 네 가지 기둥을 함께 살펴보면 중요한 사실을 발견할 수 있습니다. 그중 두 가지는 이미 프론트엔드(Frontend)를 잘 구현하고 있다면 공짜로 얻는 것과 다름없습니다. 접근성 트리(Accessibility tree)와 CLS는 오래된 숙제와 같습니다. 인간 사용자의 경험을 신경 쓰고 있다면, 에이전트(Agent)는 당신이 손가락 하나 까딱하지 않아도 그 혜택을 그대로 물려받습니다.
llms.txt는 기껏해야 오후 시간 정도면 작업할 수 있는 분량입니다 (저는 이 작업을 더 편하게 하기 위해 생성기를 만들고 있습니다 🫣). 진정한 게임 체인저(Game changer)는 WebMCP이며, 바로 이 부분에 지금 에너지를 투자할 가치가 있습니다.
웹은 에이전트를
AI 자동 생성 콘텐츠
본 콘텐츠는 Dev.to AI tag의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기