如何使用浏览器控件在图像中查找文本+ F

有许多部分的HTML页面，每个部分的部分标题都显示为图像（使用漂亮的字体）。问题是，即使我在每个图像/标题上指定了“alt”和“title”文本，Ctrl + F浏览器功能也无法找到文本。认为两种可能的解决方案，但不是很高兴他们如何使用浏览器控件在图像中查找文本+ F

1）使用嵌入字体。问题：找不到客户端需要使用的字体并且不确定版权。

2）将图像中的文字放在图像附近的DIV中，但隐藏在用户视图中。问题：搜索引擎可以考虑这个关键字填充吗？如果显示：浏览器是否会找到文本：无

有没有人有更好的解决方案？感谢里加

来源

2010-06-11 Riga

要回答Q2。 CTRL-F不能用于隐藏'display：none'的div内的文本。 – 2010-06-11 13:18:29

浏览器无法搜索图像中的文字。 'display：none'也不能解决你的问题。我建议只在需要它们的地方使用图像。标题一定要用纯文本书写。 – hudolejev 2010-06-11 13:22:50

要回答Q2，您可以隐藏用户视图中的文本而不使用display：none; 。 Juste必须添加余量：-9999; – 2010-06-11 13:25:20

通常情况下，图像替换的最佳方法是在样式表中完全实现。

的HTML仍然应该是这样的：那么

<h2 id="fantastic-section-of-awesomeness"><span>This is an Ordinary Heading</span></h2>

你的CSS可以这样做：

h2#fantastic-section-of-awesomeness { 
    background: ...; /* The replacement image */ 
} 
h2 span { 
    text-indent: -100000px; 
}

注意，文本实际上没有隐藏。某些屏幕阅读器不正确地解释display: none;（即使在media="screen"样式表中给出）。相反，我们只是简单地将它从屏幕的左侧转移到屏幕的左侧，实际上看不到它。

我还没有专门测试过Ctrl + F，但文本仍然在技术上可见的事实应该允许浏览器找到它。

它会不是能够突出图像作为匹配，但是，这可能仍然会导致混淆。没有使用@font-face没有真正的方法。

来源

2010-06-11 13:23:49 VoteyDisciple

嗯...我要推荐Cufon作为替代使用生成的图像，但它并不完美：搜索在Firefox的作品，但不太好（坏的定位和没有高亮）。

仍然比图片更像标题。

来源

2010-06-11 13:16:55

要做到这一点，我已经使用这个generator

这些网站也有实例和使用说明使用这个库中的typeface.js Javascript library

您可以生成自定义字体。

来源

2010-06-11 13:21:02 gruntled

尝试Ctrl + F，但未找到文本 – Riga 2010-06-11 14:43:17

我正在查看其中的一些示例，但无法搜索。但我正在使用这个网站搜索工作正常。我会看看是否有一个特定的标志。 – gruntled 2010-06-11 15:06:18

你使用哪种版本的字体库？ – gruntled 2010-06-11 15:10:47

为什么不尝试一下Google Font Directory

的谷歌字体目录可以让你浏览所有通过谷歌字体API提供的字体。目录中的所有字体都可用于您的网站的开放源代码许可证，并由Google 服务器提供服务。

来源

2010-06-11 13:23:04

我的客户所需的字体不在Google提供的集合中。我的客户不知道版权尝试使用FFox 3.6并且所有字体看起来都一样。 – Riga 2010-06-11 14:44:42

你也可以使用上的元素的z-index：使用户只能看到图像，但可以找到部分

<html> 
    <body> 
     ... 
     <div> 
      <div style="position:absolute; z-index: 1">My Section Header</div> 
      <div style="position:absolute; z-index: 2"><img src="test.png"/></div> 
     </div> 
     ... 
    </body> 
</html>

的图像是在文本的前面，当他搜索“我的科头”。

来源

2010-06-11 13:27:41

如何使用浏览器控件在图像中查找文本+ F

回答

相关问题