[{"data":1,"prerenderedAt":13},["ShallowReactive",2],{"guide-detail-20260506_accessibility_architecture":3},{"data":4,"content":12},{"title":5,"thumbnail":6,"category":7,"subCategory":8,"date":9,"summary":10,"isFeatured":11},"스크린리더와 데이터 구조를 고려한 리프아이티의 e-Book 아키텍처","\u002Fimages\u002Finsight\u002F20260507-1253.png","기술 및 보안","","2026.05.06","리프아이티 e-Book 기술은 원본파일 내부 텍스트 레이어 추출 · 데이터베이스 구조화 · 스크린리더 접근성까지 고려한 구조로 설계되어 있습니다.","false","\r\n## 보이지 않는 영역까지 설계된 e-Book 아키텍처\r\n\r\n국내 대다수 e-Book 기술은 **파일의 페이지를 단순히 좌\u002F우로 붙여 화면에 출력하는 방식**에 집중되어 있습니다.\r\n\r\n사용자 입장에서는 책처럼 보이기 때문에 큰 차이를 느끼기 어렵지만, 실제 내부 구조는 완전히 다를 수 있습니다. 페이지만 존재하고 실제 텍스트 데이터가 없는 구조는, 시스템 입장에서는 사실상 내용을 알 수 없는 '빈 문서'와 다름없습니다.\r\n\r\n* **스크린리더 접근 제한** — 보조기기가 내용을 인식하지 못함\r\n* **검색 정확도 저하** — 정확한 검색결과 하이라이트 매칭 불가\r\n* **정보 재활용 어려움** — 콘텐츠를 2차 가공할 수 없는 구조\r\n* **외부 시스템 연계 제한** — CMS, 검색엔진 등과 연결 불가\r\n* **접근성 대응 한계** — \"장애인 차별금지 및 권리구제 등에 관한 법률\" 기준 충족 불가\r\n\r\n> 이러한 문제는 단순히 넘어갈 수 있는 기능 결여가 아닙니다. 설계 철학의 차이에서 비롯된 구조적 한계입니다.\r\n\r\n리프아이티는 단순히 \"페이지를 넘기는 뷰어\"가 아니라, **콘텐츠 자체를 데이터 구조 관점**에서 접근해왔습니다. 겉으로 보이는 UI보다 \u003Cstrong>내부 데이터 레이어(Data Layer)\u003C\u002Fstrong>를 어떻게 설계하느냐가 장기적인 운영 품질을 결정한다고 판단했기 때문입니다.  \r\n\r\n이 판단은 차별없이 웹 서비스를 제공해야 하는 공공기관, 교육기관, 대기업 납품 경험을 통해 거듭 검증되어 왔습니다.\r\n\r\n---\r\n\r\n![텍스트 기반 e-Book](\u002Fimages\u002Finsight\u002F20260507-1248.png)\r\n\r\n## 1. 이미지와 텍스트를 분리하는 Data Layering 구조\r\n\r\n일반적인 e-Book은 시스템 입장에서 사실상 \u003Cstrong>\"읽을 수 없는 문서\"\u003C\u002Fstrong>에 가깝습니다. 아무리 고해상도 이미지라도, 기계가 그 안에서 단어 하나를 추출하기 위해서는 별도의 처리 과정이 반드시 필요합니다.\r\n\r\n리프아이티 e-Book 솔루션은 이러한 한계를 해결하기 위해 **이미지 렌더링 레이어(Rendering Layer)와 텍스트 데이터 레이어(Text Data Layer)를 완전히 분리하여 병행 운영하는 이중 구조**를 채택하고 있습니다.\r\n\r\n제작 과정에서는 원본파일의 내부의 실제 텍스트 레이어를 직접 파싱(Parsing)하여 데이터를 추출합니다. 이는 일반적인 OCR(광학 문자 인식) 기반 처리와는 본질적으로 다릅니다. OCR은 이미지화된 문서를 픽셀 단위로 분석하여 문자로 변환하는 방식이기 때문에, 폰트 종류, 해상도, 압축률에 따라 오인식이 빈번하게 발생합니다.  \r\n\r\n반면 리프아이티의 전자책 기술은 \u003Cstrong>파일 내부의 원본 텍스트 스트림(Text Stream)\u003C\u002Fstrong>을 직접 추출하기 때문에, 문서에서 보이는 글자의 품질에 관계없이 안정적이고 정확한 데이터 확보가 가능합니다.\r\n\r\n추출된 텍스트는 저장으로 그치지 않고, 각 텍스트 블록은 화면에 출력되는 이미지 좌표와 **시맨틱 매핑(Semantic Mapping)** 방식으로 연결되어, 사용자가 화면의 특정 위치를 선택하면 해당 텍스트 데이터가 즉시 활성화되는 구조로 동작합니다. 이 과정은 프론트엔드 렌더링과 백엔드 데이터 처리가 유기적으로 연계될 때 비로소 완성됩니다.\r\n\r\n### 추출된 데이터의 활용 범위\r\n* **페이지 단위 매핑 (Page Mapping)** — 이미지 좌표 기반 텍스트 위치 연결\r\n* **텍스트 인덱싱 (Text Indexing)** — 역색인(Inverted Index) 기반 고속 검색 지원\r\n* **데이터베이스 저장 (DB Persistency)** — 구조화된 형태로 RDBMS에 영구 보존\r\n* **검색 엔진 연동 (Search Integration)** — Full Text Search 엔진과의 API 연결\r\n* **접근성 데이터 처리 (Accessibility Layer)** — WAI-ARIA 속성 기반 보조기기 제공\r\n\r\n> 화면에는 이미지처럼 보여도, 내부적으로는 별도의 **텍스트 데이터 계층이 병행 운영**되는 구조입니다.  \r\n이 이중 레이어 설계가 리프아이티 e-Book 엔진의 기술적 기반입니다.\r\n\r\n---\r\n\r\n![스크린리더를 통해 낭독되는 텍스트](\u002Fimages\u002Finsight\u002F20260507-1253.png)\r\n\r\n## 2. 스크린리더 접근성까지 고려한 e-Book 구조\r\n\r\n최근 공공기관과 교육기관에서는 \u003Cstrong>웹 접근성(Web Accessibility)\u003C\u002Fstrong>에 대한 요구가 매우 중요해지고 있습니다. 한국의 경우 「장애인 차별 금지 및 권리구제 등에 관한 법률」에 따라 공공기관 웹 서비스는 한국형 웹 콘텐츠 접근성 지침(KWCAG) 준수가 법적 의무 사항입니다.\r\n\r\n실제로 저희는 구축 상담 과정에서 다음과 같은 문의를 받고 이로 인해 납품까지 이루어진 사례가 있습니다.\r\n\r\n> *\"스크린리더로 읽기가 가능한가?\"*\r\n> *\"시각장애인 보조기기 환경에서도 활용 가능한가?\"*\r\n> *\"텍스트 기반 접근이 가능한 구조인가?\"*\r\n\r\n이러한 질문은 단순 UI 요소만으로 해결되지 않습니다. 접근성을 버튼 색상 대비나 폰트 크기 조절 정도로 이해하는 경우가 여전히 많지만, 스크린리더(JAWS, NVDA, VoiceOver 등)를 사용하는 환경에서 핵심은 **읽어낼 수 있는 텍스트 데이터의 존재 여부**입니다.\r\n\r\n텍스트 데이터가 없는 이미지 기반 e-Book은 스크린리더가 내용을 인식하기 어렵고, 문장 단위 탐색이나 문맥 기반 읽기 역시 제한됩니다. 화면을 아무리 보기 좋게 만들어도, 읽혀지지 않는 구조라면 접근성 요건을 충족할 수 없습니다.\r\n\r\n리프아이티는 제작 단계에서부터 **텍스트 데이터를 별도로 확보하고 WAI-ARIA(Web Accessibility Initiative – Accessible Rich Internet Applications) 속성 기반으로 구조화**하기 때문에, 보조기기 환경에서도 문맥에 맞는 낭독이 가능한 기반 구조를 제공합니다.\r\n\r\n이는 기능 추가 수준이 아니라, **콘텐츠 구조 자체를 접근성 관점에서 다르게 설계한 결과**입니다. 특히 접근성 환경에서는 버튼 디자인이나 색상 대비보다 \"읽을 수 있는 데이터 구조인가\"가 훨씬 중요하며, 리프아이티는 이 부분을 오래전부터 핵심 기술 요소로 판단해왔습니다.\r\n\r\n---\r\n\r\n```html\r\n\u003Carticle class=\"ebook-page\" data-page=\"10\">\r\n  \u003Cimg\r\n    class=\"page\"\r\n    src=\"\u002Fcontents\u002Fsample\u002Fpage_010.ebook\"\r\n    alt=\"2026 서울국제정원박람회 소개 페이지\"\r\n  >\r\n\r\n  \u003Cdiv class=\"text-layer\" aria-label=\"10페이지 본문 텍스트\">\r\n    \u003Ch3>2026 서울국제정원박람회\u003C\u002Fh3>\r\n\r\n    \u003Cp>\r\n      '2026 서울국제정원박람회'는 서울의 자연과 문화,\r\n      사람이 만들어내는 '정원도시 서울'의 모습을 세계와 공유하는 장입니다.\r\n      서울의 역동적이고 문화적인 흐름을 정원의 언어로 담아낸\r\n      '서울류(流)'가 5월 1일부터 10월 27일까지 계절별로 펼쳐집니다.\r\n    \u003C\u002Fp>\r\n\r\n    \u003Cp>\r\n      이처럼 e-Book 페이지는 화면에는 하나의 이미지처럼 보이지만,\r\n      내부적으로는 제목, 본문, 페이지 정보가 텍스트 데이터로 분리되어 관리됩니다.\r\n      이 구조를 통해 검색, 스크린리더 낭독, 통합검색 연계,\r\n      메타데이터 활용이 가능한 콘텐츠 구조화 기반을 갖출 수 있습니다.\r\n    \u003C\u002Fp>\r\n  \u003C\u002Fdiv>\r\n\u003C\u002Farticle>\r\n```\r\n\r\n## 3. e-Book 뷰어, 그 이상의 콘텐츠 구조화 엔진\r\n\r\n리프아이티 e-Book 기술은 파일 내용을 화면에 띄우는 단순한 수준의 뷰어가 아닙니다. 문서를 구조화된 데이터로 변환하고, 이를 검색, 접근성, 시스템 연계까지 활용 가능한 형태로 관리하는 \u003Cstrong>콘텐츠 구조화 엔진(Content Structuring Engine)\u003C\u002Fstrong>에 가깝습니다.\r\n\r\n추출된 텍스트 데이터는 **역색인(Inverted Index) 기반의 Full-text Search 인덱스**로 변환되어 저장됩니다. 이를 통해 수만 페이지에 달하는 대용량 아카이브 환경에서도 특정 키워드를 밀리초(ms) 단위로 탐색할 수 있습니다. 일반적인 키워드 매칭을 넘어, 형태소 분석 기반 한국어 처리를 결합하면 조사와 어미 변형에 관계없이 정확한 검색 결과를 제공하는 것도 가능합니다.\r\n\r\n또한 구조화된 데이터는 다음과 같은 확장 구조와 연결될 수 있습니다.\r\n\r\n* **CMS 연계** — 콘텐츠 관리 시스템과 메타데이터 기반 연동\r\n* **통합검색 연동** — 기관 내 통합 포털 검색 결과에 e-Book 콘텐츠 노출\r\n* **메타데이터 활용** — 발행일, 저자, 카테고리 등 Dublin Core 기반 구조화\r\n* **통계 분석** — 페이지별 열람 횟수, 체류 시간, 검색어 분석 등 행동 데이터 수집\r\n* **내부 업무 시스템 연결** — ERP, DMS, 전자결재 시스템 등 엔터프라이즈 연계\r\n\r\n단순한 파일 열람 도구가 아니라, 문서를 살아있는 \u003Cstrong>디지털 자산(Digital Asset)\u003C\u002Fstrong>으로 운영할 수 있는 데이터 인프라를 제공합니다. 콘텐츠가 축적될수록 검색 품질이 높아지고, 시스템 연계 범위도 확장되는 구조입니다.\r\n\r\n---\r\n\r\n## 4. 외부 의존성을 줄인 Self-contained e-Book 구조\r\n\r\n리프아이티 고객사 중 상당수는 공공기관, 대기업, 교육기관 등 보안 요구사항이 높은 환경입니다. 특히 폐쇄망(Air-gap Network) 및 망분리 환경에서는 외부 CDN, 외부 API, 클라우드 의존 리소스 사용이 구조적으로 차단되는 경우가 많습니다.\r\n\r\n많은 최신 웹 솔루션들은 Google Fonts, jsDelivr, Cloudflare CDN 등 외부 리소스에 의존하여 동작하기 때문에, 폐쇄망에서는 화면 자체가 깨지거나 기능이 마비되는 상황이 발생합니다. 이런 환경에서의 납품 경험이 없는 솔루션이라면 현장 적용 단계에서 반드시 문제가 드러납니다.\r\n\r\n리프아이티는 이러한 운영 환경을 사전에 고려하여 다음과 같은 **Zero-Dependency 구조**로 설계합니다.\r\n\r\n* **Zero-Dependency 구조** — 외부 연결 없이 100% 자체 동작 가능\r\n* **내부 패키징 기반 리소스 관리** — 폰트, 아이콘, JS 라이브러리 전부 내부 탑재\r\n* **로컬 엔진 기반 운영** — 외부 연계 없이 단독 구동 가능한 경량 구조 지원\r\n* **외부망 비의존 구조** — 네트워크 상태에 관계없이 전 기능 정상 동작 보장\r\n\r\n인터넷 연결이 차단된 환경에서도 검색, 뷰어, 접근성 기능이 안정적으로 동작할 수 있도록 설계되어 있습니다. 이는 실제 공공기관 폐쇄망 납품 경험이 없으면 쉽게 고려하기 어려운 영역입니다.\r\n\r\n> 리프아이티 e-Book 기술은 외부 리소스를 단순히 내부에 포함한 방식이 아니라, 제작 엔진, 뷰어, 관리자 기능, 검색 \u002F 통계 구조를 자체 시스템 중심으로 구성해 폐쇄망과 내부망 환경에서도 독립적으로 운영될 수 있도록 설계되어 있습니다.\r\n\r\n---\r\n\r\n## 5. 실무 환경에서 증명된 기술 — 운영 노하우의 차이\r\n\r\n화려한 화면 효과나 페이지 넘김 애니메이션은 비교적 쉽게 구현할 수 있습니다. 하지만 기술력은 다음의 영역에서 드러납니다.\r\n\r\n1. **접근성 환경에 대한 완벽한 이해** — KWCAG 2.1, WAI-ARIA 1.2, WCAG 2.2 기준 구조 설계\r\n2. **대용량 문서 운영 노하우** — 수천 건 이상의 문서를 안정적으로 색인 · 서비스하는 경험\r\n3. **데이터 구조 관리 및 설계 능력** — 텍스트 파싱부터 DB 스키마 설계까지 일관된 구조 유지\r\n4. **폐쇄망 및 보안 환경 대응력** — 실제 납품 이후 운영 단계까지 검증된 Self-contained 설계\r\n5. **검색 인덱싱 최적화** — 색인, 동의어 처리, 가중치 설정 등 검색 품질 향상\r\n6. **멀티 디바이스 렌더링 대응** — PC, 태블릿, 모바일 등 다양한 해상도와 DPI 환경 최적화\r\n7. **장기 유지보수 안정성** — 납품 이후 수년간 운영되는 기관 환경에서의 버전 관리 전략\r\n\r\n리프아이티는 약 20년에 가까운 전자출판 및 디지털 간행물 구축 경험을 바탕으로, 단순 화면 출력이 아닌 **\"콘텐츠 데이터 구조\" 자체를 설계**해왔습니다. 이 경험은 짧은 기간에 축적될 수 있는 성질의 것이 아닙니다.\r\n\r\n---\r\n\r\n## 6. 기술을 넘어 — 지속 가능한 디지털 자산 관리 전략\r\n\r\ne-Book 솔루션을 선택할 때 많은 담당자들이 초기 도입 비용과 UI 완성도를 기준으로 판단합니다. 그러나 실제 운영 관점에서 더 중요한 것은, **5년 후에도 데이터가 재활용 가능한가**, **기관의 보안 정책이 바뀌어도 구조가 유지되는가**, **새로운 보조기기 표준이 등장해도 대응이 가능한가**입니다.\r\n\r\n> 리프아이티가 설계하는 e-Book 구조는 다음 기준을 전제로 합니다.\r\n\r\n* **콘텐츠 수명 주기(Content Lifecycle) 관리** — 발행부터 아카이빙까지 일관된 데이터 흐름\r\n* **확장 가능한 API 구조** — 미래 시스템 연계를 고려한 RESTful 인터페이스 설계\r\n* **표준 기반 마크업** — HTML5 시맨틱 구조 및 ARIA 랜드마크 기반 콘텐츠 조직화\r\n\r\n단기적 완성도보다 장기적 운영 안정성을 최우선으로 고려하는 것. 그것이 리프아이티가 공공기관과 교육기관에서 반복적으로 선택받아온 이유입니다.\r\n\r\n---\r\n\r\n## 보이지 않는 데이터 레이어까지 고려하는 것\r\n> 이것이 리프아이티 e-Book 솔루션의 독보적인 기술적 차별점입니다.\r\n\r\n---\r\n\r\n#### Technical Keywords\r\n`리프아이티` `e-Book 솔루션` `웹 접근성` `스크린리더 대응` `PDF 텍스트 추출` `Text Parsing` `Data Layering` `Full-text Search` `디지털 아카이빙`\r\n\r\n---\r\n\r\n* [리프아이티 e-Book 솔루션 구조와 핵심 기술 자세히 보기](\u002Fsolution)  \r\n* [ASP 기반 e-Book 운영 및 통계 고도화 상담 안내](\u002Fasp)  \r\n* [데이터 기반 e-Book 구축 및 분석 문의하기](\u002Fcontact-us)\r\n\r\n작성자 : (주)리프아이티 ICT사업본부",1778128890635]