👥 스크롤을 아무리 내려도, 내가 원하는 부분은 고정할 수 있다고?
모든 홈페이지 방문자에게 보여주고 싶은 내용이 있으신가요? 그럴 땐 아임웹 디자인모드에서 섹션 사이드 고정 기능을 이용해 보세요! 아임웹 디자인모드에서는 섹션을 나누어 사이드 영역을 만들 수 있는데요. 나눠진 사이드 섹션을 고정하면? 사이트 방문자가 페이지를 아무리 스크롤 해도 내가 원하는 콘텐츠를 고정적으로 보여줄 수 있죠.
이번 아임웹 디자인 레시피에서는 기후정의를 실현하는 시민운동 플랫폼 <서울환경연합> 홈페이지 디자인 사례를 통해 섹션 사이드 고정법을 알아보고자 합니다. 서울환경연합은 페이지 왼쪽에 자신들이 전하고자 하는 메시지를 고정적으로 표시해, 비전을 강조하고 있는데요.
페이퍼룰러의 레시피, 지금 알아볼까요?👩🍳
📌 이런 분이라면 특히 주목해 주세요!
- 홈페이지 레이아웃을 독특하게 만들고 싶은 분
- 모든 방문자에게 알리고 싶은 이벤트/프로모션, 콘텐츠 등이 있으신 분
- 방문자가 홈페이지를 더욱 편리하게 구경할 수 있게 페이지 구성을 하고 싶으신 분
STEP 1
디자인 모드에 접속 후, 위젯이 없는 빈 공간에서 마우스 오른쪽을 클릭해 [빈 섹션 추가]로 들어가 주세요.
STEP 2
추가한 섹션에서 마우스 오른쪽을 클릭해 [섹션 설정]으로 이동해 주세요.
STEP 3
[사이드] 항목에서 원하는 디자인과 규격을 설정한 뒤, ‘섹션 사이드 고정’ 기능을 체크해 주세요.
STEP 4
분할된 섹션 안의 영역을 클릭해서, 원하는 디자인 요소를 추가해 주면 끝이에요!
TIP💡
웹사이트 좌측 메뉴와 함께 상단 메뉴도 고정하고 싶다면, 상단 메뉴 오른쪽 클릭 > [상단 설정] 메뉴 > 오른쪽 토글 버튼을 활성화해 주세요.
다른 브랜드들은 이 기능을 어떻게 활용했을까요?
🔎 CHILLYCHERRY 칠리체리
상품 카테고리를 왼쪽 섹션에 고정하여, 방문자가 제품을 쉽고 빠르게 찾을 수 있도록 했어요.
🔎 아임웹 (🔗2022 잘.자.란 연말결산)
페이지 타이틀을 좌/우 번갈아 고정 배치해 보여주어, 방문자에게 구경하는 재미를 선사했어요.
✅ 섹션 사이드 고정, 이렇게도 활용할 수 있어요!
- 페이지별 타이틀을 보여주기 (ex. 페이지 제목 및 설명 1-2줄)
- 방문자의 관심도를 높이는 정보를 보여주기 (ex. 할인 혜택, 행사/이벤트 안내, 광고 배너 등)
- 제품/서비스 문의를 위한 정보 보여주기 (ex. 이메일, 인스타그램 등의 연락처)
아임웹 디자인모드 내 기능들을 잘 활용하면, 독특한 홈페이지 디자인으로 방문자의 마음을 사로잡을 수 있답니다! 오늘 소개해 드린 기능을 통해 하이라이트 하고 싶은 콘텐츠를 색다르게 표현해보는 건 어떨까요?🎇
※ 레시피 사례로 소개한 서울환경연합을 비롯해, 칠리체리는 아임웹과 함께 성장하는 브랜드입니다.
💌 평소 궁금했던 디자인 설정법이 있다면 알려주세요!
아임웹을 사용하거나, 고객사례를 보며 궁금했던 디자인 설정법이 있으셨다면 👉 여기에 남겨주세요. 보내주신 의견을 참고하여, 더욱 유익한 디자인 레시피를 들고 찾아올게요!
📖 오늘 내용과 연관된 아임웹 가이드
🔖 다른 레시피 보러가기
by 마케팅 소영
