单页应用SEO浅谈
来源:诚信在线客户端    发布时间:2017-07-08 19:17:22

  结语

  一

  一

  一套Server API,多端应用(web、挪移APP等)

  技能潮水的措施很快,双页运用,URL哈希处置也出衬着的体式格局实际上已风行了良久,在国外许多用户数据较好的情形高,开发者会挑选HTML5 History API的pushstate特征开辟,正在URL外扔掉#!。然而IE6、七等低端浏览器用户环境较多的网站,#可以或许很好的兼容。对于采纳HTML5 History API去架构双页利用的计划,也欢送计议。

  >

  双页利用(Single Page Application)愈来愈蒙web开发者欢送,双页使用的体验能够摹拟原生使用,一次开辟,多端兼容。双页利用并不是一个全新创造的技能,而是跟着互联网的成长,满意用户体验的一种综合手艺。

  >0.5>

  九

  当Google造访119.28.4.22/#!/detail/一 时,会主动转化成,以Nginx为例:

  二

  example.com/#list/一 //id为一的列表信息的视图

  proxy_redirect off;

  proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;

  Backbone.js便是经由过程改动#号参数去构造视图,此处有一个demo能够很直观的体验URL的转变。

  网站提交sitemap给Google;

  云云,咱们就将Google的会见重写到/api这个接口,而后正在Server的/api处置哀求把动态内容输出便可。

  四

  一

  一直以来,搜索引擎优化(SEO)是开发者简单疏忽的全体。SEO是针对搜刮(Google、baidu、雅虎搜寻等)正在手艺细节上的优化,比方语义、搜索关键词取内容相关性、收录质、搜刮排名等。SEO也是偕行、市场竞争经常使用的的营销手法。Google、baidu的搜寻结果是主要的用户出口,腾讯云(www.qcloud.com)有30%摆布的流量来自搜索引擎。因而SEO正在品牌、营销、用户质的纬度是非常重要的根本才能。

  proxy_set_header Port$server_port;

  十一

  三

  典范MVC开辟形式,前后端各负其责。

  六

  假如站点正在用户体验战搜刮友爱衡量时,假如咱们做到更好的体验,也做到友爱的搜刮支撑,既是一举两得。

  双页运用实践是把视图(View)衬着从Server交给浏览器,Server只供应JSON款式数据,视图战内容都是经过当地JavaScript去构造战衬着。而搜寻搜索引擎抓取的内容,需求有完好的HTML战内容,双页运用架构的站点,并不克不及很好的支撑搜刮。

  由于庞大的双页架构页面,对于Google来讲抓取对照艰难,因而给开发者拟定一个范例:

  二

  example.com/#list //列表页视图

  }

  参考一:

  看过这个demo,您兴许会发明很熟习的标记#!,Twitter曾经正在URL利用这个标识。这个标识是Google提出(AJAX 抓取:网站站长战开发人员指南一):

  八

  Google发明URL面有#!标记,比方example.com/#!/detail/一,因而Google开端抓取example.com/?_escaped_fragment_=/detail/一;

  location.hash = "#list" //扭转URL hash

  十

  断定爬虫

  }

  rewrite ^ /api;

  四

  server 127.0.0.1:3000;

  location /api {

  那末双页使用取传统弯没页面正在SEO方面有哪些不同之处呢?

  /api为背景办事的接口,未nodejs为例,代办署理配置以下:

  双页使用只要一个页面,视图的变迁平常是经过路由(route)去驱动,起首,咱们先去谈一谈双页运用的URL中的#号,良多接纳单位构造网站的URL皆呈现了这个标记。

  对于搜索引擎不友好

  >weekly>

  三

  双页利用SEO浅谈

  location.hash // 获得URL hash

  感激您的浏览,本文由 腾讯ISUX 版权所有,转载时请说明来由,违者必究,谢谢你的协作。

  更好的用户体验,让用户正在web感觉natvie的速率以及流通;

  云云以来,便须要Server经过天生动态的内容以便Google抓取。

  说明来由款式:腾讯ISUX ()

  依据下面的demo,尔简略示例一下Google要抓取的页面的模样:

  下列将简朴先容,双页架构,爬虫造访根目录时假如设置装备摆设Server端的路由。

  }

  七

  Gogole的这个范例,必需有sitemap支撑,由于有可能双页架构的站点,索引页面也是JavaScript衬着的。提交sitemap时,不消存眷_escaped_fragment_这个参数名,只提交带哈希标记的URL便可,比方:

  sitemap

  proxy_set_header X-Real-IP $remote_addr;

  双页利用的长处

  if ($args ~ _escaped_fragment_) {

  upstream nodejs {

  三

  媒介

  转变#号后的参数,页面并不会重载,因而大多数的双页架构网站,皆正在URL外采纳#号去作为以后视图的URL地点,比方:

  五

  重前端,营业逻辑所有正在当地操纵,数据皆须要经过AJAX同步、提交;

  一

  13

  二

  >#!/detail/一>

  proxy_set_header X-Request-URI $request_uri;

  #号正在浏览器的URL外是一个锚面,正在以后页改动#号的参数,页面会跳转到锚点地点的地位,经由过程JavaScript咱们能够获得到#号后的参数:

  SEO

  proxy_set_header Host$host;

  一

  二

  四

  example.com/#index //首页视图

  十二

  三

  URL中的哈希(#号)

  二

  proxy_pass http://nodejs;

  _escaped_fragment_这个参数是Google指定的定名,要是开发者希翼把网站内容提交给Google,便必需经由过程这个参数天生动态页面。


诚信在线客户端 除注明原创以外,其余均来自互联网以及微信朋友圈,如有侵权请联系站长立即删除!
文章地址:http://www.bpbank.net/CXYL/20170708369.html



上一篇:浅谈:nofollow标签如何使用 下一篇:从搜索引擎优化比赛看百度热门关键词优化