看了这篇文章妈妈再也不用担心我面试被问到 SEO了

前端基础-HTML SEO篇

SEO 是面试时常常会被问到的问题，看了这篇文章妈妈再也不用担心我面试被问到 SEO 了。

概念

SEO（搜索引擎优化）是一种让网站在搜索引擎结果中更加清晰，也帮助我们将搜索结果更靠前。通俗的讲就是通过了解搜索引擎的运作规则来调整网站，来提高自己网站在有关搜索引擎内排名，这样会为网站提供最好的机会，增加流量（流量 === 钱），这就叫 SEO。

方法

方法其实很简单，那就是 通过了解搜索引擎的运作规则来调整网站。
SEO 方法分为三大类：

1. 技术
使用语义标记内容 HTML 浏览网站时，抓取工具应该只找到您要编入索引的内容。

早期版本的搜索算法有赖于网站员提供信息，如关键字的基本定义标签（meta tag），但是由于某些网站员开始滥用标签，造成该网页排名与链接无关时，搜索引擎开始舍弃标签并发展更复杂的排名算法。

经过多年的搜索引擎算法的调整，现在较重要的影响标签为：
<title> ：
通常，较长的描述性标题要比简短或一般性标题更好。标题的内容是搜索引擎算法用来确定在搜索结果中列出页面顺序的组件之一。同样，标题是初始的“挂钩”，您可以通过它吸引浏览浏览结果页面的读者的注意力。

<meta> ：
<meta>元素 表示那些不能由其它 HTML 元相关（meta-related）元素表示的元数据信息。
<meta>元素 定义的元数据的类型包括以下几种：

• 如果设置了 name 属性，<meta> 元素提供的是文档级别（document-level）的元数据，应用于整个页面。
  • application-name 网页中所运行的应用程序的名称。( 注意：浏览器可能使用此名称来识别应用程序。 简单的网页不应当使用 application-name )
  • author 文档作者的名字。
  • generator 生成此页面的软件的标识符（identifier）。
  • keywords 与页面内容相关的关键词，使用逗号分隔。
  • referrer 控制由当前文档发出的请求的 HTTP Referer 请求头。
  • theme-color 表示当前页面的建议颜色，在自定义当前页面从或页面周围的用户界面的显示时，用户代理应当使用此颜色。content 属性应当包含一个有效的 CSS <color> 值。
• 如果设置了 http-equiv 属性，<meta> 元素则是编译指令，提供的信息与类似命名的 HTTP 头部相同。
  http-equiv属性定义了一个编译指示指令。这个属性叫做 http-equiv(alent) 是因为所有允许的值都是特定 HTTP 头部的名称，如下：
  • content-security-policy 它允许页面作者定义当前页的内容策略 (en-US)。内容策略主要指定允许的服务器源和脚本端点，这有助于防止跨站点脚本攻击。
  • content-type 如果使用这个属性，其值必须是"text/html; charset=utf-8"。注意：该属性只能用于 MIME type 为 text/html 的文档，不能用于 MIME 类型为 XML 的文档。
  • default-style 设置默认 CSS 样式表组的名称。
  • x-ua-compatible 如果指定，则 content 属性必须具有值 “IE=edge”。用户代理必须忽略此指示。
  • refresh 这个属性指定：
    • 如果 content 只包含一个正整数，则为重新载入页面的时间间隔 (秒)；
    • 如果 content 包含一个正整数，并且后面跟着字符串 ‘;url=’ 和一个合法的 URL，则是重定向到指定链接的时间间隔 (秒) 无障碍相关考虑：设置了 refresh 值的页面可能有时间间隔太短的风险。使用诸如屏幕朗读这样的辅助技术来浏览网页的人可能会由于自动跳转而来不及读完或理解网页的内容。这样不经提示而突然进行的页面刷新也可能会让有视力障碍的人群感到迷惑。
• 如果设置了 charset 属性，<meta> 元素是一个字符集声明，告诉文档使用哪种字符编码。
• 如果设置了 itemprop 属性，<meta> 元素提供用户定义的元数据。

<h1> ：一级标题

<img> 中的 alt 属性：
搜索引擎会爬取图片中的 alt 属性值，所以我们需要为图片设置符合图义的描述信息

前端开发主要就需要将精力集中在这些标签上

2. 撰稿
使用访问者的词汇编写内容。使用文本和图像，以便抓取工具可以理解主题。

3. 声望
当其他已建立的站点链接到您的站点时，您获得最多流量。

维基百科提供了一份Google的专利清单，这是搜索引擎发展它们算法时的一些参考：

• 站点的年龄
• 自该网域注册后过多久
• 内容的年龄
• 新内容增加的规律性
• 链接的年龄，连接站点的名誉和其相关程度
• 一般站内因素
• 负面站内因素 （例如，太多关键字汇标（meta tag），很显然被优化过，会对站点造成伤害）
• 内容的独特性
• 使用于内容的相关术语 （搜索引擎关系到的术语的方式视同如何关系到网页的主要内容）
• Google网页级别 （只被使用在Google 的算法）
• 外在链接、外部链接的链接文字、在那些和在站点/网页包含的那些链接
• 引证和研究来源（表明内容是研究性质）
• 在搜索引擎数据库里枚举的词根与其相关的术语（如 finance/financing）
• 导入的逆向链接，以及该链接的文字
• 一些导入链接的负面计分 （或许那些来自低价值页、被交换的逆向链接等）
• 逆向链接获取速率：太多太快意味着“不自然”的链接购买活动
• 围绕在导出链接、导入的逆向链接周围的文字。例如一个链接如果被 “Sponsored Links” （赞助商链接）包围，该链接可能会被忽略。
• 用 “rel=nofollow” 建议搜索引擎忽略该链接
• 在站点该文件的结构深度
• 从其他资源收集的网格表，譬如监控当搜索结果导引用户到某页后，用户有多频繁按浏览器的返回
• 从来源像：Google AdWords/AdSense、Google 工具条等程序收集的网格表
• 从第三方资料分享协议收集的网格资料 （譬如监测站点流量的统计程序提供商）
• 删除导入链接的速率
• 使用子网域、在子网使用关键字和内容质量等等，以及从这些活动来的负面计分
• 和主文件语义上的链接
• 文件增加或改动的速率
• 主机服务商 IP 和该 IP 旗下其它站点的数量/质量
• 其他链接站会员 （link farm / link affiliation） 与被链接的站 （他们分享IP吗? 有一个共同的邮递地址在"联系我们 （Contact Us）" 页吗?）
• 技术细节像利用301重定向被移除的网页、对不存在网页显示404服务器标头而非200服务器标头、适当的利用 robots.txt
• 主机服务商正常运行时间
• 是否站点对不同类的用户显示不同的内容（称为“掩饰”（cloaking））
• 未及时矫正、无效的导出的链接
• 不安全或非法内容
• HTML代码质量，以及错误出现数
• 由搜索引擎自他们搜索结果观察到的实际点击通过率评等
• 由最常访问搜索结果的人手动评等

道阻且长，行则将至。

至于其他方法嘛，给搜索引擎钱就是最好的优化。。。

参考文档：
MDN Web Docs
维基百科 SEO