이미지에 건 링크가 검색에 읽히는 방식

이미지 링크의 주소와 앵커 텍스트

배너 안에 글자가 보인다고 그 글자가 alt에도 들어 있다는 뜻은 아닙니다. 화면에 표시되는 이미지와 HTML 속성은 별개의 자료입니다. 이미지 파일에 ‘진료 안내’가 그려져 있어도 alt가 비어 있거나 다른 설명을 담을 수 있습니다. 따라서 시각 문구를 읽은 뒤 해당 이미지의 alt 값을 따로 읽는 절차가 필요합니다.

href와 alt는 서로의 역할을 대신하지 않습니다. 목적지를 설명하는 alt가 있어도 요청 가능한 주소가 없으면 Google의 일반적인 링크 크롤링 조건을 충족했다고 판단할 수 없습니다. 반대로 주소가 올바르더라도 alt가 목적지와 무관하면 연결 설명이 어긋납니다. 주소 수정과 문구 수정 중 무엇이 필요한지 이 차이로 구별합니다.

Google의 설명은 이미지 링크에서 alt를 앵커로 사용하는 방식에 관한 것입니다. 이를 모든 검색 서비스가 같은 방식으로 처리한다는 주장으로 확대하지 않습니다. 링크를 읽을 수 있는 조건과 검색 순위·인용 여부도 구별해야 합니다. 주소와 설명을 정리하는 작업은 연결의 의미를 분명히 하는 절차이며 노출 결과를 보장하지 않습니다.

배너 문구와 도착 내용의 대응

병원 홈페이지의 배너에 적용할 때는 화면 문구, href, alt, 도착 페이지의 내용을 한 묶음으로 비교할 수 있습니다. 아래 항목은 실제 병원의 운영 사례가 아니라 연결 관계를 판단하는 기준입니다. 배너 이름만으로 예약 기능이나 진료 제공 여부를 추정하지 않고 도착 페이지가 실제로 제공하는 범위를 기준으로 삼습니다.

이 표에서 판단할 대상은 표현의 일치만이 아닙니다. ‘예약 안내’와 ‘예약 신청’은 독자가 기대하는 행동이 다릅니다. 도착 페이지가 절차를 설명하는 문서라면 즉시 신청이 시작되는 것처럼 이름을 붙이지 않아야 합니다. 배너와 alt가 같은 말을 반복해도 실제 기능과 다르면 연결 설명을 수정할 필요가 있습니다.

그림 설명과 이동 목적의 구별

W3C의 Functional Images는 링크나 버튼에서 행동을 시작하는 이미지의 대체 텍스트가 그림의 외형보다 실행할 행동이나 목적을 전달해야 한다고 설명합니다. 이미지 링크에서는 도착 대상을 이해할 수 있는 이름이 필요합니다.

홈으로 연결되는 로고를 ‘로고 이미지’라고만 설명하면 이동 목적이 빠집니다. W3C의 단독 로고 링크 예시는 사이트 이름에 홈이라는 목적을 더합니다. 같은 방식으로 배너 사진의 피사체만 설명하는 alt보다 그 배너를 선택했을 때 열리는 안내의 이름이 연결 기능을 더 분명히 전달할 수 있습니다.

이 원칙은 기능을 가진 이미지에 적용됩니다. 같은 파일이라도 본문 정보를 설명하는 사진과 이동을 맡는 배너의 역할은 다를 수 있으므로, 이미지의 역할에 맞춰 대체 텍스트를 작성합니다.

Google은 앵커 텍스트가 구체적이고 간결하며 현재 페이지와 연결되는 페이지에 관련돼야 한다고 안내합니다. 이를 이미지 링크에 적용하면 배너의 alt에도 목적지 이해에 필요한 말을 자연스럽게 담을 수 있습니다. 검색어를 많이 넣기 위한 문장보다 어떤 안내로 이동하는지 구별할 수 있는 표현이 이 판단에 맞습니다.

빈 alt의 문제와 허용 조건

이미지만 있는 링크에서 alt까지 비어 있으면 연결을 설명할 텍스트가 빠집니다. Google은 빈 대체 텍스트와 빈 링크 텍스트를 좋지 않은 예로 제시합니다. W3C도 기능 이미지의 alt 누락이나 빈 값이 화면낭독기 사용자에게 큰 문제를 만든다고 설명합니다. 파일명이나 주소가 읽히더라도 그것이 행동을 이해하는 데 도움이 된다고 기대하기 어렵습니다.

다만 빈 alt를 모든 이미지 링크의 오류로 판정하면 W3C의 예외를 놓칩니다. 같은 링크 안에 목적지를 설명하는 텍스트가 있고 이미지가 다른 기능이나 추가 정보를 전달하지 않는 경우, 중복 낭독을 피하려고 이미지의 alt를 비울 수 있습니다. 이 조건에는 ‘같은 링크 안의 텍스트’와 ‘추가 의미가 없는 이미지’가 함께 필요합니다.

W3C는 링크 텍스트 뒤의 아이콘이 새 창 열림을 알리는 예시에서는 그 의미를 대체 텍스트로 전달합니다. 옆에 텍스트가 있다는 이유만으로 아이콘의 정보를 없애지 않는 경우입니다. 빈 alt의 허용 여부는 이미지가 장식처럼 보이는지보다 같은 링크의 텍스트에 없는 의미를 전달하는지에 따라 판단해야 합니다.

시각 안내와 실제 이동의 불일치

배너의 시각 문구와 alt가 다르면 두 설명 중 어느 쪽이 실제 목적지를 나타내는지 먼저 구별합니다. alt만 화면 문구에 맞춰 복사하는 방식으로는 도착 내용의 오류가 해결되지 않습니다. 연결된 페이지를 열어 그 문서의 제목과 제공 내용을 읽고, 배너가 약속하는 안내나 행동이 그곳에 있는지 비교하는 방법이 필요합니다.

도착 페이지가 맞고 배너만 오래된 경우에는 이미지 문구와 alt를 함께 수정할 수 있습니다. 반대로 배너와 alt가 현재 안내를 정확히 설명하지만 href가 다른 문서로 이어지면 주소가 수정 대상입니다. 어느 값이 기준인지 정하지 않고 세 항목을 일괄 변경하면 올바른 연결까지 달라질 수 있으므로 현재 목적지를 먼저 정해야 합니다.

사진 설명과 도착 행동의 차이도 별도로 판단합니다. 배너가 건물 사진을 사용하지만 위치 안내로 연결된다면 건물의 외형만 설명한 alt에는 링크 목적이 빠질 수 있습니다. 사진을 자세히 묘사해야 하는 본문 이미지와 달리, 이 링크에서는 위치 안내라는 이동 대상을 알리는 것이 기능에 맞는 편집 방향입니다.

시각 문구가 넓은 범위를 가리키고 도착 문서가 일부 내용만 다루는 경우도 있습니다. 이런 연결은 주소가 열리는지만으로 적합성을 판단하기 어렵습니다. 도착 문서가 제공하지 않는 범위를 배너가 약속한다면 배너의 표현을 좁히거나 그 안내를 실제로 제공하는 문서로 연결하는 선택이 필요합니다.

텍스트 링크 보완의 조건과 순서

이미지의 짧은 문구만으로 목적지를 구별하기 어렵거나 안내와 신청의 차이를 설명해야 한다면 텍스트 안내를 보완할 수 있습니다. 이는 모든 배너에 별도 링크를 추가하라는 개수 규칙이 아닙니다. 독자가 이미지의 이름만 읽고도 이동 대상을 이해하는지, 추가 설명이 필요한지를 기준으로 정하는 편집 제안입니다.

같은 링크 안에 설명 텍스트를 넣는 방식과 이미지 옆에 별도의 텍스트 링크를 만드는 방식은 구성이 다릅니다. 전자는 W3C의 로고 보조 예시처럼 이미지가 텍스트와 중복되는지 판단할 수 있습니다. 후자는 별개의 연결이므로 옆에 설명이 있다는 이유로 이미지 링크의 alt를 자동으로 비우는 근거가 되지 않습니다.

별도 텍스트 링크를 추가한다면 두 연결의 목적지가 같은지 구별합니다. 이름이 같은데 도착 내용이 다르면 차이를 예상하기 어렵습니다. 서로 다른 안내에는 각 대상을 드러내는 문구가 필요하며, 같은 안내에는 중복 배치의 필요성을 판단합니다.

실무 순서는 배너가 맡을 이동 목적을 정한 뒤 현재 href의 도착 내용과 비교하고, alt와 화면 문구를 그 목적에 맞추는 흐름입니다. 그다음 텍스트 보완의 필요성을 판단합니다. 스크립트로 앵커 텍스트를 삽입한다면 Google이 안내한 URL 검사 도구의 렌더링된 HTML에서 텍스트의 존재를 확인하는 조건도 유지합니다.

수정 후에는 화면 문구·alt·목적지가 대응하는지 비교합니다. 이 결과만으로 검색 반영 시점이나 순위, 이용자의 행동까지 확정할 수는 없습니다.

이어서 읽을 주제

배너가 설명하는 목적지와 실제 이동 주소를 정리한 뒤에는 해당 문서의 대표 주소와 발견 경로를 연결해 생각할 수 있습니다. 이 다음 질문은 사이트맵과 정규 주소에서 이어집니다.