前段时间和大学同学聊天，讲到网站的 SEO 问题，想想毕业之后始终做的 toB 的零碎，曾经很久没有关怀过 SEO 这些问题了。作为一个前端开发，在平时的开发中，也不会想着从代码层面下来做搜索引擎的优化。大略除了开发公司官网或者是产品经理的需要，在开发的过程中也不太会去关怀 SEO。因为 SEO 是经营最关怀的问题，而不是程序员。因为本人平时对 SEO 也不是很关怀，在查找了一些内容之后做了简略的梳理。
一、搜索引擎工作原理
SEO（Search Engine Optimization），搜索引擎优化。百度百科对其的解释是一种形式：利用搜索引擎的规定进步网站在无关搜索引擎内的天然排名。目标是让其在行业内占据领先地位，取得品牌收益。很大水平上是网站经营者的一种商业行为，将本人或本人公司的排名前移。
搜索引擎是怎么工作的呢？次要分为以下三个步骤：
1、匍匐抓取，网络爬虫通过特定规定跟踪网页的链接，从一个链接爬到另一个链接，把匍匐的数据存入本地数据库
2、应用索引器对数据库中重要信息进行解决，如题目、关键字、摘要，或者进行全文索引，在索引数据库中，网页文字内容，关键词呈现的地位、字体、色彩、加粗、斜体等相干信息都有相应记录。
3、索引器将用户提交的搜索词与数据中的信息进行匹配，从索引数据库中找出所有蕴含搜索词的网页，并且依据排名算法计算出哪些网页应该排在后面，而后依照肯定格局返回给用户
从图中，能够看到，爬虫的爬取首先选取一部分精心筛选的种子 URL，将这些 URL 放入待抓取 URL 队列，从待抓取 URL 队列中取出待抓取在 URL，解析 DNS，并且失去主机的 ip，并将 URL 对应的网页下载下来，存储进已下载网页库中。此外，将这些 URL 放进已抓取 URL 队列。剖析已抓取 URL 队列中的 URL，剖析其中的其余 URL，并且将 URL 放入待抓取 URL 队列，从而进入下一个循环。这就须要让咱们思考，怎样才能让爬虫更多的爬取到咱们的网站。
将检索的后果返回给用户，这就有一个先后顺序，搜索引擎的排序次要由以下方面独特确定。
这里提供一个罕用的 SEO 综合查问的地址，感兴趣的能够去理解下 http://seo.chinaz.com/
二、HTML 标签语义化与 SEO 的分割
HTML 语义化，简略说来就是让机器能够读懂网页的内容，从搜索引擎的工作原理中，曾经能够看出，标签语义化对爬虫的爬取以及索引器解决起着很大的作用。不论是在爬虫爬取时，或者是在索引器对网页进行剖析解决时，让机器更加精确的将网页的内容分析并存储下来，这就需要咱们用正当 HTML 标记以及其特有的属性去格式化文档内容。
三、在 SEO 中常见的语义化标签
- H 标签的应用
是最高的等级，所以你须要精确确定每个页面最重要的内容是什么，要优化的关键词在哪里。以咱们最常见的博客为例，博客首页列举最多的通常就是最新博文，而最重要的应该就是博客的名称了，而前面最新文章的链接题目则能够应用或者，个别都应用，示意次级题目。
-
strong 标签的应用
-
title 网站 SEO 题目
-
meta name=”description” content=” 网站形容 ”
-
meta name=”keywords” content=” 网站关键词 ”
-
a href=” 链接地址 ” title=” 链接阐明 ”
-
img src=” 图片链接地址 ” alt=” 图片说明 ”
-
div id=”copyright” 版权局部加上网站名称和链接
，个别都应用，示意次级题目。
-
strong 标签的应用
-
title 网站 SEO 题目
-
meta name=”description” content=” 网站形容 ”
-
meta name=”keywords” content=” 网站关键词 ”
-
a href=” 链接地址 ” title=” 链接阐明 ”
-
img src=” 图片链接地址 ” alt=” 图片说明 ”
-
div id=”copyright” 版权局部加上网站名称和链接
-
strong 标签的应用
-
title 网站 SEO 题目
-
meta name=”description” content=” 网站形容 ”
-
meta name=”keywords” content=” 网站关键词 ”
-
a href=” 链接地址 ” title=” 链接阐明 ”
-
img src=” 图片链接地址 ” alt=” 图片说明 ”
-
div id=”copyright” 版权局部加上网站名称和链接
另外，HTML5 专门增加页眉、页脚、导航、文章内容等跟构造相干的构造元素标签，也阐明了语义化的 HTML 构造是 html 的发展趋势。
- nav
能够帮忙 UA 迅速取得导航内容，例如读屏器能够省去很多渲染间接跳到导航地位。
- aside
能够示意与四周内容关系不太亲密的内容 (广告)，通常体现为侧边栏内容 (相干背景内容)、引述内容
- header
通常是一组介绍性形容 (搜寻框 / logo / …)，网络爬虫晓得诸如与之类的局部后能够非常简单的跳过它们，更好的定位网页内容
- article
独立的文档、页面、利用、站点，能够独自公布、重用；能够是一篇帖子、一篇文章、一则用户评论、一个可交互的 widget
- section
按主题将内容分组，通常会有题目 (heading)
并非「语义化的 div」
何时应用？
一个简略的评判规范：当你心愿这个元素的内容体现在文档的提纲 (outline) 中时，用 section 是适合的。
四、总结
在咱们平时开发的过程中，应用最多的标签就是 div，任何一个 UI 都能够通过 div 加上 CSS 款式去实现，语义化的标签应用的反而不多。
那么应用语义化标签是否真的有必要，集体认为，如果是作为官网须要可能被浏览器检索到的，语义化标签有肯定的必要性，做过 SEO 的都晓得，在不付费的前提下，想要把通过关键字搜寻把自家的网站放到浏览器的第一页搜寻，是何等的艰巨，所以，在代码层面能优化就优化，能做一点是一点。标签语义化的次要目标就是搜索引擎敌对，更容易让屏幕阅读器读出网页内容，其次去掉或失落款式的时候能让页面呈现出清晰的构造。然而如果只在内网应用的网站，或者是 toB 类的网站，这个必要性就不是很大了。
图片起源：http://www.lyouxi.com/ 游戏盒子