
검색 엔진이 답변 엔진으로 변하고 있습니다: 개발자가 바꿔야 할 것들
요약
검색 엔진이 답변 엔진으로 진화함에 따라, 개발자는 AI 크롤러가 정보를 정확히 추출할 수 있도록 웹사이트 구조를 최적화해야 합니다. 단순한 SEO를 넘어 시맨틱 HTML과 깔끔한 DOM 구조를 갖추는 것이 AI 검색 호환성을 위한 필수 엔지니어링 과제가 되었습니다.
핵심 포인트
- AI 검색 엔진(Perplexity, ChatGPT 등)은 웹사이트에서 직접 답을 추출함
- AI 크롤러는 지저분한 DOM 대신 명확한 시맨틱 구조를 선호함
- 시맨틱 HTML 사용은 이제 선택이 아닌 필수적인 엔지니어링 요소임
- 구조화된 마크업이 AI 답변의 정확도와 인용 가능성을 결정함

저는 한동안 클라이언트 웹사이트를 위한 코드를 작성해 왔는데, 지난 1년 정도 사이에 거의 모든 프로젝트 킥오프(kickoff) 회의에서 예전에는 나오지 않았던 질문이 슬금슬금 등장하기 시작했습니다. 바로 "이게 AI 검색과 호환될까요?"라는 질문입니다. 솔직히 저의 첫 반응은 약간의 짜증이었습니다. 또 다른 약어(acronym)가 등장했고, 이미 긴 요구사항 목록에 덧붙여야 할 또 다른 항목이 생겼으니까요. 하지만 AI 개요(AI Overviews), Perplexity, 그리고 ChatGPT의 브라우징(browsing) 기능이 실제로 웹사이트에서 정보를 어떻게 추출하고 인용하는지 파헤쳐 본 후, 저는 이것이 단순한 마케팅 유행어(buzzword) 문제가 아니라는 것을 깨달았습니다. 이것은 엔지니어링(engineering) 문제이며, 제가 대화해 본 상당수의 개발자들은 아직 이를 완전히 인지하지 못하고 있습니다.
과거의 검색 엔진은 사람들이 직접 답을 찾을 수 있도록 사용자를 여러분의 페이지로 보내주었습니다. 하지만 점점 더 검색 엔진은 답을 직접 추출하여 클릭이 발생하기도 전에 사용자에게 제공하고 있습니다. 이러한 변화는 내부적으로 "좋은" 기술적 SEO(Search Engine Optimization)와 사이트 아키텍처(site architecture)가 실제로 어떤 모습이어야 하는지를 변화시키며, 우리 개발자들이 클라이언트나 제품 관리자(product manager)로부터 트래픽이 왜 떨어졌느냐는 질문을 받고 답변을 준비하지 못하기 전에 미리 주의를 기울일 가치가 있습니다.
흥미로운 점은 이 과정에서 실제로 새로운 도구(tooling)가 필요한 부분이 거의 없다는 것입니다. 대부분은 우리가 이미 "모범 사례(best practice)"라고 알고 있었던 습관들을, 마감 기한이 촉박할 때 건너뛸 수 있는 '있으면 좋은 것(nice-to-haves)'이 아니라 진정으로 '타협할 수 없는 것(non-negotiable)'으로 취급하는 것에 관한 것입니다. 과거에는 Lighthouse 점수나 접근성(accessibility) 감사로부터 압박을 받았습니다. 이제는 방 안에 조금 더 냉혹한 두 번째 심판이 등장했습니다. 바로 지저분한 DOM(Document Object Model)을 기다려 줄 인내심 없이, 찰나의 순간에 깔끔한 답변을 추출해야 하는 크롤러(crawler)입니다.
시맨틱 HTML (Semantic HTML)은 더 이상 선택 사항이 아니라, 구조를 지탱하는 핵심 요소입니다
저 또한 과거 프로젝트에서 모든 것을 일반적인 컨테이너로 감싸고, 스타일링을 통해 겉보기에만 그럴싸하게 만드는 'div-soup'의 죄를 범했음을 먼저 인정합니다. 그 과정에서 기저의 마크업(markup)은 크롤러(crawler)에게 구조나 의미에 대해 사실상 아무것도 알려주지 못했습니다. 하지만 그러한 습관은 이제 매우 큰 비용을 치르게 만들고 있습니다. AI 크롤러는 접근성 도구와 마찬가지로 적절한 시맨틱 구조(semantic structure)에 크게 의존합니다. 즉, <article>, <section>, 적절하게 중첩된 헤딩(headings), 그리고 하나의 것처럼 보이려고 쌓아 올린 세 개의 div 대신 실제 정의 쌍을 위한 <dl> 등을 활용하여, 페이지가 실제로 무엇에 관한 것인지, 그리고 페이지의 어느 부분이 주어진 질문에 직접적인 답변을 제공하는지를 파악합니다.
만약 디자인에서 "보기 좋았다"는 이유로 h1에서 바로 h4로 건너뛰는 등 헤딩 계층 구조(heading hierarchy)가 엉망이라면, 이는 더 이상 단순한 접근성 문제에 그치지 않습니다. 이는 AI 모델이 귀하의 콘텐츠로부터 깨끗하고 인용 가능한 답변을 추출하는 것을 측정 가능한 수준으로 어렵게 만듭니다. 결과적으로 콘텐츠 자체가 진정으로 훌륭하더라도, 실제 질문에 대한 귀하의 고객의 진짜 답변은 결코 노출되지 않게 됩니다.
구조화된 데이터 (Structured Data)는 이미 오래전에 '있으면 좋은 것'의 단계를 넘어섰습니다
저는 예전에 스키마 마크업(schema markup)을 스프린트(sprint)에 시간이 남으면 프로젝트 마지막에 추가하는 것, 주로 리치 스니펫(rich snippet)의 별점 표시를 위한 용도로 취급하곤 했습니다. 이제 그것은 실수입니다. FAQ 스키마, HowTo 스키마, 그리고 명확한 author 및 datePublished 속성을 포함한 Article 스키마 등은 단순한 장식이 아닙니다. 이것들은 AI에게 자신이 보고 있는 콘텐츠의 유형이 정확히 무엇인지, 그리고 이를 인용할 때 얼마나 확신을 가질 수 있는지를 알려주는 명시적인 기계 판독 가능 신호(machine-readable signals)입니다.
저는 스키마 생성 (schema generation)을 사후 고려 사항으로 취급하는 대신 초기 빌드 단계에 포함시키기 시작했습니다. 솔직히 말씀드리면, 일단 표준 컴포넌트 템플릿의 일부가 되고 나면 실제 개발 시간은 거의 추가되지 않습니다. 만약 고객이나 이해관계자에게 이 점을 조언하고 있다면, 이것은 개발 팀이 할 수 있는 변화 중 진정으로 가장 높은 레버리지(leverage)를 가지면서도 노력이 적게 드는 작업 중 하나입니다. 또한 이는 숙련된 Ludhiana의 SEO 서비스 팀들이 수년간 추진해 온 기초 작업과도 크게 겹치는데, 다만 최종 소비자가 순수한 검색 알고리즘이 아닌 모델(model)로 바뀌었을 뿐입니다.
성능은 여전히 중요하며, 어쩌면 이전보다 더 중요할 수도 있습니다
이 과정을 시작하며 예상하지 못했던 점이 하나 있는데, 페이지 속도와 렌더링 동작이 기존의 SEO만큼이나, 어쩌면 그보다 더 AI 크롤링 가능성 (crawlability)에 중요하게 작용한다는 것입니다. 왜냐하면 이러한 크롤러 중 상당수가 역사적인 Googlebot보다 더 엄격한 시간 및 리소스 예산 내에서 작동하기 때문입니다. 의미 있는 콘텐츠가 DOM에 나타나기 전에 전체 하이드레이션 (hydration) 사이클이 필요한 무거운 클라이언트 사이드 렌더링 (client-side-rendered) React 앱은 여기서 정말 위험합니다. 만약 크롤러가 콘텐츠가 렌더링되기 전에 스냅샷을 찍는다면, 아무것도 보지 못하게 됩니다. 빈 <div id="root"></div>. 기능적으로 보이지 않는 상태가 되는 것이죠.
콘텐츠 중심 페이지를 위한 서버 사이드 렌더링 (Server-side rendering) 또는 정적 생성 (static generation)은 이제 단순히 성능 측면의 권장 사항이 아니라, 페이지가 신뢰성 있게 파싱되고 인용될 가능성을 조금이라도 높이려면 필수 조건에 가깝습니다. 저는 고객이 미적인 유연성만을 위해 과도하게 클라이언트 사이드 렌더링을 사용하는 마케팅 사이트를 원할 때, 프로젝트 계획 단계에서 더 강력하게 반대하기 시작했습니다. 데이터를 더 많이 살펴볼수록 그 트레이드오프 (tradeoff)가 점점 더 명확해지고 있기 때문입니다.
llms.txt와 "크롤러 에티켓"이라는 기묘한 새로운 개척지
기존의 robots.txt와 나란히 존재하는 llms.txt라는 새로운 관습이 떠오르고 있습니다. 이는 AI 크롤러(AI crawler)에게 어떤 콘텐츠가 참조하기에 적절한지, 그리고 어떤 것이 그렇지 않은지에 대한 명시적인 가이드를 제공하기 위한 것입니다. 아직 보편적으로 채택되거나 완전히 표준화된 상태는 아니며, 모든 AI 크롤러가 이를 일관되게 준수할 것이라고 프로젝트 마감일을 걸고 확신할 수는 없습니다. 하지만 구현 비용이 저렴하고 미래를 내다보는 신호로서 추가하는 데 비용이 들지 않기 때문에, 저는 어쨌든 새로운 빌드에 기본적인 버전을 포함하기 시작했습니다. 최악의 경우, 아직은 아무런 효과가 없을 뿐입니다. 최선의 경우, 2년 뒤에 이것이 조용히 핵심적인 기반 인프라 (load-bearing infrastructure)가 되어 우리가 나중에 이를 소급 적용(retrofit)할 필요가 없었다는 사실에 기뻐하게 될 것입니다.
이것은 도메인의 루트(root)에 위치하는 마크다운 (markdown) 파일로, 기본적으로 사이트가 무엇인지 평이한 언어로 설명하고 주의를 기울일 가치가 있는 페이지들을 가리킵니다. 대부분의 중소규모 사이트의 경우 제대로 초안을 작성하는 데 20분 정도면 충분합니다. 저는 이것을 기본적인 sitemap.xml과 동일하게 취급하기 시작했습니다. 그 자체로 엄청난 변화를 일으킬 것이라고 기대하지는 않지만, 추가하는 데 비용이 거의 들지 않으면서도 나중에 진정으로 중요해질 수 있는 작고 저렴한 신호로 보고 있습니다.
정보 구조 (Information Architecture)는 디자인의 영역일 뿐만 아니라 개발자의 관심사이기도 합니다
저는 사이트맵 구조와 내비게이션 깊이(navigation depth)를 주로 디자인이나 콘텐츠의 문제, 즉 UX를 담당하는 사람에게 맡겨야 할 일이라고 생각하곤 했습니다. 이제는 더 이상 그렇게 생각하지 않습니다. 콘텐츠가 폴더 구조 내에 얼마나 깊게 위치하는지, 내부 링크(internal linking)가 관련 페이지들을 어떻게 연결하는지, URL 패턴이 예측 가능한지 아니면 쿼리 파라미터(query parameters)로 엉망인지와 같은 요소들은 크롤러(crawler)가 사이트 구조를 얼마나 쉽게 매핑하고 어떤 페이지에 더 많은 가중치를 부여해야 할지 파악하는 데 직접적인 영향을 미칩니다. 이것이 바로 프로젝트를 위해 UI UX designing in Ludhiana를 담당하는 사람과 긴밀히 협업하는 것이 결실을 보는 지점입니다. 깨끗한 정보 구조(Information Architecture)는 기본적으로 동일한 근본적 이유로 크롤러와 인간 방문자 모두에게 이득을 주기 때문입니다. 이는 사용자를 위하는 일과 기계를 위하는 일이 정확히 같은 방향을 가리키는 드문 사례 중 하나입니다.
제가 현재 고객과 팀에게 실제로 전달하고 있는 내용
실질적인 변화는 극적이지 않으며, 솔직히 말해 이는 다행스러운 일입니다. 그것은 주로 규율(discipline)에 관한 것입니다. 즉, 'div-soup(div 태그로만 도배된 코드)' 대신 깨끗한 시맨틱 마크업(semantic markup)을 사용하는 것, 나중에 덧붙이는 것이 아니라 첫날부터 빌드 프로세스에 스키마(schema)를 내장하는 것, 실제로 질문에 답변하기 위한 모든 것에 대해 서버 사이드 렌더링(server-rendered) 콘텐츠를 제공하는 것, 그리고 일반적인 robots.txt와 함께 합리적인 크롤러 신호(crawler signals)를 배치하는 것입니다. 이 중 그 어떤 것도 사이트를 구축하는 방식을 재발명할 필요를 요구하지 않습니다. 다만, 프레임워크 덕분에 기계가 파싱(parse)하기에 충분히 구조화되지 않았음에도 사용자에게는 모든 것이 "충분히 빠르다"고 느껴지게 되면서 우리가 다소 나태해졌을지도 모르는 기술적 SEO(Technical SEO)를 다시 진지하게 받아들일 것을 요구할 뿐입니다.
만약 여러분이 website development company Ludhiana와 함께 작업하고 있다면, 고객들은 이러한 미래 지향적인 기술적 토대를 기대합니다. 이러한 요소들은 트래픽이 감소하는 것을 누군가 눈치채고 이유를 물을 때 출시 후에 급하게 끼워 넣는 것이 아니라, 아키텍처 (Architecture) 단계부터 논의의 일부가 되어야 합니다. 방대한 레거시 코드베이스 (Legacy codebase)에 시맨틱 구조 (Semantic structure)를 사후에 적용하는 것은 진정으로 고통스럽고 여러 번의 스프린트 (Sprint)가 소요되는 힘든 작업입니다. 첫날부터 이를 구축하는 데는 추가 비용이 거의 들지 않으며, 솔직히 말해서 저는 website designing company in Ludhiana가 이 부분을 사전에 알리지 않고 고객에게 빌드를 넘겨주는 것에 대해 어떤 조언을 하든 똑같은 조언을 할 것입니다.
저는 우리가 웹이 구축되는 방식의 극적인 재발명으로 향하고 있다고 생각하지 않습니다. 그보다는 우리가 수년간 생략해 왔던 부분들, 즉 엉성한 마크업 (Markup), 게으른 스키마 (Schema), 렌더링 차단 JS 비대화 (Render-blocking JS bloat) 등이 마침내 눈에 보이고 측정 가능한 비용을 다시 지불하게 되는 세상으로 향하고 있다고 생각합니다. 솔직히 말해서, AI 검색을 제외하더라도 이는 웹 전체를 위해 좋은 일이 될 수도 있습니다.
AI 자동 생성 콘텐츠
본 콘텐츠는 Dev.to AI tag의 원문을 AI가 자동으로 요약·번역·분석한 것입니다. 원 저작권은 원저작자에게 있으며, 정확한 내용은 반드시 원문을 확인해 주세요.
원문 바로가기