이미지 대체 텍스트 정보
이미지 대체 텍스트
본문
웹 페이지에서 보여지는 이미지에는 이미지 내용과 동등한 내용의 대체텍스트를 제공해야 한다고 합니다.
예)
일반적으로는
alt에 로고 혹은 logo로 처리를 많이들 하게 되지만, 아래와 같이 동일한 대체 텍스트를 제공해주셔야 합니다.
<img src=~~/img/logo.png alt="GNUBOARD5">
공감
0
0
댓글 9개
// 문서내 alt 없는 것만 파일명 추출해서 alt 넣기 : 구누보드
$(window).load(function()
{
var alt, s, r;
$('img').each(function()
{
alt = $(this).attr('alt');
// <img src='' alt='' /> or <img src='' />
if(!alt || alt == 'undefined')
{
s = $(this).attr('src');
r = s.replace(/^.+\//, '');
$(this).attr('alt', r);
}
});
});
$(window).load(function()
{
var alt, s, r;
$('img').each(function()
{
alt = $(this).attr('alt');
// <img src='' alt='' /> or <img src='' />
if(!alt || alt == 'undefined')
{
s = $(this).attr('src');
r = s.replace(/^.+\//, '');
$(this).attr('alt', r);
}
});
});
좋은 스크립트네요.
하지만 접근성 관점에서 볼 때 처음부터 alt 속성값이 빈값으로 존재하는 경우에는 그대로 놔두는 편이 바람직합니다.
문서에서 특별한 의미를 가진 이미지라기보다는 장식용 요소에 가까운 이미지가 되도록요.
ex) <img src="~" alt="">
alt 속성값이 아예 제공되지 않은 경우에 대해서는 alt 속성값을 빈값으로 만들어주거나 혹은 더 많은 고민이 필요할 지도 모릅니다.
ex) <img src="~">
하지만 접근성 관점에서 볼 때 처음부터 alt 속성값이 빈값으로 존재하는 경우에는 그대로 놔두는 편이 바람직합니다.
문서에서 특별한 의미를 가진 이미지라기보다는 장식용 요소에 가까운 이미지가 되도록요.
ex) <img src="~" alt="">
alt 속성값이 아예 제공되지 않은 경우에 대해서는 alt 속성값을 빈값으로 만들어주거나 혹은 더 많은 고민이 필요할 지도 모릅니다.
ex) <img src="~">
$(window).load(function()
{
var alt, s, r;
$('img').each(function()
{
alt = $(this).attr('alt');
// alt='제목' 와 alt='' 는 그냥 가고
// <img src='' /> alt 자체가 없는 것만
if(!alt)
$(this).attr('alt', '');
});
});
{
var alt, s, r;
$('img').each(function()
{
alt = $(this).attr('alt');
// alt='제목' 와 alt='' 는 그냥 가고
// <img src='' /> alt 자체가 없는 것만
if(!alt)
$(this).attr('alt', '');
});
});
정말 대단하십니다...
+1
맞는 말씀이신데 실천이 어렵네요.
구글봇이 alt 값을 좋아한다는 걸 어디선 본 것도 같습니다.
관심은 계속 갖어야겠습니다.
구글봇이 alt 값을 좋아한다는 걸 어디선 본 것도 같습니다.
관심은 계속 갖어야겠습니다.
진짜 실천이 가장 어럽더라구요...마감 기간에 쫒기다 보니...ㅠ
알고는 있지만 제목달기 버거운 경우는 무조건 빈값.... 그러면 일단 넘어는 가주니까요 ㅠ
검사 프로그램의 경우는 통과가 되어서, 습관처럼 이랬는데...
막상 장애인 이용자에게 연락이 오니, 제가 아차 싶더라구요 ㅠ
막상 장애인 이용자에게 연락이 오니, 제가 아차 싶더라구요 ㅠ
