사진 한 장이 문단 셋을
대신할 때, 아닐 때

결론부터 말씀드리면 — 첫 화면의 사진은 분위기를 만드는 자리가 아닙니다. 방문자가 하려던 확인 하나를, 문장보다 먼저 끝내는 자리입니다. 무엇을 확인시킬지 정하지 않고 고른 사진은 아무리 잘 찍혔어도 배경이 됩니다. 그리고 배경은 화면에서 가장 큰 자리를 차지한 채 아무 말도 하지 않습니다.

잘 찍힌 사진과 맞는 사진

사진을 고르는 순서는 대체로 이렇습니다. 시안에 이미지가 들어갈 자리가 생기고, 후보를 늘어놓고, 그중 제일 나아 보이는 것을 고릅니다. 마땅한 실물이 없으면 무료 이미지에서 비슷한 결을 찾습니다. 이 순서 어디에도 "이 사진이 무엇을 대신 말해 주는가"라는 질문이 없습니다. 그래서 잘 찍힌 사진은 자주 고르는데, 맞는 사진은 잘 안 걸립니다.

사진이 글보다 빠른 건 사실입니다. 다만 빠른 것은 인상이지 내용이 아닙니다. 방문자가 첫 화면 사진에서 즉시 읽어 가는 건 두 가지 정도입니다 — 여기가 무엇을 다루는 곳인가, 그리고 이 사람들이 내놓는 결과물이 어느 정도인가. 그 밖의 것, 이를테면 가치관이나 열정 같은 것은 사진으로 전달되지 않습니다. 전달된다고 믿고 고른 사진이 대개 배경이 됩니다.

신규 브랜드에서 이 문제가 특히 커집니다. 보여줄 실물이 아직 적고, 촬영할 공간도 사람도 없는 경우가 많습니다. 그래서 빈자리를 분위기 사진으로 메우게 되는데, 분위기 사진은 어느 브랜드에 갖다 놓아도 말이 됩니다. 방문자에게 남는 구별 정보가 없다는 뜻입니다. 출처가 섞인 이미지가 화면의 급을 어떻게 떨어뜨리는지는 돈은 들였는데 싸 보이는 사이트에서 다뤘습니다.

값이 큰 일을 파는 곳일수록 손실이 큽니다. 시공·컨설팅·교육·의료·B2B처럼 결정 전에 비교가 일어나는 분야에서 방문자는 사진을 감상하지 않고 증거로 씁니다. 후기와 실적이 아직 없는 브랜드라면 더 그렇습니다. 근거로 쓸 수 없는 사진은, 그 자리에서 아무 일도 하지 않습니다.

첫 화면 사진이 할 일은 분위기를 만드는 게 아닙니다.
방문자의 확인 하나를 문장보다 먼저 끝내는 것입니다.

사진을 고르는 네 가지 기준

고르는 일을 감으로 하면 후보 사이에서 계속 맴돕니다. 네 가지를 순서대로 대 보시면 대부분 두세 장으로 줄어듭니다.

  1. 그 사진이 답하는 질문을 한 문장으로 적습니다. "이 사진은 방문자의 어떤 질문에 답하는가." 적히지 않으면 그 사진은 배경입니다. 질문은 대개 넷 중 하나입니다 — 여기가 무엇을 하는 곳인가, 결과물이 어느 정도인가, 누가 하는가, 어떻게 진행되는가. 첫 화면에는 그중 하나만 놓습니다. 넷을 다 보여주려 하면 넷 다 안 보입니다. 어느 질문이 1순위인지는 상대할 방문자가 정해져 있어야 답이 나오고, 그 순서는 브랜드 런칭, 디자인보다 먼저 정해야 하는 것에 적어 두었습니다.
  2. 우리만 찍을 수 있는 사진인지 봅니다. 누구나 똑같이 내려받을 수 있는 이미지는 구별 정보가 없습니다. 우리만 가진 것은 대개 이런 것들입니다 — 실제 결과물, 작업 중인 화면이나 도구, 실제로 쓰는 공간, 일하는 사람, 우리가 직접 만든 자료나 도식. 스톡을 쓰지 말라는 이야기가 아니라 스톡을 증거 자리에 놓지 말라는 이야기입니다. 배경이나 질감으로는 무해합니다. 증거 자리에 놓을 것이 없다면 그 자리는 비워 두는 편이 낫습니다.
  3. 사진이 문장의 주장을 배반하지 않는지 봅니다. 문장은 정밀하다고 하는데 사진 속 현장이 어수선하면, 방문자는 사진 쪽을 믿습니다. 문장은 고쳐 쓸 수 있는 것으로, 사진은 찍힌 것으로 여겨지기 때문입니다. 급·규모·정돈 상태가 문장과 어긋날 때 이기는 쪽은 늘 사진입니다. 그래서 어긋나면 둘 중 하나를 해야 합니다 — 사진을 다시 마련하거나, 문장을 사진이 감당하는 높이로 낮추거나. 어느 쪽도 안 하고 두면 방문자는 낮은 쪽으로 판단합니다.
  4. 잘리는 것을 전제로 고릅니다. 첫 화면 사진은 가로 화면과 세로 화면에서 아예 다른 그림이 됩니다. 넓은 화면에서 가운데 있던 피사체가 휴대폰에서는 가장자리로 밀리거나 잘려 나갑니다. 중요한 것이 한쪽 끝에 있는 사진, 여백이 없는 사진, 사진 안에 글자가 들어간 사진은 첫 화면에 놓기 어렵습니다. 고를 때 휴대폰 비율로 한 번 잘라 보고 무엇이 남는지 확인하십시오. 제목과 버튼이 얹히는 자리가 조용한 면인지도 같이 봅니다. 복잡한 면 위에 흰 글씨를 얹고 어둡게 덮는 처리로 버티는 화면은, 사진도 글자도 손해를 봅니다.

네 가지를 다 통과하는 사진이 없으면 어떻게 하느냐 — 비워 둡니다. 사진 없는 첫 화면은 결함이 아닙니다. 문장과 여백과 서체만으로 된 첫 화면은 흔하고, 애매한 사진이 놓인 첫 화면보다 대체로 낫습니다. 대신 언제 무엇을 찍어 채울지를 정해 두십시오. 재료를 제작이 끝난 뒤에 구하기 시작하면 임시로 넣어 둔 것이 그대로 굳습니다. 그 이야기는 새로 만들었는데, 또 같은 자리라면에서 다뤘습니다.

한 가지 구분을 덧붙이겠습니다. 사진의 색감이나 온도, 결은 대표님 취향으로 정하셔도 되는 영역입니다. 하지만 무엇을 보여줄지는 취향 밖입니다. 그건 방문자가 무엇을 확인하려고 왔는지에 달린 문제라서, 확인 가능한 기준으로 정해야 합니다. 그 경계는 취향으로 정해도 되는 것, 정하면 안 되는 것에 정리해 두었습니다.

지금 바로 확인해 보세요

지금 쓰고 계신 첫 화면을 열어 놓고 다섯 줄을 짚어 보세요. 휴대폰으로도 한 번 여시면 됩니다.

  • 이 사진이 어떤 질문에 답하는지 한 문장으로 적을 수 있는가?
  • 같은 사진을 비슷한 업종의 다른 사이트에 옮겨 놓아도 말이 되는가 — 된다면 구별 정보가 없는 사진이다.
  • 사진이 보여주는 수준이 문장이 주장하는 수준보다 낮아 보이지 않는가?
  • 휴대폰에서 사진의 중요한 부분이 잘려 나가거나, 제목이 사진의 복잡한 면 위에 얹혀 있지 않은가?
  • 사진을 빼 봤을 때, 방문자가 여기가 무엇을 하는 곳인지 못 알아보는가?

마지막 줄에서 "빼도 알아본다"가 나왔다고 해서 곧장 지우라는 뜻은 아닙니다. 다만 그 사진은 지금 증거가 아니라 장식이라는 뜻이고, 첫 화면은 사이트에서 가장 비싼 자리입니다. 장식으로 쓰기에는 비쌉니다. 반대로 두 번째 줄에서 "다른 사이트에 옮겨도 말이 된다"가 나왔다면, 더 나은 스톡을 찾는 쪽으로 가지 마시고 우리만 찍을 수 있는 것이 무엇인지부터 목록으로 적어 보시는 편이 빠릅니다.

자주 묻는 질문

실물 사진이 없는데 스톡을 쓰면 안 되나요?+
자리를 가려서 쓰면 됩니다. 배경·질감처럼 근거로 보지 않는 자리에서는 무해합니다.
문제는 결과물·과정·사람처럼 방문자가 판단 근거로 보는 자리입니다.
그 자리의 스톡은 아무것도 증명하지 못하면서 보여줄 게 없다는 신호만 남깁니다.
놓을 사진이 없다면 사진 없이 문장과 여백으로 만드는 편이 낫습니다.
촬영을 따로 맡겨야 하나요? 휴대폰은 안 되나요?+
장비보다 먼저 정할 것은 무엇을 찍을지입니다.
공간·시공·제품처럼 실물이 곧 상품이면 촬영은 가장 오래 쓰이는 재료가 됩니다.
컨설팅·교육·B2B처럼 실물이 없으면 인물·사무실 사진보다
실제로 쓰는 자료·도식·작업 화면이 판단에 더 쓰이고, 이건 휴대폰으로도 됩니다.
첫 화면에 사진 대신 영상을 넣으면 어떤가요?+
기준은 같습니다 — 어떤 확인을 끝내 주는지 한 문장으로 적히면 쓰고, 안 적히면 배경입니다.
다만 영상은 무겁고 첫 화면은 가장 먼저 로딩되는 자리라 배경으로 쓸 때 손해가 큽니다.
넣는다면 소리는 꺼 두고, 영상이 도착하기 전에도
문장과 버튼이 제자리에 보이는지 확인하십시오.

밑그림은 첫 화면에 사진을 놓기 전에, 그 사진이 어떤 확인을 대신할지부터 정합니다.
지금 첫 화면이 방문자의 확인을 끝내 주고 있는지 궁금하다면 아래 셀프 체크리스트로 짚어 보세요 — 3분이면 나옵니다.

홈페이지 셀프 진단 체크리스트 ↗  ·  다른 칼럼 보기