이벤트 포스터, 최신 공지, 제품 하이라이트——같은 화면에 많은 정보를 담고 싶지만 지저분해 보이지 않게 하고 싶다면? 캐러셀(슬라이드쇼형 정보 게시판)이 정답입니다. 같은 공간에 여러 슬라이드를 담아 자동으로 전환하며, 공간을 절약하면서도 시선을 끌 수 있습니다. 모드 선택부터 전환 속도, 텍스트 가독성, 색상 배합까지 효과적인 정보 게시판 제작의 핵심 원칙을 알아봅니다.
1. 정보 게시판(Carousel)이란?
정보 게시판은 고정된 영역 안에서 여러 콘텐츠를 순환 표시하는 전시 컴포넌트로, 캐러셀·슬라이드쇼·Slider라고도 불립니다. 일정 시간마다(또는 사용자가 수동으로) 다음 슬라이드로 전환되어 제한된 공간에서 최대한의 정보를 전달합니다.
주요 사용 사례:
- 공지 게시판：회사 로비 TV, 학교 게시판
- 이벤트 홍보：시즌 세일, 강좌 모집, 커뮤니티 행사
- 제품 전시：쇼핑몰 메인 배너, 카탈로그 페이지
- 발표 보조：회의실 디스플레이, 전시회
- 디지털 사이니지：음식점 메뉴, 교통 정보, 대기실 안내
2. 세 가지 콘텐츠 모드, 어떻게 선택할까?
텍스트 모드
중요 공지, 이벤트 시간, 규칙 설명 등 순수 텍스트 공지에 최적입니다. 로딩이 가장 빠르고 어떤 화면 밝기에서도 가독성이 높으며, 그라데이션 배경으로 디자인 감각도 살릴 수 있습니다.
적합한 상황：회의실 공지 화면, 학교 규정 안내, 기간 한정 이벤트 정보
이미지 모드
제품 사진, 이벤트 포스터, 풍경 사진 슬라이드쇼 등 비주얼 중심 전시에 최적. 이미지가 전체 게시판을 채워 시각적 임팩트가 강합니다. 고품질 이미지가 없으면 효과가 떨어지고, 이미지가 많을 때는 텍스트보다 전환 속도를 느리게 설정해야 합니다.
적합한 상황：음식점 메뉴 사진, 사진 포트폴리오, 관광지 소개
텍스트+이미지 혼합 모드
이미지로 주목을 끌고 텍스트로 정보를 전달해야 하는 상황에 최적. 이미지를 전면에 표시하고 그 위에 텍스트를 오버레이하며, 반투명 배경으로 가독성을 확보합니다.
적합한 상황：이벤트 홍보(이미지＋날짜·장소), 제품 추천(이미지＋셀링포인트), 직원 소개(사진＋직함·이름)
| 모드 | 시각 효과 | 정보 밀도 | 적합한 상황 |
|---|---|---|---|
| 텍스트 | 심플 | 높음 | 공지, 안내, 설명 |
| 이미지 | 강렬 | 낮음 | 비주얼 전시 |
| 혼합 | 풍부 | 보통 | 이벤트 홍보, 제품 소개 |
3. 전환 속도：얼마나 빠른 게 적절할까?
| 콘텐츠 유형 | 권장 간격 | 이유 |
|---|---|---|
| 텍스트(단문) | 4〜5초 | 한 눈에 읽을 수 있음 |
| 텍스트(장문) | 8〜12초 | 충분한 읽기 시간 필요 |
| 이미지만 | 5〜7초 | 시각적 이해에 약간의 시간 필요 |
| 텍스트+이미지 혼합 | 6〜10초 | 이미지와 텍스트 동시 처리 |
| 디지털 사이니지(원거리) | 8〜15초 | 이동 중인 시청자에게 더 긴 노출 필요 |
황금 법칙：전환 전에 현재 슬라이드를 다 읽고 나서 1〜2초의 여유가 남도록 설정하세요. 너무 빠르면 불안하고, 너무 느리면 지루합니다.
4. 텍스트 가독성：글자가 잘 보이나요?
문제 1：텍스트와 배경 색상이 너무 비슷함
밝은 배경에 흰 글자, 어두운 배경에 검은 글자는 가독성의 적입니다. WCAG AA 기준은 일반 텍스트의 명암비 4.5:1 이상을 요구합니다.
문제 2：혼합 모드에서 텍스트가 이미지에 묻힘
복잡한 이미지 배경 위의 텍스트는 읽기 어렵습니다. 해결책：반투명 검은색 또는 흰색 오버레이 추가, 이미지 밝기를 조정한 후 텍스트 오버레이.
문제 3：글자가 너무 작아 원거리에서 안 보임
게시판은 보통 2〜5미터 거리에서 봅니다. 일반 웹 페이지의 14〜16px는 전혀 부족합니다. 제목은 최소 32px 이상, 본문은 최소 20px 이상을 권장합니다.
5. 색상 배합：디자인 감각 있는 게시판 만들기
- 브랜드 컬러：조직이나 이벤트의 주요 색상으로 브랜드 일관성 강화
- 상황별 색상：여름 이벤트에는 오렌지·레드 계열, 테크 주제에는 딥 블루·퍼플
- 고대비 조합：어두운 배경에 흰 텍스트, 또는 밝은 배경에 어두운 텍스트
6. 실전 시나리오별 설정 가이드
시나리오 1：회사 로비 공지
- 모드：텍스트
- 전환 간격：8〜10초
- 내용：슬라이드당 1가지 포인트만
- 비주얼：어두운 배경＋큰 폰트
시나리오 2：이벤트 홍보 전시
- 모드：텍스트+이미지 혼합
- 전환 간격：6〜8초
- 내용：고품질 비주얼＋제목과 날짜·장소만
- 비주얼：반투명 오버레이로 텍스트 명확화
시나리오 3：수업·회의 발표
- 모드：텍스트(목록 또는 요점)
- 전환 간격：수동 제어(자동 재생 끄기)
- 내용：슬라이드당 1가지 의제 또는 토론 포인트
- 비주얼：고대비＋전체화면 모드
시나리오 4：음식점·매장 디지털 메뉴
- 모드：이미지 또는 혼합
- 전환 간격：7〜10초
- 내용：음식 사진＋메뉴명＋가격
- 비주얼：따뜻한 그라데이션＋선명한 가격 텍스트
7. 제작 전 준비할 것들
- 텍스트 내용 목록：각 슬라이드의 제목(10〜20자)과 본문(30〜60자)
- 이미지 소재：가로 비율(16:9 또는 4:3), 해상도 1200px 이상 권장
- 브랜드 컬러 코드：메인·서브 컬러의 HEX 값
- 표시 환경 확인：화면 크기와 시청 거리로 폰트 크기 결정
요약
- 텍스트 모드：정보 밀도 높고 로딩 빠름, 공지·안내에 최적
- 이미지 모드：시각적 임팩트 강함, 순수 비주얼 전시에
- 혼합 모드：이미지와 설명 모두 활용, 이벤트 홍보에 최적
- 전환 속도：짧은 텍스트 4〜5초, 긴 텍스트 8〜12초
- 가독성：명암비 확보, 혼합 모드는 오버레이 추가, 원거리는 큰 폰트
- 색상：브랜드 컬러 또는 상황별 그라데이션으로 일관성 강화
좋은 정보 게시판은 얼마나 많은 내용을 담느냐가 아니라, 각 슬라이드가 시청자에게 하나의 메시지를 명확하게 전달하느냐에 달려 있습니다. 적은 것이 더 많다——슬라이드 하나에 메시지 하나, 명확하고 힘있게.