이미지는 예쁜 사진 고르기만이 아닙니다. 첫 화면 대표 이미지인지, 카드 썸네일인지, 어떤 비율인지, 얼굴이나 제품이나 글자가 잘리면 안 되는지까지 함께 정해야 웹에서 덜 망가집니다.
큰 첫 화면 이미지일수록 무엇이 화면 중심에 남아야 하는지 중요합니다. Apple처럼 제품 자체가 크게 보이고 불필요한 배경이 적으면, 첫 화면이 훨씬 강하게 읽힙니다.
카드가 여러 장일 때는 카드 이미지 비율을 통일하는 것이 중요합니다. Behance처럼 썸네일이 같은 틀 안에서 반복되면 카드 제목과 메타 정보도 함께 읽기 쉬워집니다.
대표 이미지는 혼자만 예쁘면 되는 것이 아니라, 옆의 큰 문장과 버튼과 함께 균형을 만들어야 합니다. Trello처럼 글과 이미지가 서로 자리를 나누면 첫 화면이 훨씬 읽기 쉬워집니다.
좋은 사진을 고르는 것만큼 중요한 것이 자르기입니다. 인물 얼굴, 제품 중심, 큰 글자처럼 꼭 보여야 하는 부분이 잘리지 않게 안전 구역을 생각해야 합니다.
첫 화면 대표 이미지는 가장 강하게 보이고, 카드 썸네일은 비교가 쉬워야 하며, 상세 이미지는 설명을 도와야 합니다. 위치에 따라 이미지가 하는 일을 먼저 정하면 훨씬 정확해집니다.
큰 첫 화면은 넓은 비율이 어울리고, 카드 썸네일은 정사각형이나 4:3이 안정적일 때가 많습니다. 자리마다 같은 비율을 유지해야 목록도 훨씬 정돈되어 보입니다.
웹은 화면이 줄어들고 비율이 바뀌기 때문에 가장자리 정보가 잘리기 쉽습니다. 중요한 물체와 텍스트는 가운데 근처에 두고, 테두리는 잘려도 괜찮은 배경으로 남기는 편이 안전합니다.
이미지 파일을 따로 찾기 전에, 어디에 어떤 비율로 들어가며 무엇이 꼭 보여야 하는지 표로 적어 두면 훨씬 덜 헤맵니다. 특히 여러 카드가 있을수록 이 표가 큰 도움이 됩니다.
“좋은 이미지 넣어줘”라고 하면 AI는 막연하게 고르기 쉽습니다. 어디에 들어가는 이미지인지, 어떤 비율인지, 무엇이 꼭 보여야 하는지까지 말해 주면 결과가 훨씬 또렷해집니다.
이미지가 예쁘기만 하고 잘리면 페이지 품질이 크게 떨어집니다. 위치와 비율과 잘리면 안 되는 부분까지 말해 주면 AI 결과가 훨씬 더 쓸모 있는 화면이 됩니다.
오늘은 사진을 직접 고르기보다, 어디에 어떤 비율의 이미지가 들어가야 하는지와 무엇이 잘리면 안 되는지 적을 수 있으면 충분합니다.
이미지 계획은 페이지에 어디에 어떤 비율의 이미지를 두고, 무엇이 잘리면 안 되는지 미리 정하는 일입니다. 위치, 비율, 안전 구역, 캡션을 먼저 정해 두면 AI에게도 훨씬 정확하게 요청할 수 있습니다.
첫 화면 이미지는 16:9 비율, 카드 썸네일은 4:3 비율로 맞춰줘. 얼굴과 작품은 잘리지 않게 중앙에 두고, 모든 카드 이미지는 같은 비율로 보여줘.
첫 화면 이미지 역할: ____________________________
첫 화면 이미지 비율: ____________________________
카드 이미지 역할: ______________________________
카드 이미지 비율: ______________________________
잘리면 안 되는 요소: ___________________________
짧은 캡션 메모: ________________________________
비율: 이미지 가로세로 모양입니다. 예: 16:9, 4:3
안전 구역: 잘리면 안 되는 핵심 요소가 놓이는 영역입니다.
Hero 이미지: 첫 화면에서 가장 크게 보이는 대표 이미지입니다.
썸네일: 카드나 목록 안에서 반복되는 작은 대표 이미지입니다.