Image Replacement(이하 IR) 기법을 사용하면 기존 마크업의 수정없이 CSS조작으로 이미지를 교체하여 내용을 표시할 수 있고, 스크린리더 사용자도 고려할 수 있습니다.
하지만 이미지가 로드되지 않았을때 알아볼 수 없고, 인쇄시 배경이미지 출력 문제가 있습니다.
HTML 마크업 자체는 깔끔해질 수 있으나 접근성 측면에서 이 기법은 권장하지 않습니다.
input 버튼 요소의 IR 기법입니다.
아래 예제는 IE,FF,Oprea,Safari 에서 테스트했습니다.
(이미지는 Daum 의 검색버튼..)

하지만 이미지가 로드되지 않았을때 알아볼 수 없고, 인쇄시 배경이미지 출력 문제가 있습니다.
HTML 마크업 자체는 깔끔해질 수 있으나 접근성 측면에서 이 기법은 권장하지 않습니다.
input 버튼 요소의 IR 기법입니다.
아래 예제는 IE,FF,Oprea,Safari 에서 테스트했습니다.
(이미지는 Daum 의 검색버튼..)
소스코드 펼치기..

소스코드 & 결과
"웹표준" 카테고리의 다른 글
- Basic Style (css reset) (0) 2011/06/21
- 파이어폭스3.5 정식 출시 (0) 2009/07/01
- IE7 이하, line-height 문제 (0) 2009/06/22
- CSS Quiz 2! 에 도전~ (0) 2009/03/27
- 새롭게 바뀐 네이버(naver)의 웹표준 (4) 2009/01/30
Trackback
Trackback Address :: http://dohoons.com/blog/trackback/336
Comments