为SEO准备基于图像的网页设计的最佳技术 - noscript?

时间:2013-05-15 18:27:57

标签: html image seo alt noscript

好的,所以我知道这真是令人不悦,这是我通常不会做的事情。事实上,我从未推出过像这样的网站。但似乎没有太多替代方案。

我正在使用一个基本上只是整页滑块的客户端的网页设计。原始设计看起来可能已移植到Flash。我打算使用jQuery,所以至少它不依赖于插件,但内容文本设计错综复杂,并融入了幻灯片图像。

从我所看到的,我可以实际放置到页面而不嵌入图像的唯一文本是导航,可能是网站标题的一部分。

幻灯片图片中有很多内容 - 在< img />上输入alt =“”属性太多了标签。我知道longdesc =“”属性是从HTML5中弃用的,并且无论如何都不太受支持,所以就这样了。我想从图像中复制文本并将其放在隐藏的< div>< / div>中标签,或在< noscript>< / noscript>中标记,或抵消它以使其不可见,以及隐藏基于JavaScript的动态网站内容的其他方法。但是,我也知道像谷歌这样的搜索引擎开发者对这种事情不屑一顾,这可能会损害我的SEO排名。

< noscript>< / noscript> element是一个很好的解决方案,但根据我的理解,如果元素的内容与文档中其他地方存在的内容重复并且是动态控制的,那么您只能合法地实现它。也许我误解了?

您能想到其他任何解决方案吗?

2 个答案:

答案 0 :(得分:1)

您应该创建一个占位符 div,其中包含基于文本的内容。比创建一个JavaScript函数(onload)以用图像替换占位符innerHTML属性!

答案 1 :(得分:1)

object元素

您可以使用object代替imgobject element的内容将用作后备(作为屏幕阅读器用户或搜索引擎机器人的替代方案):

<object data="your-image.png" type="image/png">
  <!-- the alternative/fallback content -->
</object>

longdesc属性

或者您可以对longdesc元素使用img属性,该元素在单独的细分中定义:http://www.w3.org/TR/html-longdesc/(工作草案):

  

此规范定义了longdesc属性,用于将扩展描述与基于HTML5的内容中的图像相关联。

meta - description

此外,您可以在description - meta element中添加文字(或开头或其摘要):

<meta name="description" content"…">

但这只适用于每个图片都有单独的网址(可以使用History API完成)