网页制作 > HTML/Xhtml >
标记语言——图片替换
佚名
归纳
仔细研究了三种常用的图片替换技巧,从最早的Fahrner图片替换法开始,接着是它的两种变形,虽然都不是完美的做法,但是Mike Rundle之类的技巧已经非常接近完美了.应该能在现实世界里应用,只是必须要注意一些陷阱和缺点.
让我们分析这三个方法的主要差异:
方法A: 需要一组额外的没有意义的<span>标签. 在这段文字撰写时,常被使用的屏幕阅读器会被display属性影响,不念出任何内容(根据Joe Clark的研究结果而知) 在"关闭图片显示,启用CSS"的时候,什么都看不到.
方法B: 不需要额外标签 屏幕阅读器应该能正常念出内容. 要为IE5 for Windows使用盒模型Hack. 在"关闭图片显示,启用CSS"的时候,什么都看不到.
方法C: 不需要额外标签 屏幕阅读器应该能正常念出内容. 在"关闭图片显示,启用CSS"的时候,什么都看不到.
现在所有常见的方法都共享了最后一个缺点,但随着更多开发者持续研究图片替换的技巧,相信有一天会看到能够满足所有人的解决方法.
在那之前,还有几个图片替换的实际应用概念值得一提,将在本章稍后的"技巧延伸"单元中讨论其中的两个.
有个重点值得一提:有位遵照标准的设计师Dave Shea不断地观察图片图换技术的最新发展,同时维护了一份组织完善的页面,记载了不少相关技巧.一定记得看看Dave的"Revised Image Replacement" (http://www.mezzoblue.com/tests/revised-image-replacement/).
仔细研究了三种常用的图片替换技巧,从最早的Fahrner图片替换法开始,接着是它的两种变形,虽然都不是完美的做法,但是Mike Rundle之类的技巧已经非常接近完美了.应该能在现实世界里应用,只是必须要注意一些陷阱和缺点.
让我们分析这三个方法的主要差异:
方法A: 需要一组额外的没有意义的<span>标签. 在这段文字撰写时,常被使用的屏幕阅读器会被display属性影响,不念出任何内容(根据Joe Clark的研究结果而知) 在"关闭图片显示,启用CSS"的时候,什么都看不到.
方法B: 不需要额外标签 屏幕阅读器应该能正常念出内容. 要为IE5 for Windows使用盒模型Hack. 在"关闭图片显示,启用CSS"的时候,什么都看不到.
方法C: 不需要额外标签 屏幕阅读器应该能正常念出内容. 在"关闭图片显示,启用CSS"的时候,什么都看不到.
现在所有常见的方法都共享了最后一个缺点,但随着更多开发者持续研究图片替换的技巧,相信有一天会看到能够满足所有人的解决方法.
在那之前,还有几个图片替换的实际应用概念值得一提,将在本章稍后的"技巧延伸"单元中讨论其中的两个.
有个重点值得一提:有位遵照标准的设计师Dave Shea不断地观察图片图换技术的最新发展,同时维护了一份组织完善的页面,记载了不少相关技巧.一定记得看看Dave的"Revised Image Replacement" (http://www.mezzoblue.com/tests/revised-image-replacement/).