标签 SEO 下的文章

这篇文章个人觉得很受用,故仔细翻译了一下,有些地方可能翻译的不好,请见谅!

翻译后发现貌似已经有人翻译过,但是翻译的水平就有点。。。。。那篇文章中不仅忽略了知识点,并且出现了明显的语义和语法错误,有一定的误导作用,所以请务必重新阅读老高的翻译。文章中容易出错的地方老高已经注释(在文章中以【】标出)。

如需转载,请注明出处!

web开发者在发布你的作品前需要考虑的技术细节 What technical details should a programmer of a web application consider before making the site public!

原文地址: 来自stackexchange.com quora的回答

界面和用户体验

  • 要意识到浏览器的实现标准不一,请确保你的网站在主流浏览器中的正常展现。至少要针对一个最新的Gecko引擎(火狐)的浏览器、一个基于Webkit引擎(Safari或者其他移动端)的浏览器、Chrome、你想要支持的IE浏览器(可以借助IE应用程序兼容性VPC镜像)和Opera浏览器。同时需要考虑到在不同的操作系统下浏览器是如何渲染你的网站
  • 需要考虑来自其他浏览器的用户如何使用你的网站:智能手机、屏幕朗读器和搜索引擎,举个例子。--一些易用性信息:网页易读性倡议(WAI)和网站508规范(Section508),移动站开发:移动互联网开发者论坛(MobiForge)。
  • 构架:如果在不影响用户的情况下部署升级。有一个或者多个用来更改架构、代码或者内容更新的可用测试或运行环境,确保他们部署的可控性,以防止造成破坏。有一个自动化部署方案,用来提交更改到生产环境。最优的解决方案是结合使用一个版本控制系统(CVS, Subversion等【译者注:为啥没GIT】)或一个自动构造机制(Ant,NAnt等)。
  • 不要直接给用户展现不友好的错误信息。
  • 不要用纯文本的形式呈现用户的Email,否则他们会被垃圾邮件骚扰。
  • 给用户生成的链接加上rel="nofollow"属性,以避免SEO作弊
  • 为你的站点建立合理的限制机制,这一条同时属于安全细则。
  • 理解什么是渐进增强(progressive enhancement)【译者注:与之相对的是优雅降级(graceful degradation)】。
  • 如果一个请求提交成功,请重定向至其他地方,防止用户的重复提交。
  • 不要忘了考虑无障碍阅读,这对网站的优化来讲是一个好主意,而且有些情况下他是法律强制必须有的。 无障碍网页应用(WAI-ARIA)和Web内容无障碍指南2(WCAG 2)在这方面可以帮到你!
  • 不要让用户思考该如何操作

安全

性能

  • 必要时使用缓存,理解并使用HTTP缓存技术HTML5的Manifest技术
  • 图片优化 - 不要使用一个20KB大小的的图片最为重复背景。
  • 学习如何使用gzip压缩内容
  • 合并/链接多个样式表或多个脚本文件以减少浏览器的请求数,并且使用gzip压缩文件中重复的内容。
  • 看一看雅虎高性能站点,有很多不错的点子,包括提高前端性能和他们的YSlow工具(需求使用Firefox、Safira、Chrome、或Opera浏览器)。同时,Google page speed使用浏览器插件)也是一个不错的性能调校工具,他同时也会优化你的图片。
  • 针对小并且相关的图片使用CSS image sprite技术
  • 访问量大的站点需要考虑将不用内容分至不同的域名下。
  • 静态内容(如图片、css、js脚本还有不需要cookie的普通内容)应该被分配到一个不使用cookie的域名下,因为一个域名下的所有cookie和子域下的cookie将会被包含在所有对应的域名下。一个好的主意是使用CND加速,但是考虑到CND可能会挂,到时候本地的拷贝也会提供服务。
  • 最小化一个浏览器需要渲染一个页面所需要的请求数。
  • 利用工具Google Closure Compiler最小化你的js文件,还有其他的最小化工具
  • 确保有一个favicon.ico在服务器的根目录,就算html里没有提到他,浏览器也会自动请求他。如果你没有一个favicon.ico,那么会导致很多的404错误,并浪费带宽。

SEO

  • 使用搜索引擎友好的URL,如使用www.phpgao.com/technical_details.html,而不用www.phpgao.com/index.php?p=XXX
  • 将你的#变为#!,然后再服务端使用$_REQUEST["escaped_fragment"]接收google机器人发来的请求,换句话说,google会把./#!page=1变为?_escaped_fragments_=page=1。同时,针对使用火狐beta4或者Chrome浏览器的用户,使用history.pushState({"foo":"bar"}, "About", "./?page=1");,是一个不错的选择。这样的话即使浏览器的地址栏有变化,但是页面不会重新加载。这样就允许你使用?代替#以保留动态内容,同时告诉服务器当你通过邮件发送的链接到底是什么页面,同时 ajax不需要额外的请求。【这一段如果看不懂:请参考URL的井号
  • 不要给你的链接添加诸如**点我**的说明。这样做是在浪费SEO优化的机会,同时让读者不容易理解。
  • 需要提供一个XML网站地图,最好使用默认的地址/sitemap.xml
  • 当你有多个URL指向相同的页面,请使用[指出你需要强调的页面,这个问题可以在Google Webmaster Tools被找到。
  • 使用谷歌站长工具Bing站长工具
  • 一开始就是用Google分析(或者一个开源分析工具,例如Piwik)。
  • 了解robots.txt和搜索引擎爬虫的工作机制。
  • 在(www.phpgao.com)或(phpgao.com)之间选择一个,然后使用301重定向将域名重定向到主域名,以防止分权。【博主选用了带www的域名www.phpgao.com,所以访问不带www的域名phpgao.com会被301重定向】
  • 要知道有一些不守规矩的爬虫。
  • 如果你有一些非文本的内容,可以借助Google's sitemap extensions for video 等工具。

技术

  • 理解HTTP,诸如GET,POST,sessions,cookies还有“无状态”的含义。
  • 使用符合W3C规则的XHTML/HTML + CSS页面并确保他们通过验证。此行的目的是避免出现浏览器的怪异模式,同时作为一个奖励,它会更加兼容非传统的浏览器,如屏幕朗读器和手机设备。
  • 理解js在浏览器中如何工作【dom原型】。
  • 理解js、样式表和其他资源如何被载入并解析为一个页面并考虑他们对渲染性能的影响。除非你在分析应用或者使用html5-shims做测试,否则把你的脚本放在html的最后是一个不错的选择。
  • 理解js的沙盒的工作机制,尤其是你在使用iframes的时候。
  • 意识到js是可以被禁用的,而Ajax也仅仅是一个扩展功能,而不是基准功能。尽管大部分用户多ajax置之不顾,但是要记住无脚本已经越来越流行,移动设备也可能不会像你期待的那样运行,并且Google在索引你的站点时几乎不会运行你的JS脚本。
  • 了解301和302重定向的区别(这也是一个SEO论题)
  • 尽可能的掌握你的产品部署平台。
  • 考虑使用样式表重置或者normalize.css.
  • 考虑js框架(jQueryMooToolsPrototypeDojoYUI 3),他们会屏蔽很多不同浏览器使用JS操作DOM的差异。【简化操作,屏蔽差异】
  • 同时考虑到渲染性能和js框架,建议使用诸如Google Libraries API的公共服务库载入框架,好处是浏览器在已经缓存的情况下不需要在从网站下载。【如果每个网站都是用公共库,命中率将大大提高】
  • 不要重复造轮子。再做任何事情之前先google之,看看有没有合适的组建或者已经实现的例子。有99%的几率你需要的功能已经被实现并开源。
  • 另一个方面,在你最终决定需求之前,不要一开始就上很多个库。尤其是针对客户端,最重要的是轻量、快速和灵活。

Bug修复

  • 你必须知道这个事实,纵观整个软件周期,你将花费20%的时间写代码,剩下80%的时间都在维护他,所以好好码吧!
  • 建立一个良好的错误报告解决方案。
  • 有一个客户反馈系统。
  • 将应用的工作原理写成文档,以便作为将来支持和运维的参考。
  • 有计划行的备份你的站点!(同时确保他们是可恢复的备份)Ed Lucas的回答中包含了一些建议。建立一个恢复机制,而不是备份机制。
  • 使用版本控制系统保存你的文件,如SubversionMercurialGit.
  • 不要忘了做验收检测。Selenium可以帮你的忙。
  • 确保你有足够的空间保存log4j, log4netlog4r生产的日志。如果你的生产环境出错,你可以用日志找到问题的根源。
  • 记录日志时请确保你同时记录了可处理和不可处理的错误。汇报/分析日志,他将会告诉你系统哪里出了问题。

本文适合新手老手,有不对的地方欢迎指正! 如果有什么问题或者建议,请务必留言, :-)

老高很高兴与大家交流! 同时欢迎关注我的微博

写在前面:搜索引擎是个很神奇的东西,脾气捉摸不定,动不动就学个新算法让你不得安居乐业。许多新手都会觉得想让搜索引擎收录真难啊! 那么对于刚刚建成的新站和收录有问题的旧站,如何才能让搜索引擎顺利的收录你的网站呢? 花点时间看完本文,我相信你对SEO的理解一定会更加透彻。 预先约定几个说法(不分大小写)

  • wordpress ->wp
  • Search Engine Optimization->SEO
  • Uniform Resource Locator ->URL 下面老高就针对wordpress的SEO优化讲讲具体的步骤:

浅谈URL的优化

说到SEO,最先想到的应该是URL了,什么!你不知道URL是啥? 8-O 简单地说,URL就是

统一资源定位符(Uniform Resource Locator,缩写为URL)是对可以从互联网上得到的资源的位置和访问方法的一种简洁的表示,是互联网上标准资源的地址。互联网上的每个文件都有一个唯一的URL,它包含的信息指出文件的位置以及浏览器应该怎么处理它。https://blog.phpgao.com/ 就是一个URL,访客和搜索引擎就是靠他找到你的资源。URL的优化其实很简单,做到以下几点就OK!

伪静态

美化你的URL显示格式,即做好伪静态,打个例子,本文的URL默认为www.phpgao.com/?p=***|的形式,\*|为文章的数字ID,但是实际上他显示为www.phpgao.com/seo.html,如果这两个URL都指向同一篇文章,哪一个更能勾起你的欲望呢?同样的,搜索引擎也会试着理解你的URL ,然后抓取你的内容,分以适当的权重 ---|- 那么如何设置成这样的形式呢?首先需要了解伪静态、404错误、linux、win主机等概念,后面章节有讲。

网站地图

URL格式确定以后下面就要把你的URL告诉搜索引擎了,所以你需要一个**网站地图**,他可以告诉搜索引擎网站是什么结构,哪些页面比较重要,哪些可以忽略,有利于搜索引擎抓取。

robots.txt

robots的作用是控制爬虫的抓取范围,举个比方,你可以禁止爬虫收录你的wp-admin文件夹下所有文件,这样可以保证安全性。你需要明确的是,爬虫来到你的网站,就像吃货进了一个自助餐馆一样,只要能吃的他都不放过,如果你放任不管,那么可能他会把你和你太太盘子里的饭菜都会吃掉。所以你必须告诉他:“爬虫兄啊,你不能吃这个,这个是桌子!”。简单的介绍一下用法:

  • 请将robots.txt放到网站的根目录下,你可以参考一下www.taobao.com/robots.txt(百度中枪)
  • 编码无所谓,一般不会出现中文
  • 第一行写User-agent: * 意思只针对所有搜索引擎的爬虫
  • 紧接着Disallow: /wp-* 意思是不允许看wp-开头的所有文件
  • 你可以写很多个Disallow规则,记得首字母要大写
  • 你还可以在文件中指明sitemap路径 Sitemap: https://blog.phpgao.com/sitemap
  • robots.txt不要过于复杂 robots文件真的很重要,老高之前写过一个爬网页的程序放到了某个二级目录下,并在首页加了链接,但是忘记了屏蔽搜索引擎,导致谷歌收录了本站的9000多个垃圾内容页 :-( ,悲剧啊!话说百度还是很谨慎的,就是不收录!

提交入口--来我家玩吧!

提供几个提交网站的入口,此步是通知搜索引擎来收录你的网站

  1. 百度网站登录入口
  2. Google网站登录入口
  3. 360网站登录入口
  4. Bing网站登录入口
  5. 搜狗网站收录提交入口 这步最简单了!不要偷懒哦! 8-)

站长工具--查询收录的利器

站长工具就站长管理网站收录,转化率等信息的瑞士军刀

  1. 百度站长工具
  2. 谷歌站长工具
  3. seo工具

老高要在这里赞一下百度的抓取诊断功能,通过使用发现百度没有更新我站的DNS信息,于是换了DNSPOD解析,立马解决问题!

由于网络错误导致抓取失败

网站统计分析

网站统计,顾名思义就是统计网站浏览量,分析受众群体。原理是通过放脚本或者图片链接在你的网站里,每次访问的时候都会将此次请求信息发送给统计服务器,然后就可以在统计后台查看到实时访问信息了。与基于访问日志分析的办法不同,这种统计方法不是很准确,但是对付一般需求足够了!使用此插件必须在wp主题文件footer.php加入系统提供给你的统计代码,老高的经验是把统计代码加入一个

包裹的div中,因为可能一不小心,这条统计代码会带出来一个很丑的图片,影响网站美观!所以最终的代码会是这样的,其中script标签才是真正的统计代码,div的工作是让他不要影响网站的呈现。

主流工具如下:

  • 百度统计
  • 谷歌分析
  • 老高推荐百度统计(基于速度考虑)

直到这一步!你的网站才算是真正投入到了互联网这个茫茫大海之中,你要意识到的是搜索引擎只是索引到了互联网信息的一小部分而已,而这个数字已足够庞大,所以逛光光完成到这一步是不够的,下面就是提高篇!

##优化访问速度

###选择主机系统

这里你有两种选择

  • windows+iis
  • linux+apache

一般来说,linux主机是比win贵的,原因是:

更安全,windows面对黑客只能说雅蠛蝶了 更快,不是网速快,而是同等硬件下linux+apache跑PHP性能更好 更强大,其实最主要还是说伪静态的问题,linux天然支持,IIS就悲剧了,先哭着 :-( ,后面说原因 更稳定,linux一般很少死机的,windows我只能说呵呵了 总之,钱多就上linux;苦逼的话win还是能接受的。

###服务器地址

内地?香港?美国?韩国?到底搬哪儿好呢?

这还用问?当然是离得越近,速度越快了!下面简单说说利弊吧:

内地主机速度一定不会太慢,但是需要网站已备案 香港主机速度不一定,我在XX购买的空间电信打不开,网通倒是挺快。。。很郁闷 美国主机速度可能不如香港,快也快不到哪儿去 韩国速度和以上两地差不多

再此还是要罗嗦几句:

一般购买一年的空间,商家都会承诺一个月内退款的,没有声明的话请勿使用,或者提出试用要求,并且使用超级PING工具测速 一定要看看空间服务商的备案号,很多都是假的

★★网站开始运行后一定要定时备份,不论是空间还是数据库!★★

###GZIP–压缩html

GZIP一看就知道是压缩用的,能开就开吧。一般的panel都是提供这个功能的,如果没有也不影响。

查询是否压缩请使用Gzip检测工具检测,至于压缩率嘛,自己看吧!

是否压缩 是 压缩类型 gzip 原始文件大小 89103 字节 压缩后文件大小 13896 字节

###伪静态

伪静态就是为了让url美观一些,本文的网址为默认为

https://blog.phpgao.com/?p=238

但我修改固定连接格式是之变成了

https://blog.phpgao.com/seo.html

看到这个URL你会不会觉得根目录下就有一个seo.html吧?

其实不然,当你的浏览器访问了此网址https://blog.phpgao.com/seo.html,服务器在解析这个URL时会参考你的伪静态规则,隐性的将url变为https://blog.phpgao.com/index.php/seo.html,然后剩下工作就交给index.php,他会帮你找到对应的文章显示给读者!

####IIS

IIS悲剧的伪静态ISAPI_Rewrite分版本不说,不同版本伪静态的写法还有差别。。。设置参考我的文章

IIS下wordpress伪静态的配置

####APACHE

这里风景一片大好,htaccess教IIS学做人

####404补救

404也可以伪静态,但是设置很麻烦,一般不推荐。 原理就是当访问一个不存在的地址,服务器会找一个叫类似404.php的文件,在这个文件中分析URL并导航至相应页面去。

有兴趣自己实现的请百度之!

###静态内容加速

原理就是CDN服务商将你的网页文件缓存之,然后你的服务器就不用提供诸如jpg,css,js等不常更新的文件,减小了自己服务器的压力,好用的加速主要有七牛。

##网站结构优化

一个网站可能有很多栏目,栏目下会有许多文章,就像大树上结的果子。文章之间可能也会有相互关联,这种关系叫做叫内链。相对的,文章或栏目等指向他人网站的链接就叫外链。 每篇文章有自己的标题、关键字、描述和内容。

以上几个概念就是组成一个网站的基本结构。

###文章的结构

标题、关键字、摘要和内容分别对应英文中的title,keywords,desciption、content。 这些词语在几乎每一个网页中都有体现,搜索引擎就是根据以上几个属性来了解一个网站的所有内容。 其重要性按大小排序:content>title>desciption>keywords 所以在优化策略中,如果你的内容和别人的一样(比如使用火车头采集),那么如果你的标题设置的好,或者描述提取的好,那么你的排名就相对靠前一点。 (未完待续)

参考:

http://www.chinaz.com/web/2011/0727/201918.shtml

http://www.xmlas.com/robots-google-txt.html