GNB 메뉴 구조 설계

SI-DATA 문서 / SI-DATA 신규 콘텐츠 설계 문서

작성일: 2026-03-05
버전: 1.2

1. 개요

SI-DATA(서울연구데이터서비스) 웹사이트의 신규 GNB(Global Navigation Bar) 메뉴 구조 설계 문서입니다. 기존 9개 ITEM 타입을 콘텐츠 성격별로 그룹핑하여 5개 GNB 메뉴로 재구성합니다.

1.1 현행 GNB 구조

#	메뉴명	비고
1	데이터로 본 서울	메가 메뉴로 하위 서비스 노출
2	사진으로 본 서울	단일 메뉴
3	이용안내	단일 메뉴

1.2 변경 배경

기존 3개 메뉴로는 9개 ITEM 타입을 체계적으로 노출하기 어려움
“도시 모니터링”이 가장 업데이트가 활발하나 메가 메뉴 하위에 묻혀 있음
콘텐츠 성격이 다른 ITEM 타입들이 하나의 메뉴 아래에 혼재

1.3 현행 → 신규 변경점 요약

구조 변경

항목	현행	신규
GNB 메뉴 수	3개	5개
메뉴 구성	데이터로 본 서울 / 사진으로 본 서울 / 이용안내	도시 모니터링 / 데이터로 본 서울 / 사진으로 본 서울 / 조사데이터 / 근현대유산
하위 메뉴 방식	메가 메뉴 1개에 모든 서비스 혼재	메뉴별 성격에 맞는 2depth (탭 바, 섹션 분할, 직행)
이용안내 위치	GNB 3번 메뉴	유틸리티 영역(헤더 우측 상단) + 푸터

콘텐츠 재배치

현행 위치	콘텐츠	신규 위치
데이터로 본 서울 > 메가 메뉴	서울도시기본계획 모니터링 리포트	도시 모니터링 (GNB 1번 독립)
데이터로 본 서울 > 메가 메뉴	지도·지표·통계로 본 서울	데이터로 본 서울 하위 유지
데이터로 본 서울 > 메가 메뉴	Seoul Data Viz. (데이터로 본 서울)	데이터로 본 서울 하위 유지
데이터로 본 서울 > 메가 메뉴	서울과 세계대도시	데이터로 본 서울 하위 (볼륨 소)
데이터로 본 서울 > 메가 메뉴	조사데이터	조사데이터 (GNB 4번 독립)
데이터로 본 서울 > 메가 메뉴	서울의 근현대유산	근현대유산 (GNB 5번 독립)
GNB 2번	사진으로 본 서울	사진으로 본 서울 유지 (GNB 3번)
GNB 3번	이용안내	GNB에서 제외 → 유틸리티 영역

핵심 설계 결정

결정 사항	내용
GNB 순서 원칙	업데이트 빈도 순 (도시 모니터링이 가장 앞)
도시 모니터링 독립	가장 활발한 콘텐츠가 메가 메뉴 하위에 묻혀 있던 문제 해결
인사이트 리포트	별도 메뉴 없이 각 ITEM 타입 콘텐츠에 삽입
서울과 세계대도시	볼륨이 작아 독립 메뉴 대신 “데이터로 본 서울” 하위에 포함
패싯 필터	목록 페이지가 아닌 검색 조회 페이지에 배치

2. 신규 GNB 메뉴 구조

2.1 GNB 5개 메뉴

1. 도시 모니터링              ← 업데이트 가장 활발, GNB 1번
   ├── 2024 도시 모니터링
   ├── 2023 도시 모니터링
   ├── 2022 도시 모니터링
   ├── 2021 도시 모니터링
   └── 2015~2020 도시 모니터링

2. 데이터로 본 서울            ← 5개 ITEM 타입 상위 그룹
   ├── 지도로 본 서울          (탭: 2013 | 2007 | 2000)
   ├── 지표로 본 서울          (탭: 2015 | 2010 | 2003)
   ├── 통계로 본 서울          (탭: 인구 | 경제 | 교통 | 주거 | 영문판)
   ├── 데이터로 본 서울
   └── 서울과 세계대도시

3. 사진으로 본 서울            ← 목록 페이지 직행

4. 조사데이터                  ← 목록 페이지 직행

5. 근현대유산                  ← 목록 페이지 직행

2.2 메뉴 순서 원칙

최신 데이터가 가장 중요 — 업데이트 빈도가 높은 콘텐츠가 GNB 앞쪽에 위치합니다.

순서	메뉴	업데이트 빈도	하위 메뉴
1	도시 모니터링	★★★★★	연도별 ITEM명 5개
2	데이터로 본 서울	★★★★	ITEM 타입 5개
3	사진으로 본 서울	★★★	없음 (목록 직행)
4	조사데이터	★★	없음 (목록 직행)
5	근현대유산	★	없음 (목록 직행)

2.3 “이용안내” 위치

GNB에서 제외하고 유틸리티 영역(헤더 우측 상단)으로 이동합니다.

┌─────────────────────────────────────────────────────────────┐
│  [로고]                                    이용안내 | 검색  │ ← 유틸리티 영역
├─────────────────────────────────────────────────────────────┤
│  도시 모니터링  데이터로 본 서울  사진  조사데이터  근현대유산  │ ← GNB
└─────────────────────────────────────────────────────────────┘

유틸리티 영역: 헤더 우측 상단에 “이용안내” 링크 배치
푸터: 이용안내 링크 중복 배치
근거: 유사 사이트(data.go.kr, data.seoul.go.kr, KOSIS) 모두 이용안내를 GNB가 아닌 유틸리티/푸터 영역에 배치

3. ITEM 타입 ↔ GNB 메뉴 매핑

3.1 매핑 테이블

GNB 메뉴	ITEM 타입 (depth 0)	TID	ITEM명 (depth 1) 수
도시 모니터링	서울도시기본계획 모니터링	347	5개 (연도별)
데이터로 본 서울	지도로 본 서울	344	3개 (2000, 2007, 2013)
	지표로 본 서울	345	3개 (2003, 2010, 2015)
	통계로 본 서울	346	5개 (인구, 경제, 교통, 주거, 영문판)
	데이터로 본 서울	342	1개
	서울과 세계대도시	343	1개
사진으로 본 서울	디지털 사진	350	1개
조사데이터	조사데이터	348	1개
근현대유산	서울의 근현대유산	349	1개

3.2 메뉴명 변경 사항

GNB 메뉴명	ITEM 타입 원래 명칭	변경 유형
도시 모니터링	서울도시기본계획 모니터링	축약
데이터로 본 서울	(신규 상위 그룹)	신규
사진으로 본 서울	디지털 사진	변경
조사데이터	조사데이터	유지
근현대유산	서울의 근현대유산	축약

3.3 인사이트 리포트 처리

인사이트 리포트(report_content)는 별도 GNB 메뉴를 갖지 않습니다. 각 ITEM 타입의 콘텐츠 내에 삽입되는 구조입니다.

4. 2depth 구조의 비대칭

GNB 메뉴에 따라 2depth의 성격이 다릅니다. 이는 콘텐츠 특성상 자연스러운 것이지만, 구현 시 메뉴 ↔ ITEM 계층 매핑 로직이 달라집니다.

GNB 메뉴	2depth 성격	ITEM 서비스 depth	설명
도시 모니터링	ITEM명 (연도별 발간물)	depth 1	각 연도가 하나의 서비스
데이터로 본 서울	ITEM 타입 (서비스 종류)	depth 0	여러 ITEM 타입을 하나의 상위 그룹으로 묶음
사진으로 본 서울	(2depth 없음)	—	목록 페이지 직행
조사데이터	(2depth 없음)	—	목록 페이지 직행
근현대유산	(2depth 없음)	—	목록 페이지 직행

구현 시 주의: “도시 모니터링”의 2depth는 field_service depth 1 term을 사용하고, “데이터로 본 서울”의 2depth는 field_service depth 0 term을 사용합니다.

5. 1depth 목록 페이지 설계

각 GNB 메뉴의 1depth 클릭 시 표시되는 페이지 구조입니다.

5.1 도시 모니터링 — 탭 바 + 차별화 허용

1depth 클릭 시 최신 연도(2024) 목록으로 직행하되, 상단에 연도 탭 바를 배치하여 연도 전환을 용이하게 합니다.

┌─────────────────────────────────────────────────────┐
│  도시 모니터링                                         │
│                                                      │
│  [2024]  [2023]  [2022]  [2021]  [2015~2020]         │
│  ═════                                               │
│                                                      │
│  ┬ 2024 선택 시: 풍부한 카테고리별 콘텐츠 목록 ─────────   │
│  │ 카테고리A  카테고리B  카테고리C ...                    │
│  │ ┌──────┐ ┌──────┐ ┌──────┐                        │
│  │ │콘텐츠1│ │콘텐츠1│ │콘텐츠1│                        │
│  │ │콘텐츠2│ │콘텐츠2│ │콘텐츠2│                        │
│  │ │ ...  │ │ ...  │ │ ...  │                        │
│  │ └──────┘ └──────┘ └──────┘                        │
│  ┘                                                   │
│                                                      │
│  ┬ 2023 선택 시: 요약 카드형 ────────────────────────   │
│  │ ┌─────────────────────────────────────────┐       │
│  │ │ 📖 표지     서울 도시변화 진단             │       │
│  │ │            성과 및 추진과정 진단          │       │
│  │ │            설문조사                     │       │
│  │ │                                        │       │
│  │ │    [도시변화 진단] [주목할 현주소] [성과]  │       │
│  │ └─────────────────────────────────────────┘       │
│  ┘                                                   │
└─────────────────────────────────────────────────────┘

연도별 콘텐츠 볼륨 차이:

연도	콘텐츠 구조	볼륨
2024	카테고리별 수십 개 콘텐츠	★★★★★
2023	요약 소개 + 3~4개 바로가기 링크	★★
2022	유사하게 소량	★★
2021	유사하게 소량	★★
2015~2020	통합, 소량	★

이 비대칭은 허용합니다. 2024는 풍부한 카테고리 목록, 과거 연도는 요약 카드+링크 형태로 차별화된 표시를 합니다.

5.2 데이터로 본 서울 — 섹션 분할형

1depth 클릭 시 5개 ITEM 타입별 섹션으로 나뉜 종합 목록 페이지를 표시합니다.

┌─────────────────────────────────────────┐
│  데이터로 본 서울                          │
├─────────────────────────────────────────┤
│                                         │
│  📍 지도로 본 서울                   더보기→│
│  ┌──────┐ ┌──────┐ ┌──────┐            │
│  │ 2013 │ │ 2007 │ │ 2000 │            │
│  └──────┘ └──────┘ └──────┘            │
│                                         │
│  📊 지표로 본 서울                   더보기→│
│  ┌──────┐ ┌──────┐ ┌──────┐            │
│  │ 2015 │ │ 2010 │ │ 2003 │            │
│  └──────┘ └──────┘ └──────┘            │
│                                         │
│  📈 통계로 본 서울                   더보기→│
│  ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐   │
│  │ 인구 │ │ 경제 │ │ 교통 │ │ 주거 │   │
│  └──────┘ └──────┘ └──────┘ └──────┘   │
│                                         │
│  💾 데이터로 본 서울                 더보기→│
│  ┌──────┐ ┌──────┐ ┌──────┐ ┌──────┐   │
│  │      │ │      │ │      │ │      │   │
│  └──────┘ └──────┘ └──────┘ └──────┘   │
│                                         │
│  🌏 서울과 세계대도시                더보기→│
│  ┌──────┐ ┌──────┐ ┌──────┐            │
│  │      │ │      │ │      │            │
│  └──────┘ └──────┘ └──────┘            │
└─────────────────────────────────────────┘

각 섹션은:

ITEM명(하위 콘텐츠)을 카드로 3~4개 표시
“더보기” 링크로 해당 ITEM 타입의 전체 목록 페이지로 이동

5.3 사진으로 본 서울 / 근현대유산 — 목록 직행

하위 메뉴 없이 바로 콘텐츠 목록 페이지로 이동합니다. 카드 그리드 형태의 기본 목록을 표시합니다.

5.4 조사데이터 — 목록 페이지 상세 설계

조사데이터(TID 348)도 목록 직행이지만, 현행 페이지에 UX 문제가 많아 별도로 설계합니다.

현행 URL: https://data.si.re.kr/node/65387
데이터 소스: survey_content 엔터티 (약 50여 종)
패싯 필터는 검색/조회 페이지에서 처리 — 목록 페이지는 깔끔한 2영역 구조에 집중

현행 문제점

#	문제	설명
1	상단 카드 과도한 영역	주요 4개 카드가 화면 대부분을 차지 → 하단 목록 탐색 전 과도한 스크롤 필요
2	페이지당 4개만 노출	50여 종인데 13+ 페이지 필요 → 탐색 효율 극히 낮음
3	추천 카드 반복	상단 추천 카드 4개가 모든 페이지에 반복 노출 → 스크롤 낭비
4	배지 클릭 불가	분류 배지(사회/교통/복지 등)가 `href="#"` → 아무 동작 없음
5	정렬 없음	최신순/제목순 등 정렬 옵션 전무
6	정보 밀도 낮음	데이터 연도, 첨부파일 유무 등 핵심 정보 부재

핵심 설계 원칙: 2영역 구조

조사데이터는 성격이 다른 두 그룹으로 나뉩니다:

구분	항목 수	썸네일	특징
주요 조사데이터	4개	✅ 있음	매년 반복 실시하는 핵심 조사 (청년패널조사, 서울서베이, 서울복지실태조사, 가구통행실태조사)
일반 조사데이터	~46개	❌ 없음	개별/단발성 조사 → 한 번에 많이 보여줘야 함

따라서 상단은 컴팩트 카드형, 하단은 리스트(목록)형으로 분리합니다.

핵심 변경 사항

항목	현행	개선
레이아웃	카드 그리드 단일 구조	2영역 (상단 카드 + 하단 리스트)
상단 카드	대형 세로 카드 × 4 (과도한 영역)	컴팩트 가로형 카드 × 4 (영역 축소)
상단 반복	모든 페이지에 반복	첫 페이지에만 표시
하단 목록	카드형 4개/페이지	리스트형 15~20개/페이지
배지	클릭 불가	클릭 → 검색 페이지 이동
정렬	없음	최신순(기본) / 가나다순
메타데이터	없음	데이터 연도 + 첨부파일 아이콘

페이지 레이아웃

┌──────────────────────────────────────────────────────────────┐
│  Home > 조사데이터                                              │
├──────────────────────────────────────────────────────────────┤
│  조사데이터                                                    │
│  서울시 주요 조사 데이터를 확인할 수 있습니다.                    │
├──────────────────────────────────────────────────────────────┤
│                                                               │
│  ■ 주요 조사데이터 ─────────────────── (첫 페이지에만 표시)     │
│                                                               │
│  ┌─────────────────────────────┐ ┌─────────────────────────────┐│
│  │ [Thumb] 청년패널조사        │ │ [Thumb] 서울서베이           ││
│  │         2024년 자료  →      │ │         2023년 자료  →      ││
│  └─────────────────────────────┘ └─────────────────────────────┘│
│  ┌─────────────────────────────┐ ┌─────────────────────────────┐│
│  │ [Thumb] 서울복지실태조사    │ │ [Thumb] 가구통행실태조사    ││
│  │         2024년 자료  →      │ │         2020년 자료  →      ││
│  └─────────────────────────────┘ └─────────────────────────────┘│
│                                                               │
├──────────────────────────────────────────────────────────────┤
│                                                               │
│  ■ 전체 조사데이터                                             │
│                                                               │
│  총 52건                             정렬: [ 최신순 v ]        │
│                                                               │
│  ┌────────────────────────────────────────────────────────┐   │
│  │ [사회] 서울서베이(2021)              2021년 자료  📎   │   │
│  ├────────────────────────────────────────────────────────┤   │
│  │ [교통] 가구통행실태조사(1996~2020)   2020년 자료  📎   │   │
│  ├────────────────────────────────────────────────────────┤   │
│  │ [복지] 서울복지실태조사(2022)        2022년 자료  📎   │   │
│  ├────────────────────────────────────────────────────────┤   │
│  │ [복지] 서울복지실태조사(2024)        2024년 자료  📎   │   │
│  ├────────────────────────────────────────────────────────┤   │
│  │ [사회] 서울시민 행복 실태조사         2023년 자료       │   │
│  ├────────────────────────────────────────────────────────┤   │
│  │  ...                                                  │   │
│  ├────────────────────────────────────────────────────────┤   │
│  │ [인구] 서울시 1인가구 실태조사        2022년 자료  📎   │   │
│  └────────────────────────────────────────────────────────┘   │
│                                                               │
│                    <  1  2  3  >                               │
└──────────────────────────────────────────────────────────────┘

상단 — 주요 조사데이터 카드 (4개 고정)

컴팩트 가로형 카드로, 썸네일과 제목을 한 줄에 배치하여 영역을 최소화합니다.

┌──────────────────────────────────────────┐
│ ┌──────┐                                 │
│ │Thumb │  **청년패널조사**                │
│ │80x80 │  2024년 자료                    │
│ │      │  서울 청년의 생활 변화를 추...  →│
│ └──────┘                                 │
└──────────────────────────────────────────┘

필드 매핑 (상단 카드):

UI 요소	필드	설명
썸네일	`field_thumbnail`	80×80px 정사각, 1:1 비율
제목	`title`	클릭 → 상세 페이지 이동
데이터 연도	`field_data_year`	”20XX년 자료”
요약	`body` (summary)	`line-clamp: 1`, 최대 1줄

표시 규칙:

첫 페이지(page=1)에만 표시, 2페이지 이후에는 숨김
고정 4개: 청년패널조사, 서울서베이, 서울복지실태조사, 가구통행실태조사
2열 × 2행 = 총 4개, 화면 상단 약 200px 이내로 영역 제한

하단 — 전체 조사데이터 리스트

썸네일이 없는 ~46개 항목을 리스트(테이블)형으로 한 번에 많이 보여줍니다.

┌────────────────────────────────────────────────────────────┐
│ [주제배지]  제목 (title)                  연도자료    📎   │
├────────────────────────────────────────────────────────────┤
│ [사회]     서울서베이(2021)               2021년 자료  📎  │
│ [교통]     가구통행실태조사(1996~2020)    2020년 자료  📎  │
│ [복지]     서울복지실태조사(2022)         2022년 자료  📎  │
│ [인구]     서울시 1인가구 실태조사         2022년 자료  📎  │
│ [사회]     서울시민 행복 실태조사          2023년 자료      │
│ ...                                                       │
└────────────────────────────────────────────────────────────┘

필드 매핑 (하단 리스트):

UI 요소	필드	설명
주제 배지	`field_topic`	클릭 → 검색 페이지(`?topic={term}`)
제목	`title`	클릭 → 상세 페이지 이동
데이터 연도	`field_data_year`	우측 “20XX년 자료”
첨부파일	`field_attached_file`	파일 있을 때만 📎 아이콘

리스트 표시 규칙:

페이지당 15~20개 항목 (50여 종 기준 3~4페이지면 전체 탐색 가능)
행 높이 고정 (padding 포함 약 48~56px) → 스캔 효율 극대화
짝수/홀수 행에 미세한 배경색 차이(zebra striping)로 가독성 향상
썸네일 없음 — 일반 조사데이터에는 이미지가 없으므로 불필요

정렬

정렬 옵션	기준 필드	기본값
최신순	`field_date` DESC	기본
가나다순	`title` ASC	—

반응형

구간	상단 카드	하단 리스트
Desktop (1024px+)	2열 × 2행	풀 폭 리스트 (배지 + 제목 + 연도 + 첨부파일 한 줄)
Tablet (768~1023px)	2열 × 2행	풀 폭 리스트 유지
Mobile (~767px)	1열 × 4행 (카드 스택)	제목 + 배지 줄바꿈, 연도·첨부파일은 제목 아래 2행

6. 2depth 클릭 시 동작

6.1 기본 동작

2depth 클릭 시 최신 ITEM명 목록으로 이동합니다.

“지도로 본 서울” 클릭 → 2013 최신 콘텐츠 목록 표시, 탭으로 2007/2000 전환
“지표로 본 서울” 클릭 → 2015 최신 콘텐츠 목록 표시, 탭으로 2010/2003 전환
“통계로 본 서울” 클릭 → 인구 최신 콘텐츠 목록 표시, 탭으로 경제/교통/주거/영문판 전환

6.2 통계로 본 서울 탭 순서

순서	탭명	ITEM명 TID
1	인구	283
2	경제	284
3	교통	285
4	주거	286
5	Seoul Statistical Series (영문판)	287

참고: design-overview.md에는 TID 285를 “교통”으로 기록되어 있습니다. 실제 CMS의 택소노미 term 라벨을 확인하여 정확한 명칭을 검증할 필요가 있습니다.

7. 검색/필터 패싯

3개 공통 분류 택소노미(주제분류, 시기분류, 형태분류)는 검색 조회 페이지에 배치합니다.

분류명	필드명	배치 위치
주제분류	`field_topic`	검색 조회 페이지
시기분류	`field_decade`	검색 조회 페이지
형태분류	`field_format`	검색 조회 페이지

목록 페이지(1depth, 2depth)에는 패싯 필터를 노출하지 않습니다.

8. 브레드크럼 구조

각 GNB 메뉴별 브레드크럼 경로입니다.

도시 모니터링
  도시 모니터링 > 2024 도시 모니터링 > [카테고리명] > [콘텐츠 제목]

데이터로 본 서울
  데이터로 본 서울 > 지도로 본 서울 > 지도로 본 서울 2013 > [카테고리명] > [콘텐츠 제목]
  데이터로 본 서울 > 지표로 본 서울 > 지표로 본 서울 2015 > [카테고리명] > [콘텐츠 제목]
  데이터로 본 서울 > 통계로 본 서울 > 통계로 본 서울 인구 > [카테고리명] > [콘텐츠 제목]
  데이터로 본 서울 > 데이터로 본 서울 > [카테고리명] > [콘텐츠 제목]
  데이터로 본 서울 > 서울과 세계대도시 > [카테고리명] > [콘텐츠 제목]

사진으로 본 서울
  사진으로 본 서울 > [콘텐츠 제목]

조사데이터
  조사데이터 > [콘텐츠 제목]

근현대유산
  근현대유산 > [콘텐츠 제목]

9. 구현 시 고려사항

9.1 메뉴 ↔ ITEM 계층 매핑 로직 차이

GNB 메뉴	매핑 방식	설명
도시 모니터링	1:1 (단일 ITEM 타입)	TID 347의 depth 1 term이 2depth 메뉴
데이터로 본 서울	N:1 (5개 ITEM 타입 → 1개 GNB)	TID 342, 343, 344, 345, 346이 2depth 메뉴
사진/조사/근현대	1:1 (단일 ITEM 타입)	2depth 없이 목록 직행

9.2 URL 구조 (제안)

메뉴	URL 패턴
도시 모니터링	`/monitoring`
도시 모니터링 > 2024	`/monitoring/2024`
데이터로 본 서울	`/data`
데이터로 본 서울 > 지도로 본 서울	`/data/map-seoul`
사진으로 본 서울	`/photo`
조사데이터	`/survey`
근현대유산	`/heritage`

9.3 미결정 사항

각 카드 컴포넌트의 상세 디자인 (썸네일, 제목, 설명, 날짜 등)
반응형 브레이크포인트별 레이아웃
“데이터로 본 서울” 섹션 분할형의 카드 표시 개수 (3개 vs 4개)
도시 모니터링 과거 연도 요약 카드의 상세 구성

변경 이력

버전	날짜	변경 내용
1.0	2026-03-05	초기 문서 작성 — GNB 5개 메뉴 구조, 매핑, 목록 페이지, 브레드크럼 확정
1.1	2026-03-05	5.4절 조사데이터 목록 페이지 UX 설계 추가 (현행 문제점, 카드 컴포넌트, 필드 매핑, 반응형)
1.2	2026-03-05	5.4절 2영역 구조로 재설계 — 상단 컴팩트 카드 4개(주요 조사) + 하단 리스트형(일반 조사 ~~46개, 15~~20개/페이지). 사용자 피드백 반영: 카드 영역 축소, 썸네일 없는 항목은 리스트형으로 전환

GNB 메뉴 구조 설계

이 문서 인쇄

섹션 전체 인쇄

GNB 메뉴 구조 설계

1. 개요

1.1 현행 GNB 구조

1.2 변경 배경

1.3 현행 → 신규 변경점 요약

구조 변경

콘텐츠 재배치

핵심 설계 결정

2. 신규 GNB 메뉴 구조

2.1 GNB 5개 메뉴

2.2 메뉴 순서 원칙

2.3 “이용안내” 위치

3. ITEM 타입 ↔ GNB 메뉴 매핑

3.1 매핑 테이블

3.2 메뉴명 변경 사항

3.3 인사이트 리포트 처리

4. 2depth 구조의 비대칭

5. 1depth 목록 페이지 설계

5.1 도시 모니터링 — 탭 바 + 차별화 허용

5.2 데이터로 본 서울 — 섹션 분할형

5.3 사진으로 본 서울 / 근현대유산 — 목록 직행

5.4 조사데이터 — 목록 페이지 상세 설계

현행 문제점

핵심 설계 원칙: 2영역 구조

핵심 변경 사항

페이지 레이아웃

상단 — 주요 조사데이터 카드 (4개 고정)

하단 — 전체 조사데이터 리스트

정렬

반응형

6. 2depth 클릭 시 동작

6.1 기본 동작

6.2 통계로 본 서울 탭 순서

7. 검색/필터 패싯

8. 브레드크럼 구조

9. 구현 시 고려사항

9.1 메뉴 ↔ ITEM 계층 매핑 로직 차이

9.2 URL 구조 (제안)

9.3 미결정 사항

변경 이력