이미지 대체 텍스트 > 장차법

매출이 오르면 내리는 수수료! 지금 수수료센터에서 전자결제(PG)수수료 비교견적 신청해 보세요!

장차법

이미지 대체 텍스트 정보

이미지 대체 텍스트

본문

웹 페이지에서 보여지는 이미지에는 이미지 내용과 동등한 내용의 대체텍스트를 제공해야 한다고 합니다.

 

예)

cc8f8b543826951c88fd9a10c62a78d5_1448848932_2657.jpg

일반적으로는

alt에 로고 혹은 logo로 처리를 많이들 하게 되지만, 아래와 같이 동일한 대체 텍스트를 제공해주셔야 합니다.

 

<img src=~~/img/logo.png alt="GNUBOARD5"> 

공감
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);
        }
    });
});
좋은 스크립트네요.

하지만 접근성 관점에서 볼 때 처음부터 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', '');
    });
});
맞는 말씀이신데 실천이 어렵네요.
구글봇이 alt 값을 좋아한다는 걸 어디선 본 것도 같습니다.
관심은 계속 갖어야겠습니다.
검사 프로그램의 경우는 통과가 되어서, 습관처럼 이랬는데...
막상 장애인 이용자에게 연락이 오니, 제가 아차 싶더라구요 ㅠ
전체 19 |RSS
장차법 내용 검색

회원로그인

(주)에스아이알소프트 / 대표:홍석명 / (06211) 서울특별시 강남구 역삼동 707-34 한신인터밸리24 서관 1404호 / E-Mail: admin@sir.kr
사업자등록번호: 217-81-36347 / 통신판매업신고번호:2014-서울강남-02098호 / 개인정보보호책임자:김민섭(minsup@sir.kr)
© SIRSOFT