seo教程：搜索引擎优化入门与进阶(前端HTML代码与SEO有什么关联吗？(图))

　　seo教程：搜索引擎优化入门与进阶(前端HTML代码与SEO有什么关联吗？(图))

　　前端HTML代码和SEO有关系吗？

　　很多人都纠结于前端HTML代码和SEO的关系。首先，它必须是相关的。其次，前端会严重影响关键词的排名，这是做SEO时必须考虑的一点。根据百度官方的说法，相关性是排名的一个重要维度。前端布局或页面模型是相关性的重要组成部分。也就是说前端包括关键词布局、内部链接调用机制、页面模型。一个点影响相关性，相关性影响排名，排名是SEO的基本目标。

　　1、前端的页面模型与SEO息息相关。

　　在教授SEO的过程中，我经常会向参加SEO培训的同学灌输页面模型的概念。一个优质的页面模型有很多对搜索引擎友好的元素，比如关键词出现的位置、关键词出现的频率、当前页面的内链构建机制等等。一般来说，当前页面的核心点通过不同的版块进行讲解，维度不同，主题一致，丰富度好。这些点是SEO的核心。

　　2、标题和描述前端优化点多次强调。

　　标题：只强调重点。重要的 关键词 不应该出现超过两次，并且应该在最前面。每页的标题应该不同；

　　描述：这里总结一下网页的内容，长度要合理，关键词不要堆积太多。每个页面的描述应该不同。

　　3、符合W3C的前端HTML代码编写规范是SEO的基本功。

　　对于搜索引擎来说，最直接的面孔就是网页的HTML代码。如果代码以语义的方式编写，搜索引擎将很容易理解网页的含义。比如文本模块标题要大，合理使用h1-h6，列表形式的代码使用ul或ol，重要文本使用strong等等。总之，要充分利用各种HTML标签来完成自己的工作，当然要兼容IE、Firefox、Chrome等主流浏览器。

　　4、重要的 关键词 放在 HTML 代码中。

　　搜索引擎从上到下抓取 HTML 内容。使用此功能，可以先读取主要代码，将广告等不重要的代码放置在底部。例如，如果左列和右列的代码保持不变，只需更改样式并使用 float:left; 和浮动：对；随意交换显示屏上两列的位置，让重要的Code在前，让爬虫先爬。这同样适用于多列的情况。

　　5、前端权重标签会影响 SEO 结果。

　　搜索引擎不会像普通人那样看网页。他们查看源代码。只要源代码中的信息可以被搜索引擎查看。所谓权重标签，如H1标签、强标签等，起到强调作用；图像标签 alt 起解释作用。前端的这些标签会影响 SEO 结果，但不是绝对的。

　　6、SEO禁忌使用js输出重要内容。

　　蜘蛛不会读取 JS 中的内容，所以重要的内容必须放在 HTML 中；

　　谨慎使用 iframe。搜索引擎不会抓取iframe中的内容，重要的内容也不应该放在frame中。

　　7、保留文字效果。

　　如果我们需要考虑到用户体验和SEO效果，在哪里一定要用到图片，比如个性化字体的标题，我们可以通过样式控制来防止文字出现在浏览器上，但是标题在网页中页码。

　　比如这里的“电视剧分类”中，为了完美还原设计图，前端工程师可以把文字做成背景图，然后用样式设置html中文字的缩进到足够大的负数以偏离浏览器。您可以通过设置行高来隐藏文本。注：显示方式：无；不能用于隐藏文本，因为搜索引擎会过滤掉display:none;中的内容，所以不会被蜘蛛检索到。

　　8、前端使用CSS截取字符，最大化SEO效果。

　　如果文字过长，可以使用样式截取，设置高度，隐藏多余部分。这样做的好处是可以让文本完整呈现给搜索引擎，同时保证性能上的美观。

　　9、压缩和格式化代码。

　　上线前可以使用一些工具对HTML、CSS、JS进行压缩和格式化，可以减小页面大小；不要使用 CSS 表达式，会影响效率；使用CDN网络加速用户访问；开启GZIP压缩，浏览速度变快，搜索引擎蜘蛛爬取的信息量也会增加。

　　10、对于SEO的伪静态设置的作用。

　　如果是动态网页，可以开启伪静态功能，让蜘蛛“误认为”是静态网页，因为静态网页更适合蜘蛛的胃口，如果url 收录 关键词。

　　详情：网页链接