关于图片延时加载(jQuery.lazyload),影响百度搜索引擎抓取图片

  昨天,SEO小帅哥告诉我说:我加的这个延时加载(jQuery.lazyload)不行啊,影响优化呢!然后我一本正经的回了句,好好,我马上改(谁叫优化这方面他是老大呢)!

  我用的是jQuery.lazyload这个插件,园子里也有好多介绍这个插件的,我就不细说了。我去网上看了好多关于延时加载的方法,都是先把真实图片路径“藏起来”,用个小图代替,然后滚动(或者一系列事件)之后就替换成真实图片路径,这样优化的时候根本抓取不到图片,那怎么办呢?!.

  我想了两种办法:

  1.图片前面加个a链接,a链接里放图片真实路径,然后图片继续用延时加载得方法(能抓取的到吗?);

  2.图片采用真实地址,data-src也用真实图片地址,然后在head里先jq批量将图片的真实地址替换成loading图片地址,然后再继续用延时加载的方法;

  经跟后台确认,采用了第二个方法,园子里大家有没有好方法?求教~(第一次发,不喜勿喷)

  

时间: 2024-11-04 11:33:07

关于图片延时加载(jQuery.lazyload),影响百度搜索引擎抓取图片的相关文章

图片延时加载jquery.inview.js用法详解

我们在网站上总能见到这样的效果,若是有图片,图片都是先用loading加载一小段时间,然后紧接着出来要显示的图片,即效果如下: v2_loading.gif,几秒钟时间过渡到v2_pic_01_s.jpg这样,这就是图片延时加载. 具体实现技术如下: 1)引入jquery库文件: 2)引入jquery.inview.min.js文件: 3)html结构: <a href="http://q.wan.com" target="_blank" title=&quo

jquery插件之lazyload图片延时加载功能

公司投票程序,页面图片较多,导致页面显示很慢,做的图片延时加载: 代码: <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <meta charset="utf-8"> <title>demo</title> </

jquery实现图片延时加载[转]

本文转自:http://www.cnblogs.com/wscdzl/archive/2012/09/03/2668838.html 原理: 通过 jQuery 插件 lazyload 使得在浏览器可见区域外的图片不会被加载,当图片被用户滚动到浏览器可见区域时图片才进行加载,有点类似使用 Google 搜索图片时的效果.很明显,通过使用图片延时加载可以提高页面的加载速度. 实现过程: 首先是引入jquery文件和插件文件.jquery文件在这里我就不再赘述了.下面我贴出插件文件,我们将该文件命名

jquery插件图片延时加载实例详解(转)

jquery插件图片延时加载实例详解 效果预览:http://keleyi.com/keleyi/phtml/image/index.htm 使用方法:1.导入JS插件 <script src="http://keleyi.com/keleyi/pmedia/jquery-1.9.1.min.js" type="text/javascript"></script> <script src="http://keleyi.com/

jquery实现的图片延时加载插件

jquery实现的图片延时加载插件: 在很多网站尤其是图片站,都采用了图片延时加载效果,这样可以有效的减轻服务器的压力,有点自然不言而喻了,下面就和大家分享一个图片延时加载的插件,希望能够给大家带来一定的帮助. 代码如下: <script type="text/javascript"> (function( $ ){ $.fn.imglazyload=function( options ) { var o=$.extend({ attr:'lazy-src', contai

图片延时加载例子详解

有时候由于图片太大,我们需要一个友好的提示,提示用户图片正在加载中,那么以下通过引入jquery就能轻而易举的实现. demo下载地址:http://download.csdn.net/download/tjcyjd/8475549 其中需要3个js:jquery.min1.7.1.js.jquery.lazyload.js.image.lazyload.js 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//

图片延时 加载原理 及应用

关于 图片延时加载的基本理论: 当我们浏览一个页面时,我们有时候并不会看完一个网页的所有内容,那么我们在客户不浏览完所有内容的情况下,加载完所有的图片就会浪费流量,而且也会影响到网页的加载时间.为了解决这个问题,我们就设计了一种图片延时加载的机制,即当用户将页面快滑到图片的时候,我们开始加载图片,这样既省了流量,而且也不影响用户的体验 下面 我就多篇延时加载举一个例子 首先,我们创建所需的HTML标签及样式 <style type="text/css"> body, div

图片延时加载技术

同步延时加载页面延迟加载,即分屏显示,用户滚动页面,切换页面时显示当前屏幕的图片 原理:将img的地址暂时存在一个属性中,如data-original,而让src为空,等到鼠标滚动的时候,响应一个事件($(this).trigger('appear');),此时会把data-original中的地址取出来,放入src 1:引入jquery.lazyload.js,该js最好放在页面的最下面 2:给img添加延迟属性 如: <img class="lazy" src="/

一段实现页面上的图片延时加载的js

大家如果使用firebug去查看的话就会发现,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载,一定程序上加快了页面加载的速度,对于比较长的页面来说,这个方案是比较好的. 实现原理 把所有需要延时加载的图片改成如下的格式: <img lazy_src="图片路径" border="0"/> 然后在页面加载时,把所有使用了lazy_src的图片都保存到数组里,然后在滚动时计算可视区域的top,