SEO建站:网站建设应该了解的SEO基础知识

SEO建站的时候无可避免需要去了解一下SEO优化方面的相关知识,只有这样才可以让前端开发的时候更符合SEO的标准来建设网站,另外网站前端工作人员肯定是要和SEO打交道,会SEO的前端也在岗位上会更加吃香。

SEO建站:网站建设应该了解的SEO基础知识

但是实施上面很多时候,网站前端开发的从事者缺乏对SEO的基本了解,导致整个网站建设,运营的效率偏低。而实际上面SEO对于前端来说是非常有必要的,学习一些通用的SEO技术,不耗时不费力,又可提升工作效率,提升自身能力,是一件非常好的事情。

什么是前端?

前端指的是网站前台部分,运行在PC端,移动端等浏览器上面展现给用户浏览的网页。随着互联网技术的发展,HTML5以及CSS3,前端框架的应用,跨平台响应式网页设计能够适应各种屏幕分辨率,完美的动效设计,给用户带来非常高的用户体验。

什么是SEO?

SEO是按照用户需求,百度算法,去对网站进行一个站内站外优化,使得网站更加符合搜索引擎的抓取,更加可以解决用户问题,更让用户喜欢,从而提升在搜索引擎的搜索结果排名。增加曝光率,从而带来订单,掌握好可以给自己或者公司的网站做优化,从事相关的工作,也可以自己在家里接单,毕竟那么多的网站没有排名,我们出技术,他们出金钱就可以了。

所以做研发的同学,其实很多人并没有深入了解过SEO这个概念。在技术博客里面,提及这一块的也是寥寥无几。今天SEO建站就拿自己的经验,简单给大家做个介绍,有什么遗漏需要补充的地方欢迎大家提醒

其实搜索引擎所做的工作是相当复杂的,再这里简单介绍一下大致的过程。后续针对SEO如何优化,也会按照这几个点展开描述。

页面抓取: 蜘蛛向服务器请求页面,获取页面内容

分析入库:对获取到的内容进行分析,对优质页面进行收录

检索排序:当用户检索关键词时,从收录的页面中按照一定的规则进行排序,并返回给用户结果家补充。

早在ajax还没流行的的时候,其实SEO对于前端的要求并没有很多,或者说,那个时候还没有前端这个职业。页面全部在服务器端由渲染好,不管是用户还是蜘蛛过来,都能很友好的返回html。ajax似乎原本是为了避免有数据交互导致必须重刷页面设计的,但是被大规模滥用,一些开发者不管三七二十一,所有数据都用ajax请求,使得蜘蛛不可以顺利的获取页面内容。而庆幸的是这反倒促进了前端的飞速发展。

而到了后来,各种SPA单页应用框架的出现,使得前端开发不再需要关心页面的DOM结构,只需要专注业务逻辑,数据全部由Javascript发ajax请求获取数据,然后在客户端再进行渲染。这也就导致了老生常谈的SEO问题。百度在国内搜索引擎的占有率最高,但是也非常不幸,它并不支持ajax数据的爬取。

于是,开发者开始想别的解决方案,比如检测到是爬虫过来,单独把它转发到一个专门的路由去渲染,比如基于Node.js的Jade引擎(现在改名叫Pug了),就能很好地解决这个问题。React和Vue,包括一个比较小众的框架Marko也出了对应的服务端渲染解决方案。详细内容查看对应文档,我就不多说了。

关于URL与301

URL设置要合理规范,层次分明。如果网站到了后期发现URL不合理需要重新替换时,会导致之前收录的页面失效,就是我们所说的死链(这种情况属于死链的一种,404等也属于死链)。所以SEO建站建议大家一定要在网站建设初期就做好长远的规划。一旦出现这种情况也不要过于担心,我们可以采取向搜索引擎投诉或者设置301跳转的方式解决。

URL层级嵌套不要太深,建议不超过四层。增加面包屑导航可以使页面层次分明,也有利于为蜘蛛营造顺利的爬取路径。

除此之外,将指向首页的域名全部设置301跳转到同一URL,可以避免分散权重。

分析入库

当蜘蛛把页面抓取回去之后,就需要对页面内容进行分析,并择优收录入库。为什么说是择优呢?下面我给你慢慢分析。

搜索引擎的目的是给用户提供高质量的、精准的搜索结果。如果整个页面充斥着满满的广告和各种不良信息,这无疑会很大程度上影响用户体验。

除此之外,你肯定不希望自己辛辛苦苦创作的文章被别人轻而易举的抄走,所以搜索引擎在一定程度上帮助你避免这种情况的发生。对于已经收录的内容,搜索引擎会降低其权重,甚至直接不收录这个页面。即便是这样,为了保证页面的新鲜度,很多网站都会爬取或者转载其他网站的内容。这就是SEO建站经常听到的伪原创。所以,想要让你的页面能够以较高的权重被收录,就需要坚持更新网站内容,并且是高质量的原创内容。

前端对于网站SEO有多重要,这个根本不用说,只能这样来形容,做网站SEO离不开前端,做前端离不开SEO。为什么这么说?因为他们本身就应该是一体的。总结就是做前端的小伙伴一定要学SEO,做SEO的小伙伴一定要学前端。

avatar

发表评论

:?: :razz: :sad: :evil: :!: :smile: :oops: :grin: :eek: :shock: :???: :cool: :lol: :mad: :twisted: :roll: :wink: :idea: :arrow: :neutral: :cry: :mrgreen: