눈길을 끄는 배너 만드는 방법

얼마 전 블로그 첫 화면을 바꾸면서 배너를 새로 만들었는데, 사진보다 문구를 고르는 데 시간이 더 걸렸다. 예쁘게 꾸미는 것만 생각했을 때는 화면이 복잡했지만, 방문자가 무엇을 보고 어디를 눌러야 할지 먼저 생각하니 훨씬 수월해졌다. 배너는 작은 공간에 여러 말을 담는 광고판보다, 필요한 정보를 빠르게 알려주는 표지판에 가깝다.
배너를 보는 사람의 다음 행동부터 정하기
디자인 프로그램을 열기 전에 배너의 역할을 한 문장으로 적어두면 좋다. 새 글을 읽게 할지, 행사 내용을 확인하게 할지, 상품을 보러 가게 할지에 따라 필요한 문구가 달라진다. 한 배너에서 세 가지를 모두 부탁하면 방문자는 어느 쪽을 선택해야 할지 망설이기 쉽다.
예를 들어 블로그의 무료 자료를 알린다면 제목은 ‘가계부 양식 무료로 받기’, 버튼은 ‘양식 보기’처럼 쓸 수 있다. ‘당신의 생활을 바꾸는 특별한 기회’라는 말보다 무엇을 얻는지 바로 보인다. 버튼을 누른 뒤 실제로 양식을 볼 수 있는지도 중요하다. 배너가 약속한 내용과 연결된 화면이 다르면 클릭을 받아도 금세 돌아가게 된다.
문구를 고를 때는 배너를 처음 보는 사람에게 3초만 보여준다고 생각해보자. 무엇을 주는지, 누구에게 필요한지, 누르면 무엇이 나오는지 중 적어도 앞의 두 가지는 짐작할 수 있어야 한다. 설명이 길어지면 본문이나 연결 화면으로 옮기고, 배너에는 가장 필요한 말만 남기는 편이 읽기 쉽다.
문구는 짧게, 중요한 순서대로 배치하기
배너 안의 글은 제목 한 줄, 보조 설명 한 줄, 행동을 알려주는 버튼 정도면 출발하기 좋다. 모든 내용을 같은 크기와 굵기로 넣으면 시선이 머물 곳이 없다. 가장 중요한 제목을 크게 놓고, 조건이나 기간은 그다음 크기로, 부가 설명은 더 작게 배치하면 자연스럽게 읽힌다.
할인 배너라면 ‘최대 50%’만 크게 쓰기보다 무엇이 할인되는지 함께 보여줘야 한다. ‘수납용품 최대 50% 할인’처럼 쓰고, 기간이 있다면 가까운 곳에 표시하는 식이다. 다만 모든 상품이 50% 할인되는 게 아니라면 ‘최대’라는 단어가 눈에 띄어야 오해를 줄일 수 있다. 숫자가 주목을 끌더라도 정확한 안내가 먼저다.
버튼 문구도 ‘자세히 보기’ 하나로 끝내기보다 ‘행사 상품 보기’, ‘신청 방법 보기’처럼 누른 뒤의 내용을 알려주면 좋다. 같은 페이지에 배너가 여럿 있을 때는 이런 차이가 더 크게 느껴진다. 방문자가 버튼마다 무엇이 다른지 바로 알 수 있기 때문이다.
사진과 색은 글을 읽기 쉽게 고르기
마음에 드는 사진을 먼저 골랐다가 글자를 올릴 자리가 없어서 고생할 때가 있다. 배경 사진을 쓴다면 인물의 얼굴이나 제품을 가리지 않는 빈 공간이 있는지 살펴보자. 사진 전체가 복잡하다면 글자 뒤에 단색 영역을 깔거나, 사진을 한쪽에 두고 글은 반대쪽에 놓는 방법이 있다.
색은 브랜드에 쓰는 색을 중심으로 두세 가지 정도부터 맞춰보면 편하다. 배경과 글자 색이 비슷하면 화면에서는 예뻐 보여도 휴대전화에서는 읽기 어렵다. 특히 작은 회색 글자를 사진 위에 올리면 밝은 부분에서 사라질 수 있다. 완성한 뒤 화면 밝기를 조금 낮춰서도 제목과 버튼이 보이는지 확인하면 이런 문제를 찾기 쉽다.
버튼은 배경과 구분되게 만들되, 페이지의 모든 색을 버튼처럼 강조할 필요는 없다. 제목도 진하고 가격도 진하고 버튼도 진하면 어디가 중요한지 다시 헷갈린다. 시선이 제목에서 혜택이나 설명으로, 마지막에 버튼으로 움직이는 흐름을 떠올리면 색을 덜 쓰고도 선명한 배너를 만들 수 있다.
휴대전화 화면에서 한 번 더 확인하기
컴퓨터에서 넓게 보이는 배너가 휴대전화에서는 옆이 잘리거나 글씨가 작아질 수 있다. 그래서 제작을 마친 뒤에는 실제 게시될 자리에서 확인하는 게 좋다. 제목이 두 줄로 바뀌어도 뜻이 자연스러운지, 버튼을 손가락으로 누르기 편한지, 중요한 사진이나 숫자가 잘리지 않는지를 본다.
수정할 때는 한꺼번에 여러 요소를 바꾸기보다 가장 거슬리는 것부터 고치면 판단하기 쉽다. 제목이 안 읽히면 배경을 단순하게 만들고, 버튼이 안 보이면 주변 색과 간격을 조절하는 식이다. 배너 두 가지를 비교한다면 사진만 바꾸거나 문구만 바꿔야 어느 차이가 반응에 영향을 줬는지 짐작할 수 있다.
제가 배너를 만들 때 보는 건 ‘예쁜가’보다 ‘처음 보는 사람도 이해할까’다. 필요한 말을 쉽게 읽고, 눌렀을 때 기대한 화면으로 이어진다면 장식이 많지 않아도 충분히 좋은 배너라고 생각한다.
