`
yxgblog
  • 浏览: 37641 次
  • 性别: Icon_minigender_2
  • 来自: 郑州
最近访客 更多访客>>
社区版块
存档分类
最新评论

Web图片优化总结

阅读更多

图片的SEO是网站搜索引擎优化中的最重要的部分之一。对网站的图片进行搜索引擎优化(SEO)不仅会给网站带来更多额外的流量,还能带给访

问者更好的用户体验。本文中总结了在图片优化中需要注意的16个技巧。

  1. 在图片的alt标签(替换文字)中加入关键字。

  2. 标准的图片嵌入代码应当包含的5个关键性标签:src、width、height、alt和title。替换文字(alt )是为了给那些不能看到你文档中

图像的浏览者提供文字说明。title是对图片的说明和额外补充,如果需要在鼠标经过图片时出现文字提示应该用属性 title。一般alt标签最

为关键。 

  3. 给你的图片取个描述性的、包含你的目标关键字的文件名。如果你有一张图片是关于可爱的鹦鹉的,那么就应当使用像parrot.jpg这样

具有描述性质的文件名,而不是使用 t123.jpg这类只是代号的名字,当然也可以让图片的文件名与ALT标签里面的内容相同或者一致。不要随

随便便用这样的名字pic1234.jpg,而应该用描述更清楚的名字cute-parrot.jpg。

  4. 图片和所在网页内容必须相关:浏览图片不是访问者访问网页的第一件事情,但是会让访问者在页面停留的时间更久一些。(根据眼睛

追踪的研究结果,浏览网页时文字优先于图片,但看印刷文章时,人们会先看图片。虽然人们在看网页时会先看页面上的文字,但是图片会让

他们停留的时间更久并对页面有更深刻的印象)

  5. 在图片周围添加相关信息。如果你用Google搜索图片,会不难发现,在每张图片下会有一段描述性文字,其中关键字用粗体显示。

Google图片搜索通过分析页面上图片附近的文字、图片标题以及许多其它元素来确定图片的内容。所以在图片周围添加包含关键字的描述信息

将可以优化网站图片在搜索引擎中的排名。 .

  6. 指向图片的链接要包含关键字。使用超链接打开图片,那么超链接的名字应当包含图片的关键字,比如你要链接一张可爱的鹦鹉的图片

,就不宜使用“点击获得完整尺寸”等链接文字,而应当试着使用诸如“可爱的鹦鹉”之类的命名形式。

  7. 确保图片可以被搜索引擎抓取。设置网站的robots.txt文件保证图片文件可以被搜索蜘蛛抓取。记住不要使用javascript链接图片文件

。如果你那样做的话,搜索引擎是无法检索到你的图片文档的。 .

  8. 没有必要优化你网站上的所有的图片。比如模板中使用的图片、导航中的图片还有背景图片等等,我们不用为这些图片添加ALT标签,

我们可以把这些图片放在一个单独的文件夹里。并通过设置robots.txt文件来阻止蜘蛛抓取这些图片。 .

  你可以设置所有的蜘蛛都被阻止抓取这些图片:

  User-agent: * 对真正的成功者来说,不论他的生存条件如何,都不会自我磨灭

  Disallow: /Images 

  也可以只阻止Google图片搜索蜘蛛抓取:

  User-agent: Googlebot-Image

  Disallow: /Images

  9. 避免有重复的图片。举个例子,你的网站上的一张图片有三种形式存在:较小尺寸的图片,中等尺寸的图片,较大尺寸的图片。那么,

不要让这三张图片都被索引到。处理这种情况的最好的方式是用robots.txt文件告诉蜘蛛不要抓取你不想被索引的图片版本。 根据专家观察,

这样的理论和现象都是值得各位深思的,所以希望大家多做研究学习,争取总结出更多更好的经验!

  10. 每个网页的图片数量尽量要少。

  11. 注意图片的尺寸以适应搜索引擎,比如你链接的是一张壁纸,那么壁纸的大小就应当符合规范。 因为Google、百度等图片搜索都提供

根据图片尺寸来搜索。 。

  12. 经常更新图片。如果你的图片很长时间没有变化(图片尺寸、图片文件大小、图片位置和图片名称等没有发生变化),其排名可能被降

低,因为搜索引擎会怀疑图片内容是过时的。

    13. 使用Google网站管理员增强型图片搜索功能。启用增强型图片搜索功能,Google 将使用 Google Image Labeler 等工具将你网站所包

含的图片与标签相关联,以优化这些图片的索引并提高搜索质量。

  14. 图片被盗用是一个很难避免的问题。我们可以在每张图片上加上一些水印,比如"photo by www.idcquan.com" ,"image by

www.idcquan.com"等等。虽然并不能完全杜绝盗用,但至少别人要想使用你的图片就得花时间来重新编辑它。

  15. 检查被搜索引擎图片搜索索引的图片收录情况。为了检查对网站图片的优化方法是否成功,需要监测搜索引擎对网站图片的收录率。

方法是在http://images.google.cn/搜索栏中输入(将www.idcquan.com替换成你需要查询的域名)。其他搜索引擎也有这样的功能。

 

本文来自CSDN博客,转载请标明出处:http://blog.csdn.net/ajaxchen_615/archive/2009/06/15/4270418.aspx

分享到:
评论

相关推荐

    提高Web性能的前端优化技巧总结

    这篇文章讲述可以帮助 改善优化前端的技术,非常有用。主要内容有清理代码、压缩图片、压缩外部资源、使用CDN,以及一些其它方法。这些方法会为你的网站带显著的速度提升和整体性能提升。 一. 清理 HTML 文档 HTML,...

    高效前端:Web高效编程与优化实践_机械工业出版社; 第1版 (2018年1月1日) 完整版-未加密

    全书以问题为导向,精选了前端开发中的34个疑难问题,从分析问题的原因入手,逐步给出解决方案,并分析各种方案的优劣,最后针对每个问题总结出高效编程的最佳实践和各种性能优化的方法。全书共7章,内容从逻辑上...

    webpack学习教程之前端性能优化总结

    webpack是近期最火的一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX)、coffee、样式(含less/sass)...这篇文章主要给大家总结介绍了关于webpack学习教程之前端性能优化的相关资料,需要的朋友可以参考下。

    blog:想更多!了解更多!

    personal blog 合抱之木,生于毫末;九层之台,起于累土;千里之行,始于足下 ————《老子》 工程化 webpack 应用系列 源码进阶系列 【webpack进阶系列(七)】写个 ...深入了解HTTP/2的前世今生以及Web性能优化总结

    每个前端工程师都应该懂的前端性能优化总结:

    文章目录采用css雪碧图(css sprite/css图片精灵)技术在项目中,我们最好把css或者js文件进行合并或者压缩,尤其是在移动端开发的时候,如果css或者j s内容不是很多,我们可以采用内嵌式,以此减少http的请求次数,...

    Web应用前端技术的探索与实践

    Web应用前端技术的探索与实践 1 1 前端开发那些事 1 2 怎样提高前端的质量和工作效率? 1 附件(关于2011年工作的一点浅见) 3 3 探讨一些技术问题 4 3.1 Frameset和iframe 4 3.2 Frameset和Div两种方式的...8 总结 205

    ASP.NET4高级程序设计第4版 带目录PDF 分卷压缩包 part1

    手动优化了PDF的书签,书签可折叠,书签链接以目录方式保存,多达1000多页,每页都做了书签定位,手都累酸啦。 ============================== 因权限只能到60MB,分卷压缩了,共3个压缩包,需下载完3个一起解压, ...

    blog:joeyguo's blog 请 Watch 或 Star

    React同构直出优化总结 Node直出(服务端渲染)再优化(coming soon) | React 前端路由实现与 react-router 源码分析 React 数据流管理架构之 Redux | RxJS 构建流式应用—RxJS详解 | gka 简单的、高效的帧动画生成工具...

    ASP.NET Night Words

    10.6 总结.. 194 进 阶 知 识 第11章 web.config详解 196 11.1 配置文件的查找算法 196 11.2 配置文件节点介绍 198 11.2.1 [configsections]节点 198 11.2.2 [appsettings]节点 199 11.2.3 ...

    网站性能优化(yahoo)

    的Exceptional Performance团队为改善Web性能带来最佳实践。他们为此进行了一系列的实验、开发了各种工具、写了大量的文章和博客并在各种会议上参与探讨。最佳实践的核心就是旨在提高网站性能。 Excetional ...

    GTCMS好文本网站内容管理系统 v1.08

    GTCMS是由好文本网总结之前WEB开发经验,秉承简单、易用、轻巧、快速的理念开发出的一套优秀的网站内容管理系统。GTCMS可用于搭建各种网站,其中众多设计方便灵活,可满足各种特色企业网站的设计需求。GTCMS功能特点...

    超经典的Web前端与移动开发基础视频 Web前端基础开发视频教程 移动开发基础视频教程

    26前端开发基础视频-图片标签img的使用和title的seo优化.avi 27前端开发基础视频-网站图片的类型及如何选择.avi 28前端开发基础视频-有序列表和无序列表.avi 29前端开发基础视频-有序列表和无序列表的补充.avi ...

    front-end-notes:前端笔记

    ReactHybrid总结md-4:CSS 必备知识介绍HTML 基础CSS 基础CSS 布局CSS 效果CSS 动画CSS 预处理器BootstrapCSS 工程化框架中的 CSS总结md-5:Web 前端性能优化web 前端性能优化资源的合并与压缩图片相关的优化css 和 ...

    GDI+图像程序设计(PDF & 源码 -电子工业出版社)

     本书从介绍GDI+Windows图形程序设计的基本知识开始,其核心是对一些实际问题的指导,包括如何使用Windows Forms及如何优化GDI+的性能。本书通过一些例子来说明如何开发真实世界的工具,如GDI+Painter、GDI+Editro...

    自动化测试面试题总结.docx

    17,h5页面图片未加载出来问题排查 18,区分原生和h5页面 19,为什么不能用jenkins打包 三、性能测试 1,了解jmeter 2,性能指标 3,如何做性能测试 四、接口测试 1,如何设计接口测试用例 2,为什么要做接口测试 3...

    GTCMS好文本网站内容管理系统 v1.08.zip

    GTCMS是由好文本网总结之前WEB开发经验,秉承简单、易用、轻巧、快速的理念开发出的一套优秀的网站内容管理系统。GTCMS可用于搭建各种网站,其中众多设计方便灵活,可满足各种特色企业网站的设计需求。   GTCMS...

    Eclipse开发分布式商城系统+完整视频代码及文档

    项目总结.avi │ 12.项目中遇到的问题.avi │ 13.quartz.avi │ aa.quartz框架.avi │ 淘淘商城第十二天笔记.docx │ ├─补充1:拔高课程(Redis3.0持久化、集群、MySQL5.6优化、Tomcat7优化) │ │ 打开必读.txt...

    ROYcms ! NT 开源的ASP.NET CMS

    ROYcms是由roy_web1全力打造的一款网站信息管理系统。 ROYcms以信息为主题,通过以文字和图片标题为起点,以无限栏目分类为支撑,配合多项插件的灵活使用,以达到信息门户的远景! ROYcms总结各类信息门户的现状,...

Global site tag (gtag.js) - Google Analytics