2010-12-22 5 views
1

저는 메인 사이트 탐색에서 실제로 이미지를 사용하고 싶은 디자이너가 있습니다. 어떤 결과가 유효성 확인접근성에 대해 어떤 영향을 미치는지 확신 할 수 없습니다.HTML - 링크에 이미지 롤오버를 사용해도 괜찮습니까?

디자이너는 Alt 태그에 텍스트를 넣으면 괜찮을 것이라고 말합니다. 아무도 이것을 확인하거나 반박 할 수 있습니까?

감사합니다.

+1

아마도 @ font-face를 사용하여 사용자 정의 글꼴 모양을 볼 수있을 것입니다. – JakeParis

답변

3

어둠의 시대에 머물러있는 디자이너처럼 들립니다.

예, alt은 화면 판독기에서 속성을 읽으므로 시각 장애인을 찾을 수 있습니다.

그러나 화면 판독기를 사용하지 않지만 고 대비 또는 높은 수준의 확대/축소가 필요한 경우에는 이점이 없습니다.

HTML에 H1 태그를 사용할 때 포함 된 링크 및 의미있는 마크 업과 같은 것들도 손실됩니다 (이미지가 헤더라고 가정하는 방법은 무엇입니까?).

일부 텍스트는 일반 HTML 에서처럼 alt 속성 내에 쉽게 표시되지 않을 수 있다는 점에서 다른 어려움이 있습니다.

지금까지는 접근성에 대한 것이 었습니다. 유효성 검사가 어떻게 이루어질 지 확신하지 못했습니다. 검증에 대한 의미를 설명해 주시겠습니까? 유효한 HTML에 대해 이야기하고 있다면 이미지에 alt 태그가있는 한 유효한 것입니다.

@Font-Face CSS3 선택기 (IE7 +가 포함 된 모든 최신 브라우저에서 작동해야 함)와 같이 웹 페이지에서 맞춤 글꼴을 사용하는 다른 방법이 있습니다.

+0

안녕하세요, 입력 해 주셔서 감사합니다 ... "임베디드 링크"란 무엇입니까? – Owen

+0

@ 마크 플린트 - 링크. 'href'는 다른 웹 문서에 적용됩니다. - – Oded

3

저는 스크린 리더 사용자이고 대체 텍스트가있는 링크가 잘 작동하므로 문제가되지 않습니다. 링크 사이의 탭 탐색이 사용자가 페이지의 특정 영역과 상호 작용해야한다는 점을 인식하지 못하기 때문에 문제가 발생할 수 있지만 링크의 일부가 아닌 immage를 사용자가 클릭하게하려면.

0

이 오래가 relativly 위치와 얼굴의 DOM에 적절한 순서로 서로

+0

이 루트를 사용하려면 이미지를 배경으로 사용하고 CSS 호버를 사용하여 스왑해야합니다. 그게 나쁜가요? – Owen

1

슬랩 당신의 디자이너를 다음 것 같이해야한다! :)

이미지에는 텍스트를 사용하지 마십시오. 대신 @ font-face를 사용하십시오.

당신은 http://www.fontsquirrel.com/fontface/generator

검색 엔진 @ 글꼴을 변환 할 수있는 텍스트 .. 음 ... 같은 텍스트가 필요합니다.

그들은 alt 텍스트를 사용하지만 일반 텍스트보다 훨씬 가벼울 것입니다.

그리고 이미 이미 언급 한대로 이미지를 사용할 필요가 없습니다. @ font-face!

+0

fontsquirrel 링크 – Owen

+0

에 감사드립니다. 전에는 들어 보지 못했습니다. 나를 계몽 해 주셔서 감사합니다. – qwertymk

1

이미지를 찾으러가는 경우 Alt 키를 눌러 태그를 붙이면되지만 SEO가 어려워지고로드하는 데 시간이 오래 걸리고 일부 사용자에게는 실용적이지 않을 수도 있습니다.(see also Oded's answer)

나는 google font api과 같은 것을 권장합니다. 매우 호환 가능하며 아름다운 글꼴/텍스트를 생성 할 수 있습니다.

다른 옵션이 있지만 이미지를 이동하는 방법은 아닙니다.

관련 문제