18. 소개글·이미지·링크의 구성
소개글은 필요한 사실부터
소개글은 멋진 수식어를 많이 붙이는 글이 아닙니다. 누가 어떤 관심사를 가진 사람인지 방문자가 짧게 이해할 수 있으면 됩니다. “책을 통해 세상과 소통하는 열정적인 사람”보다 “한 달에 한 권을 읽고, 기억에 남는 문장을 기록합니다”가 무엇을 하는 사람인지 더 구체적으로 보여 줍니다.
AI에게 다듬기를 맡겨도 사실은 내가 확인합니다. 하지 않은 활동이나 없는 경력이 추가되면 빼야 합니다. 처음에는 두 문장으로 시작하고, 더 필요한 설명이 생기면 아래에 덧붙이면 됩니다. 짧게 쓰는 것은 정보를 숨기는 것이 아니라 먼저 알아야 할 것을 고르는 일입니다.
이미지는 목적이 있을 때 넣습니다
사진은 사람과 분위기를 빠르게 보여 줄 수 있지만 반드시 필요한 것은 아닙니다. 준비된 사진이 없다면 글과 색만으로도 소개 페이지를 만들 수 있습니다. 사진을 고를 때는 소개 내용과 어울리는지, 작은 화면에서 무엇인지 알아볼 수 있는지, 공개할 권한이 있는지를 봅니다.
이미지가 열리지 않거나 화면을 읽어 주는 도구로 볼 때를 위해 내용을 설명하는 짧은 글을 붙일 수 있습니다. 이를 대체 텍스트라고 합니다. ‘이미지’라고만 적기보다 ‘책상 위에 펼쳐 놓은 독서 노트’처럼 무엇을 보여 주는지 설명합니다. 의미 없이 꾸미는 그림은 정보를 설명하는 사진과 다르게 다룰 수 있습니다.
링크는 도착지를 알려 줍니다
링크는 누르면 다른 주소나 같은 페이지의 특정 위치로 이동하는 요소입니다. 글자가 ‘여기’라고만 적혀 있으면 목적을 알기 어렵습니다. ‘독서 모임 안내 보기’처럼 목적지를 설명하면 읽는 사람도 누르기 전에 무엇이 열릴지 예상할 수 있습니다.
주소가 맞는지와 링크 문구가 맞는지는 별도로 확인합니다. 문구는 모임 안내인데 다른 사이트가 열리면 혼란을 줍니다. AI가 그럴듯한 주소를 만들어 넣지 않도록 실제로 사용할 주소를 제공하거나, 주소가 없는 부분은 아직 연결하지 않도록 합니다.
반복되는 정보는 일정하게
관심사 세 가지를 보여 준다면 이름과 짧은 설명의 순서를 맞춥니다. 하나는 긴 문장, 하나는 단어, 다른 하나는 버튼만 있으면 서로 어떤 관계인지 알아보기 어려울 수 있습니다. 항목들의 표현 형식을 맞추면 내용이 달라도 같은 종류의 정보라는 것을 알기 쉽습니다.
한 페이지에서는 사실을 읽는 데 필요한 정도로만 내용을 넣습니다. 많은 자료는 링크로 연결할 수 있습니다. 소개 페이지가 모든 자료를 담는 창고가 되면 첫 방문자가 핵심을 찾기 어렵습니다. 다음 장에서는 이런 내용이 눈에 어떻게 들어오는지 살펴봅니다.
대체 텍스트를 쓰는 사례
산책 사진이 취미를 설명하는 자료라면 ‘강변 산책로에서 찍은 나무와 벤치’처럼 의미를 짧게 설명할 수 있습니다. 파일 이름이 photo123.jpg라고 적혀 있는 것은 내용을 설명하지 못합니다. 사진을 보지 못하는 사람이 페이지의 맥락을 이해할 수 있는지가 기준입니다.
장식용 무늬처럼 내용 이해에 필요 없는 그림은 정보를 전달하는 사진과 다르게 다룹니다. 모든 그림을 길게 설명하면 오히려 읽는 흐름이 복잡해질 수 있습니다. AI에게 어떤 그림이 정보이고 어떤 것이 장식인지 알려 주면 관련 처리를 요청할 수 있습니다. 여기서는 접근성의 모든 규칙보다 그림의 의미를 구분하는 데 집중합니다.
사진과 링크를 더할 때
소개 문장을 다듬는 전후 사례
‘저는 다양한 활동을 통해 끊임없이 성장하며 새로운 경험을 추구하는 사람입니다’라는 문장은 긍정적이지만 무엇을 하는지 구체적으로 보여 주지는 않습니다. ‘주말에는 동네를 산책하고, 마음에 드는 책방을 기록합니다’라고 바꾸면 방문자는 관심사를 더 쉽게 떠올릴 수 있습니다. 실제로 하는 행동을 쓰는 것이 소개의 재료가 됩니다.
AI에게 짧게 다듬어 달라고 할 때는 유지할 사실을 알려 줍니다. 읽은 책 수나 경력처럼 숫자가 있는 정보는 임의로 늘리지 않게 합니다. 말투를 바꾸는 일과 사실을 바꾸는 일을 구분해야 합니다. 표현이 자연스럽게 바뀌었더라도 내 경험과 같은지 다시 읽습니다.
이미지 한 장에 여러 역할을 맡기지 않기
프로필 사진은 사람을 알아보게 할 수 있고, 취미 사진은 분위기를 전달할 수 있으며, 안내 지도는 위치를 보여 줄 수 있습니다. 모두 이미지지만 목적이 다릅니다. 설명해야 할 정보가 그림 안에만 있으면 그림을 보지 못하는 상황에서 내용을 놓칠 수 있습니다. 날짜나 장소처럼 중요한 정보는 글로도 제공할 수 있습니다.
사진이 너무 크면 소개글과 링크가 첫 화면에서 보이지 않을 수 있습니다. 반대로 너무 작으면 무엇을 보여 주는지 알아보기 어렵습니다. AI에게 사진의 역할을 말하고 그 목적에 맞는 크기와 배치를 제안받을 수 있습니다. ‘사진을 크게’라는 말만으로는 어떤 정보를 우선할지 전달되지 않습니다.
항목이 늘어날 때의 표현
좋아하는 책 세 권을 보여 줄 때 각 항목에 제목과 한 줄 감상을 넣는다면 같은 순서와 길이로 맞추면 읽기 쉽습니다. 한 항목에만 아주 긴 소개와 여러 링크가 들어가면 다른 항목과의 관계가 흐려질 수 있습니다. 필요한 자세한 내용은 별도 링크로 연결할 수 있습니다.
자료를 모두 넣은 뒤에는 처음 보는 사람처럼 위에서 아래로 읽습니다. 문장이 중복되는지, 빠진 정보가 있는지, 링크 문구와 실제 주소가 맞는지 살핍니다. 마지막에 글의 구성부터 확인하면 색이나 간격을 고칠 때도 무엇을 유지해야 할지 알 수 있습니다.
“사진이 없으면 페이지가 너무 허전하지 않을까요?”
사진이 없어도 제목과 소개글, 관심사와 링크의 관계가 분명하면 목적을 이룰 수 있습니다. 첫 페이지에서 반드시 필요한 것은 방문자가 누구의 어떤 페이지인지 이해하는 것입니다. 비어 보인다는 이유로 출처가 불분명한 사진을 가져오거나 의미 없는 장식을 많이 넣을 필요는 없습니다.
글의 크기와 간격, 배경과 강조색을 정리하면 텍스트 중심으로도 읽기 편한 화면을 만들 수 있습니다. 사진을 나중에 추가하고 싶다면 어떤 정보를 더 전달하려는지 먼저 정합니다. 사람의 모습인지, 취미의 분위기인지, 장소 안내인지에 따라 적절한 자료가 달라집니다.
처음에는 사진 없이 완성한 뒤 사진을 넣었을 때와 비교해 볼 수 있습니다. 사진 때문에 중요한 링크가 밀리거나 파일 보관이 복잡해지는 점도 함께 봅니다. 선택 기능을 넣는 판단에는 얻는 정보와 추가되는 확인이 모두 포함됩니다.
꼭 기억하세요
글은 사실을 구체적으로, 이미지는 필요한 의미를, 링크는 도착할 곳을 알려 줍니다.