웹페이지 이미지와 주변 텍스트 추출을 위한 분할 알고리즘

초록

**
본 논문은 웹 페이지 내 이미지와 해당 이미지가 위치한 주변 텍스트를 효과적으로 추출하기 위한 새로운 페이지 분할 기법을 제안한다. 이미지와 텍스트의 시각·구조적 특성을 이용해 영역을 구분하고, 인간 라벨링을 통한 데이터셋으로 성능을 검증하였다. 실험 결과 기존 분할 알고리즘보다 높은 정확도와 재현율을 달성하였다.

**

상세 요약

**
이 연구는 웹 이미지와 그 주변의 문맥 정보를 동시에 추출하는 문제를 다루며, 기존 연구가 이미지 자체의 메타데이터나 주변 텍스트를 별도로 수집하는 데 한계가 있음을 지적한다. 저자들은 웹 페이지를 DOM 트리와 시각적 레이아웃 두 축으로 분석하여, 이미지가 포함된 블록과 텍스트 블록을 구분하는 규칙 기반 알고리즘을 설계하였다. 구체적으로는 (1) 이미지 태그()를 중심으로 인접한 텍스트 노드와 CSS 스타일 정보를 수집하고, (2) 시각적 거리와 레이아웃 정렬(가로·세로 정렬, 마진, 패딩)을 정량화하여 이미지와 텍스트 간의 연관성을 점수화한다. 이 점수는 임계값을 초과하는 경우 동일 컨텍스트 영역으로 묶이며, 그렇지 않은 경우 별도 영역으로 분리한다.

알고리즘의 핵심은 “시각적 근접성”과 “구조적 연관성”을 동시에 고려한다는 점이다. 기존의 DOM 기반 분할은 트리 구조만을 이용해 텍스트와 이미지가 물리적으로 멀리 떨어져 있어도 같은 부모 노드에 속하면 같은 영역으로 판단하는 오류가 있었다. 반면, 순수 시각적 분할은 CSS 레이아웃 변형(예: 플로팅, 절대 위치) 때문에 의미 있는 텍스트와 이미지를 놓치기 쉽다. 저자들은 두 접근법을 융합함으로써 이러한 문제를 완화하였다.

데이터 검증을 위해 저자들은 200개의 다양한 웹 페이지(뉴스, 블로그, 전자상거래 등)에서 인간 라벨러가 이미지와 해당 이미지에 가장 관련성이 높은 텍스트를 직접 지정한 라벨링 작업을 수행하였다. 라벨링 가이드라인은 “이미지와 직접적인 설명·캡션·주석을 포함하는 텍스트 블록”으로 정의했으며, 라벨러 간의 일관성을 확보하기 위해 Cohen’s κ를 0.82로 기록하였다.

성능 평가는 정밀도, 재현율, F1-score를 기준으로 기존 대표적인 웹 페이지 분할 알고리즘인 VIPS와 Boilerpipe와 비교하였다. 제안 알고리즘은 정밀도 0.91, 재현율 0.88, F1 0.895를 기록했으며, VIPS(정밀도 0.78, 재현율 0.73)와 Boilerpipe(정밀도 0.74, 재현율 0.69)보다 현저히 우수했다. 특히 이미지와 텍스트가 비정형 레이아웃(그리드, 카드형)으로 배치된 경우에도 높은 정확도를 유지했다.

한계점으로는 동적 로딩 콘텐츠(스크롤 시 로드되는 이미지)와 JavaScript에 의해 생성되는 가상 DOM을 완전히 처리하지 못한다는 점을 들었다. 또한, 임계값 설정이 도메인에 따라 민감하게 변할 수 있어 자동 튜닝 메커니즘이 필요하다. 향후 연구에서는 딥러닝 기반 시각-텍스트 연관성 모델을 도입해 임계값을 학습하고, 실시간 크롤링 파이프라인에 통합하는 방안을 제시한다.

**