웹 페이지에서 보여지는 이미지에는 이미지 내용과 동등한 내용의 대체텍스트를 제공해야 한다고 합니다.
예)
일반적으로는
alt에 로고 혹은 logo로 처리를 많이들 하게 되지만, 아래와 같이 동일한 대체 텍스트를 제공해주셔야 합니다.
<img src=~~/img/logo.png alt="GNUBOARD5">
이 게시물을 신고 하시겠습니까?신고사유를 선택해주세요.
댓글 9개
$(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="~">
{
var alt, s, r;
$('img').each(function()
{
alt = $(this).attr('alt');
// alt='제목' 와 alt='' 는 그냥 가고
// <img src='' /> alt 자체가 없는 것만
if(!alt)
$(this).attr('alt', '');
});
});
구글봇이 alt 값을 좋아한다는 걸 어디선 본 것도 같습니다.
관심은 계속 갖어야겠습니다.
막상 장애인 이용자에게 연락이 오니, 제가 아차 싶더라구요 ㅠ