1、龙欣 SEO 第 1 页 2019-7-11前端角度说 SEO 的实施搜索引擎优化(SEO)，是指为了增加网页在搜索引擎自然搜索结果中的收录数量以及提升排序位置而做的优化行为。我认为这是一门说来简单，但操作起来复杂的技术，只可意会，不可言传。作为一名前端工程师，不需要精通 SEO，但必须要了解它。SEO 有一条不变的准则就是它永远都在变，因为没有一沉不变的优化方案可供大家套用。但我们仍然可以发现一些基础的或是被人们公认的规律来进行网站的 SEO。更重要的是我们要有自己的实践，不断发现适合自己行之有效的 SEO 方法。从宏观的角度来说，我认为 SEO 有三条最重要的规律，那就是原创的内容、高质量
2、的外部链接和持之以恒适度的优化。前端是构建网站中很重要的一个环节，本篇重点从前端的角度来讲解一下 SEO 的实施方法。前端的工作主要是负责页面的HTML+CSS+JS，优化好这几个方面会为 SEO 工作打好一个坚实的基础。突出重要内容可以让搜索引擎判断当前页面的重点是什么，提升网站访问速度可以让搜索引擎的蜘蛛顺利、快速、大量的抓取网页内容，所以以下我就着重以突出重要内容和提升网站速度为主来总结一下。突出重要内容合理的 title、description 和 keywords虽然现在搜索对这三项的权重慢慢减小，但还是希望能够合理龙欣 SEO 第 2 页 2019-7-11的写好他们，只写有用的东
3、西，不要在这里写小说，要表达重点。title：只强调重点即可，重要关键词出现不要超过 2 次，而且要靠前，每个页面 title 要有所不同。keywords：列举出几个重要关键词即可，也不可过分堆砌。语义化书写 HTML 代码，符合 W3C 标准。对于搜索引擎来说，最直接面对的就是网页 HTML 代码，如果代码写的语义化，搜索引擎就会很容易的读懂该网页要表达的意思。例如文本模块要有大标题，合理利用 h1-h6，列表形式的代码使用 ul或 ol，重要的文字使用 strong 等等。总之就是要充分利用各种HTML 标签完成他们本职的工作，当然要兼容 IE、火狐、Chrome等主流浏览器。我们来看看
4、著名的医药招商网站，在没有样式的情况下，代码非常语义化，看起来很工整，加载不同的样式之后可以随心所欲的改变页面外观。利用布局，把重要内容 HTML 代码放在最前。搜索引擎抓取 HTML 内容是从上到下，利用这一特点，可以让主要代码优先读取，广告等不重要代码放在下边。例如，在左栏和右栏的代码不变的情况下，只需改一下样式，利用 float:left;和float:right;就可以随意让两栏在展现上位置互换，这样就可以保证重要代码在最前，让爬虫最先抓取。同样也适用于多栏的情况。重要内容不要用 JS 输出。蜘蛛不会读取 JS 里的内容，所以重要内容必须放在 HTML 里。龙欣 SEO 第 3 页 2
5、019-7-11尽少使用 iframe 框架。搜索引擎不会抓取到 iframe 里的内容，重要内容不要放在框架中。为图片加上 alt 属性。当网络速度很慢，或者图片地址失效的时候，就可以体现出 alt属性的作用，他可以让用户在图片没有显示的时候知道这个图片的作用。需要强调的地方可以加上 title 属性。保留文字效果。如果需要兼顾用户体验和 SEO 效果，在必须用图片的地方，例如个性字体的标题，我们可以利用样式控制，让文本文字不会出现在浏览器上，但在网页代码中是有该标题的。提升网站速度尽量外链 CSS 和 JS，保证网页代码的整洁，也有利于日后维护。这样的好处是可以把内容、表现和行为分离开，保
6、证代码整洁的同时也方便维护。CSS 放在文件头部，JS 放在文件尾部，可使用工具对 CSS 和JS 文件进行压缩。CSS Sprites。减少 HTTP 请求。利用 CSS Sprites 技术可以把网页用到的切片龙欣 SEO 第 4 页 2019-7-11合成到一张图上，这样做既减少了 HTTP 请求数，又使得样式图片一次加载，避免网页“白”的尴尬。为图片设置高度和宽度，可提高页面的加载速度。为静态资源文件增加过期时间，让用户通过本地缓存来更快的访问网站。减少大改版的频率。压缩、格式化代码。可以在上线前，使用一些工具，把 HTML、CSS 和 JS 都压缩、格式化一下，可以减少页面大小。不使用 CSS 表达式，会影响效率。使用 CDN 网络，可加快用户访问速度。启用 GZIP 压缩，浏览速度变快，搜索引擎的蜘蛛抓取信息量也会增大。善于利用浏览器插件。例如火狐的 YSlow 就很有用，可以查看该页面代码、样式、JS、图片等加载情况，为进一步优化页面起到了指导作用。伪静态设置。如果是*页，可以开启伪静态功能，让蜘蛛“误以为”这是静态网页，因为静态网页比较合蜘蛛的胃口，如果 url 中带有关键词效果更好。本文由 站长提供
