블로그 on SITE

1

Mon, 01 Jan 0001 00:00:00 +0000

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

중소기업이 SaaS를 도입할 때 가장 많이 막히는 지점은 기능 비교가 아니라 보안 질문서입니다. 가격이 맞고, 기능도 충분하고, 도입 효과도 기대되는데 마지막 순간에 멈추는 이유는 대체로 같습니다.

2

Mon, 01 Jan 0001 00:00:00 +0000

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

3

Mon, 01 Jan 0001 00:00:00 +0000

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

4

Mon, 01 Jan 0001 00:00:00 +0000

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

5

Mon, 01 Jan 0001 00:00:00 +0000

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

CTA

Mon, 01 Jan 0001 00:00:00 +0000

cta

테스트 목적

CTA는 사용자가 다음 행동을 선택하는 지점입니다. 너무 약하면 눈에 띄지 않고, 너무 강하면 본문을 압도합니다.

확인 항목

행동 문구가 짧고 분명한가
보조 설명이 있더라도 주 행동을 가리지 않는가
외부 링크와 내부 링크가 구분되는가

예시

구조 검토 요청

평일 기준 1영업일 내 확인

cta-all-empty

Mon, 01 Jan 0001 00:00:00 +0000

{{< cta
  kind=""
  label=""
  href=""
  ref=""
  intent=""
  priority=""
  surface=""
  size=""
  tone=""
  align=""
  target=""
  rel=""
  note=""
  subtitle=""
  aria_label=""
  badge=""
  tracking_id=""
  analytics_event=""
  id=""
  class=""
  compact=""
  disabled="" >}}

cta-default-only

Mon, 01 Jan 0001 00:00:00 +0000


{{< cta
  kind="default"
  label="자세히 보기"
  href="/contact/"
  ref=""
  intent="generic"
  priority="secondary"
  surface="after-content"
  size="md"
  tone="neutral"
  align="center"
  target="_self"
  rel=""
  note=""
  subtitle=""
  aria_label=""
  badge=""
  tracking_id=""
  analytics_event=""
  id=""
  class=""
  compact="false"
  disabled="false" >}}

cta-enum-commented

Mon, 01 Jan 0001 00:00:00 +0000

OFFICIAL외부 문서 열기공식 문서

새 창에서 열립니다


<!--
CTA shortcode keys (known preset / enum-like values)

kind (known presets used in this pack):
default | external | related | consult | download | newsletter | trial | price_check | utility | custom | copy | internal | custom_offer
unknown kind examples fall back to default behavior.

priority:
primary | secondary | tertiary | utility

surface:
inline | hero | in-content | after-content | footer | sidebar | header

size:
xs | sm | md | lg | xl

tone:
brand | accent | neutral | muted | success | warning | danger

align:
left | center | right | stretch

target:
_self | _blank
-->
{{< cta
  kind="external"
  label="외부 문서 열기"
  href="https://example.com/docs"
  ref="/blog/"
  intent="external"
  priority="primary"
  surface="hero"
  size="lg"
  tone="brand"
  align="center"
  target="_blank"
  rel="noopener noreferrer"
  note="새 창에서 열립니다"
  subtitle="공식 문서"
  aria_label="외부 문서 열기"
  badge="OFFICIAL"
  tracking_id="cta-docs-hero"
  analytics_event="cta_docs_open"
  id="cta-docs-hero"
  class="is-promo"
  compact="true"
  disabled="false" >}}

figure

Mon, 01 Jan 0001 00:00:00 +0000

클릭하여 원본 보기

" target="<nil>" rel="<nil>">

민감한 예시 이미지 ">

{{< figure
  src="https://res.cloudinary.com/dhfuy7rvysadf/image/upload/v1782785290/5._sample-migration-validation-dashboard_b2mfca.png"
  alt="Private example"
  caption="민감한 예시 이미지"
  privacy=true
  privacy_mode="blur"
  privacy_strength=18
  privacy_overlay_opacity=0.62
  privacy_message="클릭하여 원본 보기"
  privacy_label="원본 이미지를 보려면 선택하세요"
  privacy_click_to_reveal=true >}}

모자이크 처리된 이미지

" target="<nil>" rel="<nil>">

가림 방식 예시 ">

figure2

Mon, 01 Jan 0001 00:00:00 +0000

블러 처리된 이미지 — 클릭하여 원본 보기

보안 검토 예시

편집용 예시 이미지 OpenAI Design Team

블러 처리된 이미지 — 클릭하여 원본 보기

보안 검토 예시

편집용 예시 이미지 ">OpenAI Design Team

figure3

Mon, 01 Jan 0001 00:00:00 +0000

블러 처리된 이미지 — 클릭하여 원본 보기

보안 검토 예시

편집용 예시 이미지 ">OpenAI Design Team

블러 처리된 이미지 — 클릭하여 원본 보기

보안 검토 예시

편집용 예시 이미지 ">OpenAI Design Team

taxonomy term

Mon, 01 Jan 0001 00:00:00 +0000

taxonomy term

테스트 목적

term 페이지는 하나의 분류 안에 묶인 글을 적절한 밀도로 나열해야 합니다. 분류명만 보이고 글 목록이 깨지면 의미가 없습니다.

확인 항목

term 제목이 분명한가
관련 글 목록의 밀도가 적절한가
메타 정보가 지나치게 길지 않은가

기대 결과

사용자는 term 페이지에서 주제를 한 번 더 확인하고, 다음 글로 자연스럽게 이동할 수 있어야 합니다.

taxonomy 목록

Mon, 01 Jan 0001 00:00:00 +0000

taxonomy list

테스트 목적

카테고리와 태그의 목록 허브가 값이 없을 때도 화면을 깨지 않는지 확인합니다.

확인 항목

term이 많아졌을 때 정렬이 유지되는가
빈 상태 메시지가 적절한가
다국어에서 taxonomies가 같은 문맥으로 보이는가

기대 결과

taxonomy list는 글을 모으는 허브이면서, 항목이 없을 때도 안내만 남기고 붕괴되지 않아야 합니다.

간격과 레이아웃

Mon, 01 Jan 0001 00:00:00 +0000

spacing layout

테스트 목적

spacing은 요소 간 거리뿐 아니라 페이지의 호흡을 결정합니다. 같은 페이지 안에서도 섹션과 카드와 본문이 서로 다른 리듬을 가져야 합니다.

확인 항목

제목과 본문 사이 간격이 일관적인가
카드 목록의 밀도가 적절한가
모바일에서 여백이 너무 좁거나 넓지 않은가

판정

간격이 일정하면 정보 계층이 보이고, 간격이 무너지면 아무리 좋은 콘텐츠도 조립품처럼 보입니다.

검색

Mon, 01 Jan 0001 00:00:00 +0000

search

테스트 목적

검색은 기능이 보이지 않을 때도 많지만, 막상 사용하면 UI 품질이 바로 드러나는 페이지입니다. 입력 상태, 결과 없음, 결과 목록을 모두 확인합니다.

확인 항목

검색 입력이 명확하게 보이는가
결과 없음 상태가 무너짐 없이 표시되는가
결과가 많아져도 정렬과 탐색이 가능한가
언어별 검색이 예상한 대로 동작하는가

기대 결과

검색은 조용하지만 신뢰가 높아야 합니다. 아무 결과가 없어도 사용자가 다음 행동을 선택할 수 있어야 합니다.

검증 로그

Mon, 01 Jan 0001 00:00:00 +0000

verification log

목적

이 문서는 랩 검증 중에 남기는 결과 기록입니다. 언제 무엇을 확인했고, 무엇이 통과 또는 실패였는지를 간단하지만 재현 가능하게 적습니다.

기록 항목

항목	내용
날짜	검증한 시점
범위	확인한 섹션과 페이지
결과	통과 / 주의 / 실패
메모	재현 가능한 참고 사항

예시 메모

20-page-types: home과 section list가 정상
30-components: buttons와 cards는 통과
40-markup-rendering: raw HTML은 주의 필요

Mon, 01 Jan 0001 00:00:00 +0000

테스트 목적

관련 글은 추천 알고리즘이 아니라 문맥 연결입니다. 비슷한 주제의 글이 너무 멀어지지 않게 배치되어야 합니다.

확인 항목

현재 글과 의미적으로 가까운가
제목과 설명이 중복되지 않는가
항목 수가 과하지 않은가

그림

Mon, 01 Jan 0001 00:00:00 +0000

figures

테스트 목적

figure는 이미지를 설명하고 본문에 다시 연결하는 역할을 합니다. 그림이 있더라도 본문이 끊기지 않아야 합니다.

예시

" target="<nil>" rel="<nil>">

구조 다이어그램

이미지와 캡션이 본문 의미를 보강해야 합니다. ">

기본 shortcode

Mon, 01 Jan 0001 00:00:00 +0000

built-in shortcodes

테스트 목적

Hugo 기본 shortcode는 문서 구조와 별개로 동작해야 합니다. figure, details, raw HTML, embed 계열이 본문 안에서 안전하게 렌더링되는지 봅니다.

예시

" target="<nil>" rel="<nil>">

figure 예시

이미지 shortcode가 본문 레이아웃을 깨지 않아야 합니다. ">

기본 마크다운

Mon, 01 Jan 0001 00:00:00 +0000

markdown basic

테스트 목적

제목, 문단, 목록, 인용, 코드 블록 같은 기본 마크다운 요소가 깨지지 않고 렌더링되는지 확인합니다.

확인 항목

heading 계층이 자연스러운가
list와 blockquote가 본문 리듬을 해치지 않는가
inline code와 code block이 명확히 구분되는가

예시

이 인용은 본문과 같은 폭 안에서 읽혀야 합니다.

긴 글

Mon, 01 Jan 0001 00:00:00 +0000

long post

서론

긴 글은 문서의 체력을 보여 줍니다. 목차, 섹션 구조, 인용, 코드, 이미지, shortcode가 함께 붙을 때도 읽기 리듬이 유지되어야 합니다.

배경

이 글은 단순한 예제가 아니라 실제 운영 글처럼 보이도록 설계했습니다. 긴 글은 중간에 한 번 더 호흡을 정리해 주는 소제목이 필요합니다.

단일 페이지

Mon, 01 Jan 0001 00:00:00 +0000

single page

테스트 목적

본문형 페이지는 제목, 설명, 메타, 목차, 본문 사이의 균형이 중요합니다. 정보가 너무 많으면 산만하고, 너무 적으면 구조가 사라집니다.

확인 항목

제목과 설명이 같은 계층에서 충돌하지 않는가
목차가 필요한 문서에만 적절히 나타나는가
본문 너비와 줄길이가 읽기 좋은가

기대 결과

독자는 이 페이지를 읽으며 구조를 바로 파악하고, 다음 페이지로 이동할 수 있어야 합니다.

디자인 토큰

Mon, 01 Jan 0001 00:00:00 +0000

design tokens

테스트 목적

토큰이 CSS, 템플릿, shortcode에서 같은 의미로 읽히는지 확인합니다. 숫자를 직접 박아 넣는 대신 토큰이 흐르는지 보는 테스트입니다.

확인 항목

기초 값과 의미 값이 구분되는가
컴포넌트가 직접 숫자를 들고 있지 않은가
토큰 변경이 여러 UI에 예측 가능하게 반영되는가

기대 결과

페이지 상단의 핵심 카드, 표, 본문 간격이 같은 시각 언어를 유지해야 합니다.

릴리스 체크리스트

Mon, 01 Jan 0001 00:00:00 +0000

release checklist

점검 항목

content/ko의 경로가 모두 의도한 위치에 있는가
docs와 lab의 역할이 섞이지 않았는가
blog에 검증 전용 글이 들어가지 않았는가
기본 taxonomy와 menu가 연결되는가
TOML front matter가 모두 유효한가
모바일 화면에서 주요 페이지가 깨지지 않는가

릴리스 기준

모든 필수 항목이 통과해야 릴리스 가능합니다. 하나라도 불명확하면 그 항목은 다시 문서화해야 합니다.

메뉴

Mon, 01 Jan 0001 00:00:00 +0000

menus

테스트 목적

메뉴는 content가 아니라 구성 파일에서 관리해야 합니다. 이 페이지는 메뉴 구조를 이해하고, 바뀌어도 어디를 먼저 수정해야 하는지 확인하는 기준입니다.

모션과 형태

Mon, 01 Jan 0001 00:00:00 +0000

motion shape

테스트 목적

모션과 형태는 거의 보이지 않지만 인상을 크게 바꿉니다. 과한 motion은 장식이 되고, 너무 적은 shape는 페이지를 딱딱하게 만듭니다.

확인 항목

hover와 focus 상태가 구분되는가
radius가 카드와 버튼에 같은 문법으로 적용되는가
transition이 빠르되 거슬리지 않는가

기대 결과

레이어는 분명해야 하지만 과장되면 안 됩니다. 부드러우면서도 단정한 느낌이 목표입니다.

배지

Mon, 01 Jan 0001 00:00:00 +0000

badges

테스트 목적

배지는 메인 정보가 아니라 보조 신호입니다. 상태, 분류, 짧은 메타가 본문을 가리지 않는지 확인합니다.

확인 항목

짧은 라벨이 적절한 밀도로 보이는가
배지가 줄바꿈될 때 디자인이 깨지지 않는가
색이 정보의 주인공이 되지 않는가

기대 결과

배지는 시선을 빼앗지 않으면서도 맥락을 보강해야 합니다.

버튼

Mon, 01 Jan 0001 00:00:00 +0000

buttons

테스트 목적

버튼은 사용자의 행동을 유도하는 가장 중요한 상호작용 요소입니다. primary, secondary, external, utility가 같은 시스템 안에서 분리되어 보여야 합니다.

확인 항목

primary 버튼이 가장 먼저 읽히는가
secondary 버튼이 보조 행동으로 인식되는가
external 행동이 내부 이동과 헷갈리지 않는가
긴 라벨이 줄바꿈되어도 버튼 구조가 유지되는가

shortcode 예시

구조 확인 시작

브레드크럼

Mon, 01 Jan 0001 00:00:00 +0000

breadcrumbs

테스트 목적

breadcrumb는 사용자가 지금 어디에 있는지, 어디에서 왔는지 설명합니다. 깊은 구조일수록 중요합니다.

확인 항목

상위 계층이 올바르게 나열되는가
현재 페이지가 마지막에 분명히 표시되는가
모바일에서 길이가 과도하지 않은가

기대 결과

breadcrumb는 현재 문맥을 잃지 않게 해 주는 작은 나침반입니다.

색상과 표면

Mon, 01 Jan 0001 00:00:00 +0000

color surface

테스트 목적

배경과 카드, 보조 표면의 위계가 분리되어야 합니다. 같은 색을 쓰더라도 역할이 다르면 시각적 레이어가 달라 보여야 합니다.

확인 항목

페이지 배경과 카드가 섞이지 않는가
강조 영역이 너무 많지 않은가
라이트와 다크에서 바탕 인상이 유지되는가

시각 샘플

" target="<nil>" rel="<nil>">

표면 레이어

static 이미지를 사용해 figure 렌더링과 비주얼 계층을 함께 점검합니다. ">

섹션 목록

Mon, 01 Jan 0001 00:00:00 +0000

section list

테스트 목적

섹션 목록은 하위 페이지의 질서를 보여 줍니다. 제목, 요약, 카드, 메타가 과도하지 않으면서도 충분히 읽혀야 합니다.

확인 항목

목록 정렬이 예측 가능한가
빈 섹션 상태에서도 UI가 무너지지 않는가
하위 페이지의 요약이 과도하게 길지 않은가

기대 결과

목록 페이지는 많은 정보를 한 화면에 넣는 대신, 사용자가 다음 단계를 고를 수 있게 도와야 합니다.

섹션 페이지

Mon, 01 Jan 0001 00:00:00 +0000

section pages

테스트 목적

섹션 페이지는 하위 콘텐츠를 모으는 허브입니다. 요약, 목록, 읽는 순서가 분명해야 합니다.

확인 항목

섹션 소개와 하위 목록이 충돌하지 않는가
하위 페이지가 많아져도 읽기 쉽나
섹션 허브와 실제 본문이 혼동되지 않는가

알림

Mon, 01 Jan 0001 00:00:00 +0000

alerts

테스트 목적

알림은 주의, 경고, 정보, 성공 상태를 전달합니다. 내용이 짧아도 눈에 띄어야 하지만, 페이지 전체를 지배하면 안 됩니다.

확인 항목

알림이 본문 문단과 혼동되지 않는가
경고와 정보의 계층이 분리되는가
긴 메시지가 들어가도 박스가 무너지지 않는가

raw HTML 예시

검증 알림: 상태 메시지는 본문보다 앞서 읽혀야 합니다.

실패 기준

알림이 본문처럼 보여 버리는 경우
색만 바뀌고 의미 구조가 없는 경우

언어 전환기

Mon, 01 Jan 0001 00:00:00 +0000

language switcher

테스트 목적

언어 전환은 단순히 다른 언어 홈으로 보내는 링크가 아니라, 현재 문서의 대응 번역으로 이동해야 합니다.

확인 항목

현재 페이지가 가능한 경우 같은 문서의 다른 언어로 이동하는가
번역이 없을 때 안전한 대체 경로가 있는가
표기와 순서가 언어별로 일관적인가

운영 원칙

secondary 언어를 준비하지 않았다면 구조만 맞추고 본문은 비워 두는 편이 낫습니다. 잘못된 번역 연결보다 비어 있는 구조가 더 안전합니다.

업그레이드 요약

Mon, 01 Jan 0001 00:00:00 +0000

upgrade summary

이번에 정리한 것

content/ko를 기준 트리로 재정리
docs/content-structure와 docs/design-system을 기준 문서로 정비
lab/hugo-content-lab을 페이지 타입, 컴포넌트, 마크업, 네비게이션, 구조, 운영으로 분리
blog를 실제 발행 글 형식으로 정리
front matter를 TOML 기준으로 통일

영향 범위

폴더	영향
content/ko/docs	기준 문서가 읽기 쉬워짐
content/ko/lab	검증 포인트가 더 세분화됨
content/ko/blog	운영 글과 검증 글이 분리됨
content/ko/categories, tags	taxonomy 진입점이 명확해짐

결론

이번 작업의 핵심은 파일 수를 늘린 것이 아니라, 각 파일의 책임을 분명히 해서 앞으로의 확장이 예측 가능해진 것입니다.

업데이트 로그

Mon, 01 Jan 0001 00:00:00 +0000

update log

변경 기록 형식

항목	설명
날짜	2026-06-23
대상	content/ko 전반
요약	docs와 lab을 중심으로 콘텐츠 구조와 front matter를 정리
영향	탐색, taxonomy, page-hub, shortcode 검증 흐름 개선

메모

모든 콘텐츠는 KO 기준으로 먼저 완성
TOML front matter로 통일
검증용 콘텐츠는 lab에만 배치
운영 글은 blog에서만 유지

엣지 케이스

Mon, 01 Jan 0001 00:00:00 +0000

edge cases

테스트 목적

UI는 정상 입력에서만이 아니라 엣지 케이스에서 얼마나 버티는지로 품질이 드러납니다.

확인 항목

아주 긴 URL이 줄바꿈을 망치지 않는가
한 줄짜리 강한 강조가 과도하지 않은가
영문과 한글이 뒤섞인 긴 단어가 넘치지 않는가

예시

This page keeps long URLs and English phrases readable even when the surrounding content is in Korean.

이 짧은 예시는 오른쪽 방향 컨테이너도 레이아웃을 깨지 않는지 확인하기 위한 메모입니다.

임베드

Mon, 01 Jan 0001 00:00:00 +0000

embeds

테스트 목적

외부 임베드나 iframe은 레이아웃을 크게 흔들 수 있습니다. 폭, 높이, 반응형 처리, 주변 여백을 함께 봅니다.

확인 항목

임베드가 페이지 너비를 넘지 않는가
주변 본문과 간격이 충분한가
로딩 실패 시도 페이지가 무너지지 않는가

메모

실제 외부 서비스가 없어도, 이 페이지는 임베드가 들어오는 자리의 여백과 비율을 검증하는 기준이 됩니다.

중간 글

Mon, 01 Jan 0001 00:00:00 +0000

medium post

중간 길이 글은 가장 현실적인 테스트입니다. 너무 짧지도, 너무 길지도 않기 때문에 본문 리듬과 구성 감각이 드러납니다.

섹션 1

이 문단은 흐름을 확인하기 위한 문장입니다. 한글 설명 사이에 English term이 들어가도 리듬이 유지되어야 합니다.

짧은 글

Mon, 01 Jan 0001 00:00:00 +0000

short post

이 글은 짧지만 구조가 보이도록 작성했습니다. 실제 서비스에서는 짧은 공지나 소개 글이 이런 형식을 자주 씁니다.

확인 포인트

첫 문단만 읽어도 주제가 보이는가
불필요하게 장황하지 않은가
짧아도 결론이 있는가

중간 길이 글 보기

카드

Mon, 01 Jan 0001 00:00:00 +0000

cards

테스트 목적

카드는 내용 묶음의 가장 흔한 표현입니다. 제목, 설명, 메타, 링크가 같은 규칙으로 보이는지 확인합니다.

확인 항목

제목 길이가 달라도 높이감이 유지되는가
설명 유무에 따라 카드가 부자연스럽게 바뀌지 않는가
링크가 있는 카드와 없는 카드가 시각적으로 구분되는가

기대 결과

카드는 여러 개가 나열되어도 서로 싸우지 않고, 정보 묶음으로 읽혀야 합니다.

카테고리

Mon, 01 Jan 0001 00:00:00 +0000

타이포그래피와 언어

Mon, 01 Jan 0001 00:00:00 +0000

typography language

테스트 목적

한글 본문, 영어 약어, 숫자, 코드가 한 문단 안에 섞일 때도 읽기 리듬이 유지되는지 확인합니다.

확인 항목

제목의 줄바꿈이 과도하지 않은가
영문 약어가 본문보다 튀지 않는가
숫자와 단위가 문단 흐름을 깨지 않는가
코드와 본문이 같은 톤으로 섞이지 않는가

예시

Hugo, frontend, UI, CSS, 2026 같은 조합이 자연스럽게 읽혀야 합니다. 같은 문장에서 한글과 영문이 섞여도 줄간격과 시각적 무게가 안정적이어야 합니다.

테마 shortcode

Mon, 01 Jan 0001 00:00:00 +0000

theme shortcodes

테스트 목적

테마 shortcode는 디자인 시스템과 연결되어야 합니다. 토큰, spacing, 색상, 레이아웃 가정을 별도로 유지하지 않는지 확인합니다.

예시

다음 검증 페이지 보기

페이지네이션

Mon, 01 Jan 0001 00:00:00 +0000

pagination

테스트 목적

목록이 길어질수록 페이징의 품질이 중요해집니다. 현재 위치, 이전/다음 관계, 버튼 크기가 안정적이어야 합니다.

확인 항목

현재 페이지가 충분히 강조되는가
이전/다음 이동이 직관적인가
숫자 범위가 너무 넓거나 좁지 않은가

평면 페이지

Mon, 01 Jan 0001 00:00:00 +0000

flat pages

테스트 목적

평면 페이지는 구조가 얕아서 단순해 보이지만, 실제로는 경로와 메타데이터를 가장 깔끔하게 보여 줍니다.

확인 항목

상위 섹션 없이도 페이지가 독립적으로 보이는가
breadcrumb가 과하지 않은가
본문과 메타가 균형을 이루는가

폼

Mon, 01 Jan 0001 00:00:00 +0000

forms

테스트 목적

폼은 상태가 많은 UI입니다. 라벨, 힌트, 오류, 도움말이 한 덩어리로 읽혀야 하고, 시각적으로도 분리되어야 합니다.

raw HTML 예시

확인 항목

라벨이 입력과 제대로 연결되는가
도움말이 입력보다 앞서거나 뒤섞이지 않는가
오류 상태가 색상만으로 표현되지 않는가

표

Mon, 01 Jan 0001 00:00:00 +0000

tables

테스트 목적

표는 정보 비교에 강하지만, 화면이 좁아지면 가장 쉽게 깨집니다. 표 자체보다 가독성과 줄바꿈을 함께 확인합니다.

예시

항목	설명	확인
row 1	짧은 값	문제가 없는가
row 2	긴 설명이 들어가는 값	줄바꿈이 자연스러운가
row 3	taxonomy / navigation	폭이 과하지 않은가

확인 항목

헤더가 분명한가
셀 간 간격이 충분한가
모바일에서 가로 스크롤이 필요하면 안내가 있는가

푸터

Mon, 01 Jan 0001 00:00:00 +0000

테스트 목적

푸터는 사이트 끝이 아니라 보조 탐색의 출발점입니다. 링크가 너무 많아도 안 되고, 너무 적어도 정보가 사라집니다.

확인 항목

정책 링크와 보조 링크가 분리되는가
복잡한 정보가 한 화면에 과밀하지 않은가
언어별 푸터 문맥이 일관적인가

헤더

Mon, 01 Jan 0001 00:00:00 +0000

테스트 목적

헤더는 사이트의 첫 인상입니다. 브랜드, 주요 메뉴, 언어 전환, 검색 진입점이 서로 싸우지 않아야 합니다.

확인 항목

메뉴가 너무 많아 첫 화면을 침범하지 않는가
모바일에서 메뉴가 자연스럽게 접히는가
현재 섹션이 적절히 강조되는가

기대 결과

헤더는 존재감은 분명하되, 콘텐츠보다 앞서 나가지 않아야 합니다.

혼합 구성

Mon, 01 Jan 0001 00:00:00 +0000

mixed composition

테스트 목적

실제 글은 한 가지 마크업만 쓰지 않습니다. 문단과 표와 이미지와 shortcode가 섞여도 의미 계층이 유지되어야 합니다.

예시

먼저 개요를 읽습니다.
표로 비교합니다.
shortcode로 보조 정보를 확인합니다.
이미지로 레이아웃을 검증합니다.

" target="<nil>" rel="<nil>">

혼합 구성

여러 마크업이 섞여도 본문 흐름이 유지되어야 합니다. ">

홈

Mon, 01 Jan 0001 00:00:00 +0000

home

테스트 목적

홈은 가장 먼저 보이는 페이지이자, 가장 적게 설명해야 하는 페이지입니다. 진입점은 분명해야 하지만 첫 화면이 너무 무거우면 안 됩니다.

확인 항목

상단 네비게이션이 먼저 보이는가
핵심 섹션으로 바로 이동할 수 있는가
요약 정보가 첫 화면을 과하게 차지하지 않는가
카드 수가 많아져도 질서가 유지되는가

기대 결과

홈은 목록 페이지가 아니라 항해 지도처럼 보여야 합니다. 가장 중요한 영역을 먼저, 나머지는 자연스럽게 아래에 배치합니다.

확장 마크다운

Mon, 01 Jan 0001 00:00:00 +0000

markdown extended

테스트 목적

확장 마크다운 요소가 글의 의미를 해치지 않고 잘 붙는지 확인합니다.

확인 항목

표가 좁은 화면에서 무너지지 않는가
긴 링크와 긴 단어가 줄바꿈 정책을 깨지 않는가
강조와 취소선이 과도하지 않은가

예시

항목	설명
강조	중요한 문장에만 사용
취소선	변경 전후를 보여줄 때만 사용
긴 링크	본문 폭을 확인하는 엣지 케이스

블로그 on SITE

1

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

2

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

3

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

4

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

5

SaaS 보안 실사 체크리스트: 도입 전에 반드시 확인해야 할 10가지

CTA

cta

테스트 목적

확인 항목

예시

cta-all-empty

cta-default-only

cta-enum-commented

figure

figure2

보안 검토 예시

보안 검토 예시

figure3

보안 검토 예시

보안 검토 예시

taxonomy term

taxonomy term

테스트 목적

확인 항목

기대 결과

taxonomy 목록

taxonomy list

테스트 목적

확인 항목

기대 결과

간격과 레이아웃

spacing layout

테스트 목적

확인 항목

판정

검색

search

테스트 목적

확인 항목

기대 결과

검증 로그

verification log

목적

기록 항목

예시 메모

관련 글

related posts

테스트 목적

확인 항목

그림

figures

테스트 목적

예시

구조 다이어그램

기본 shortcode

built-in shortcodes

테스트 목적

예시

figure 예시

기본 마크다운

markdown basic

테스트 목적

확인 항목

예시

긴 글

long post

서론

배경

단일 페이지

single page

테스트 목적

확인 항목

기대 결과

디자인 토큰