튜토리얼
제품 이미지 대체 텍스트: 사진 및 4패널 광고 예시
제품 사진, 색상 옵션 및 완전한 4패널 광고에 유용한 대체 텍스트를 작성하는 방법과 함께, 작업 예시 및 별도의 긴 설명을 제공합니다.
제품 이미지 대체 텍스트는 쇼핑객이 해당 특정 이미지에서 필요로 하는 정보를 중심으로 작성해야 합니다. 필요한 경우 제품 또는 변형의 이름을 지정하고, 의미 있는 시각적 세부 사항을 설명하며, 이미지에 표시된 중요한 단어를 보존하십시오. 완전한 4패널 광고는 모든 것을 하나의 혼잡한 alt 속성에 강제로 넣지 않고도 순서가 이해될 수 있도록 근처에 더 긴 설명이 필요할 수도 있습니다.
동일한 컵이라도 카탈로그 썸네일, 뚜껑 클로즈업, 만화 광고에서는 다른 문구가 필요할 수 있습니다. 페이지에서 이미지의 역할부터 시작하여, 그렇지 않으면 누락될 정보를 설명하십시오.
이미지의 목적에 따라 설명을 선택하세요
W3C의 이미지 지침은 정보성, 장식성, 기능성 및 복합 이미지를 구분합니다. 이는 저자에게 맥락을 고려하고, 유용한 텍스트 등가물을 제공하며, 모든 이미지를 동일하게 취급하지 않도록 요청합니다. 아래 표는 이 원칙을 가상의 여행용 컵 캠페인에 적용한 것입니다.
| 이미지 사용 | 보존할 정보 | 예시 문구 |
|---|---|---|
| 제품 상세 사진 | 모양, 변형 및 보이는 특징 | 뚜껑에 접이식 손잡이가 있는 모래색 여행용 컵. |
| 뚜껑 클로즈업 | 이 보기가 추가하는 세부 정보 | 컵의 손잡이가 뚜껑의 홈에 평평하게 접힙니다. |
| 색상 옵션 제어 | 제어가 선택하는 옵션 | 주변 제어 레이블에 따라 Sand 또는 Select sand. |
| 4패널 광고 | 제품, 순서 및 필수 문구 | Loop 컵의 4패널 광고로, 책상에서 기차 통근 중 접이식 손잡이를 보여줍니다. 전체 설명은 아래에 있습니다. |
| 제목 뒤의 장식용 질감 | 추가 정보 없음 | 진정으로 장식적인 경우 빈 텍스트 대체. |
이 예시들은 해당 기능이 보이고 정확하다고 가정합니다. 단열, 누수 방지 또는 재료를 외관만으로 추론하지 마십시오. 반짝이는 표면만으로는 제품이 어떤 금속을 사용하는지 알 수 없습니다.
키워드 목록이 아닌 추가 정보를 설명하세요
유용한 세부 설명은 “두 개의 패딩 처리된 어깨끈이 있는 네이비 데이팩의 뒷모습”이라고 말할 수 있습니다. “최고의 백팩 여행 백팩 프리미엄 백팩”과 같은 문자열은 그림을 설명하지 않습니다. 앞면과 뒷면 보기 중에서 선택하는 데 도움이 될 수 있는 문장을 작성하십시오.
적절한 반복량은 주변 텍스트에 따라 달라집니다. 연결된 썸네일과 제품 제목이 하나의 링크를 형성하는 경우, 제목을 다시 반복하기 전에 결합된 접근 가능한 이름을 검사하십시오. 색상 견본이 변형을 선택하는 유일한 방법인 경우, 제어가 색상과 선택된 상태를 전달하는지 확인하십시오. 이미지 속성만으로는 전체 인터페이스가 아닙니다.
이미지가 무엇에 관한 것인지 식별할 때 제품 이름을 사용하십시오. 이 이미지를 다음 이미지와 다르게 만드는 특정 세부 정보를 추가하십시오. 의미를 변경하지 않는 한 모든 배경 개체를 설명할 필요는 없습니다.
4패널 광고에 짧은 진입점과 완전한 설명을 제공하세요
만화 스타일 광고는 패널 간의 관계를 포함합니다. APLN의 만화 이미지 설명 가이드는 기계적으로 개체를 나열하는 대신 순서와 상호 작용을 전달하는 것에 대해 논의합니다. 광고의 경우, 이는 제안을 전달하는 단어를 보존하는 것을 의미하기도 합니다.
이 가상의 광고를 고려해 보십시오: 통근자가 책상에서 Loop 컵을 들고, 손잡이를 접고, 기차에 가지고 타고, 그런 다음 쇼핑 초대와 함께 제품 클로즈업을 봅니다. 유일한 제품 주장은 접이식 손잡이입니다. 이것은 편집 예시이며, 생성된 결과나 테스트된 캠페인이 아닙니다.
표의 짧은 대안을 진입점으로 사용하십시오. 다음의 더 긴 설명을 이미지 옆이나 명확하게 이름이 지정된 접근 가능한 설명 제어 뒤에 배치하십시오:
4개의 패널, 위쪽 행을 따라 왼쪽에서 오른쪽으로 읽고, 그 다음 아래쪽 행을 읽습니다.
책상에서 통근자가 모래색 Loop 컵을 잡으려고 합니다. 문구는 “From desk to departure.”입니다.
클로즈업은 손잡이가 뚜껑 안으로 접힌 것을 보여줍니다. 문구는 “A handle that folds flat.”입니다.
기차에서 통근자가 손잡이를 올린 채 컵을 들고 있습니다. 추가 문구는 없습니다.
마지막 패널은 컵만 보여줍니다. 문구는 “Loop”와 “Explore the cup.”입니다.설명을 최종 이미지와 일치시키십시오. 수정으로 기차 장면이 주방으로 변경되면 설명도 변경되어야 합니다. 이미지가 더 이상 따르지 않는 이전 브리핑을 설명하지 마십시오.
필수 광고 문구를 텍스트로 제공하세요
간결한 헤드라인과 쇼핑 초대는 쉽게 따라갈 수 있는 경우 짧은 대안에 직접 포함될 수 있습니다. 더 긴 대화나 여러 캡션이 있는 순서는 완전한 인접 설명으로 더 잘 처리됩니다. 임의의 문자 수를 맞추기 위해 가격 조건이나 자격을 단순히 삭제하지 마십시오.
이것은 광고를 별도의 텍스트 레이어로 재구성할 필요가 없습니다. 완전한 이미지는 통합된 타이포그래피를 유지할 수 있습니다. 텍스트 대안은 이미지를 직접 사용할 수 없는 사람들에게 서비스를 제공하며, 게시하는 페이지 또는 플랫폼에 속합니다.
게시 플랫폼이 제한된 설명 필드만 제공하는 경우, 사용 가능한 필드를 신중하게 사용하고 나머지 중요한 정보는 게시물 캡션이나 첨부 페이지에 넣으십시오. 한 플랫폼의 제어가 모든 곳에 존재한다고 가정하지 말고 실제 대상을 확인하십시오.
광고 제작 후 설명을 완성하세요
Panelly Studio에서 완전한 광고를 만들고 다듬은 다음, 최종 버전에서 대안을 작성하십시오. 이미지 파일과 설명을 배송 노트에 함께 보관하십시오. `loop-commute-v2.png`와 “Loop commute v2 description”과 같은 간단한 쌍은 나중에 업데이트를 추적하기 쉽게 만듭니다.
이미지를 사용할 수 없는 상태에서, 그리고 가능한 경우 보조 기술을 사용하여 페이지를 검토하십시오. 누군가 제품을 식별하고, 순서를 이해하고, 동일한 목적지에 도달할 수 있습니까? 이것은 키워드를 세는 것보다 더 유용한 검토입니다.
FAQ
이상적인 대체 텍스트 길이가 있나요?
단일 길이가 모든 이미지와 게시 맥락에 적합하지는 않습니다. 짧은 대안은 집중적으로 유지하고, 간결한 문구로 전달할 수 있는 것보다 더 많은 정보를 이미지가 담고 있을 때 더 긴 등가물을 제공하십시오.
모든 제품 썸네일이 제품 이름을 반복해야 하나요?
먼저 주변 링크와 텍스트를 확인하십시오. 목표는 이해하기 쉬운 결합된 경험입니다. 상세 사진은 제품 그리드 썸네일과 다른 정보가 필요한 경우가 많습니다.
AI가 설명을 작성할 수 있나요?
초안을 작성하는 데 도움이 될 수 있지만, 결과를 실제 이미지 및 페이지 맥락과 비교하십시오. 게시하기 전에 발명된 기능, 누락된 문구 및 잘못된 읽기 순서를 수정하십시오.
보이는 이미지와 설명을 일치시키세요
아래의 가상의 ATELIER 병은 저희 기록된 수정 연습에서 실제로 생성된 편집 이미지입니다. 이것은 4패널 광고나 실제 고객의 제품이 아닌 단일 제품 장면입니다.
이 이미지에 대한 간결한 대안은 “검은색 캡과 아이보리 라벨이 있는 앰버 ATELIER 향수병이 흰색 배경에 베이지색 돌 플랫폼 위에 서 있습니다.”입니다. 이것은 향수 노트, 성분 또는 성능 주장을 발명하지 않고 보이는 병과 설정을 식별합니다.
이미지가 수정 튜토리얼 내에 나타나면, 주변 캡션은 꽃, 거울, 직물이 제거되었지만 원래의 따뜻한 벽과 플랫폼 모양이 변경되었다고도 말해야 합니다. 이 비교는 튜토리얼 맥락에 속하며, 모든 제품 썸네일의 대체 텍스트에 반복될 필요는 없습니다.
이전 Loop 컵 순서는 작성된 예시일 뿐입니다. 이 향수 이미지에 4패널 설명을 첨부하지 마십시오. 최종 보이는 자산을 사용하여 짧은 대안으로 충분한지 또는 별도의 순서 설명이 필요한지 결정하십시오.
