SEOSEOSEO

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)单页应用SEO浅谈

单页应用SEO浅谈

前言

单页应用(Single Page Application)越来越受web开发者欢迎,单页应用的体验可以模拟原生应用,一次开发,多端兼容。单页应用并不是一个全新发明的技术,而是随着互联网的发展,满足用户体验的一种综合技术。

SEO

一直以来,搜索引擎优化(SEO)是开发者容易忽略的部分。SEO是针对搜索(Google、百度、雅虎搜索等)在技术细节上的优化,例如语义、搜索关键词与内容相关性、收录量、搜索排名等。SEO也是同行、市场竞争常用的的营销手段。Google、百度的搜索结果是重要的用户入口,腾讯云(www.qcloud.com)有30%左右的流量来自搜索引擎。因此SEO在品牌、营销、用户量的纬度是非常重要的基础能力。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

我们做Shopify可能都想到通过关键词获取谷歌自然流量,通过自己的经验或者通过一些工具比如谷歌关键词规划师来精心挑选一些关键词,放置在网站的最佳位置。

那么单页应用与传统直出页面在SEO方面有哪些不同之处呢?

然后静静地等待这些关键词从谷歌带来的免费流量。

但是恰恰相反,谷歌的自然流量几乎没有进入你的网站,事实上,谷歌并没有注意到你的努力。

单页应用的优点

更好的用户体验,让用户在web感受natvie的速度和流畅;经典MVC开发模式,前后端各负其责。一套Server API,多端使用(web、移动APP等)重前端,业务逻辑全部在本地操作,数据都需要通过AJAX同步、提交;

对搜索引擎不友好

究竟是问题发生在哪里?对Shopify建站的朋友们,提高谷歌排名,让更多人通过免费流量进入你的网站是一个很难的事情吗?

其实,它真的不难。接下来我写的知识,教大家来学习如何尽可能的获取这些免费流量。要知道广告花费是很贵的,能够获取一些免费流量,从而获取更多订单,是降低营销预算的必走之路。

通过将实际的SEO策略加入到营销计划里面,那么在几个月的时间里,网站就会得到更好的谷歌排名了。

单页应用实际是把视图(View)渲染从Server交给浏览器,Server只提供JSON格式数据,视图和内容都是通过本地JavaScript来组织和渲染。而搜索搜索引擎抓取的内容,需要有完整的HTML和内容,单页应用架构的站点,并不能很好的支持搜索。

在本文分布指南中,你讲学习到以下几点以实现SEO流量变现:

·Shopify基础优化

如果站点在用户体验和搜索友好权衡时,如果我们做到更好的体验,也做到友好的搜索支持,既是一箭双雕。

URL中的哈希(#号)

单页应用只有一个页面,视图的变化通常是通过路由(route)来驱动,首先,我们先来谈一谈单页应用的URL中的#号,很多采用单元结构王皓咱的URL都出现了这个符号。

·提高网站点击率

·改善网站用户体验

·获得更多长尾流量

#号在浏览器的URL中是一个锚点,在当前页改变#号的参数,页面会跳转到锚点所在的位置,通过JavaScript我们可以获取到#号后的参数:

1 2

location.hash // 获取URL hash location.hash = "#list" //改变URL hash

改变#号后的参数,页面并不会重载,于是大多数的单页架构网站,都在URL中采用#号来作为当前视图的URL地址,例如:

如何为Shopify选择域名、URL

1 2 3

example.com/#index //首页视图 example.com/#list //列表页视图 example.com/#list/1 //id为1的列表信息的视图

Backbone.js就是通过改变#号参数来组织视图,这里有一个demo可以很直观的体验URL的变化。

如果你已经买下选好的域名,请不要有压力,因为这不是网站优化的全部。

看过这个demo,你获取会发现很熟悉的符号#!,Twitter曾在URL使用这个标识。这个标识是Google提出。(AJAX 抓取:网站站长和开发人员指南1:

但是一个好的域名会给你的网站提供了一个好的开始。

因为复杂的单页架构页面,对Google来说抓取比较困难,于是给开发者制定一个规范:

为什么?

你的域名是吸引潜在客户的第一步。

在任何时候用户访问你的网站从一开始到退出网站,他们都会看到你的域名。搜索引擎也是如此,好的域名内容可以向谷歌传达了你的店铺卖的产品和目标人群。

将好的关键词直接放到域名里面,这样从用户和搜索引擎角度就同时明白了网站的主营业务。

网站提交sitemap给Google;Google发现URL里有#!符号,例如example.com/#!/detail/1,于是Google开始抓取example.com/?_escaped_fragment_=/detail/1;

_escaped_fragment_这个参数是Google指定的命名,如果开发者希望把网站内容提交给Google,就必须通过这个参数生成静态页面。

起一个好的域名,要遵循以下原则:

·保持简短。单词或者字母越多,记忆就越难。

·个性化。品牌名称应该是域名的一部分。

根据上面的demo,我简单示例一下Google要抓取的页面的样子:

·不要使用符号。避免使用符号,因为看起来很奇怪,严重影响网站的信任度。

·请使用.com的域名。因为这个大众的接受的更高。用户更喜欢.com结尾的域名。

http://119.28.4.22/?escapedfragment_=/detail/1

如此以来,就需要Server通过生成静态的内容以便Google抓取。

以下将简单介绍,单页架构,爬虫访问根目录时如果配置Server端的路由。

判断爬虫

当Google访问119.28.4.22/#!/detail/1时,会自动转化成http://119.28.4.22/?_escaped_fragment_=/detail/1,以Nginx为例:

注册Google Search Console和Bing网站管理工具

1 2 3

if ($args ~ _escaped_fragment_) { rewrite ^ /api; }

/api为后台服务的接口,已nodejs为例,代理设置如下:

注册 Google Search Console和Bing网站管理工具是所有做SEO的网站所有者应该做的事情。

通过使用这两项重要的工具,你将告诉搜索引擎你的网站,并且确保它被抓取。

1 2 3 4 5 6 7 8 9 10 11 12 13

upstream nodejs { server 127.0.0.1:3000; } location /api { proxy_set_header X-Request-URI $request_uri; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; proxy_set_header Host $host; proxy_set_header Port $server_port; proxy_pass http://nodejs; proxy_redirect off; }

如此,我们便将Google的访问重写到/api这个接口,然后在Server的/api处理请求把静态内容输出即可。

sitemap

注册后,将Shopify的站点地图提交到这两个工具上。你需要提供XML文件到这两个网站上,如果你是Shopify建站,那么Shopify自动为你生成了XML文件,你只需要提交类似

Gogole的这个规范,必须有sitemap支持,因为有可能单页架构的站点,索引页面也是JavaScript渲染的。提交sitemap时,不用关注_escaped_fragment_这个参数名,只提交带哈希符号的URL即可,例如:

www.yourdomain.com/sitemap.xml。

1 2 3

http://119.28.4.22/#!/detail/1 weekly 0.5

结语

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

选择SEO友好的Shopify主题

为了吸引用户访问,安装一款引人注意且时尚的Shopify主题看起来非常诱人。

技术潮流的步伐很快,单页应用,URL哈希处理也没渲染的方式实际上已经流行了很久,在国外很多用户数据较好的情况下,开发者会选择HTML5 History API的pushstate特性开发,在URL中抛弃#!。但是IE6、7等低端浏览器用户情况较多的网站,#能够很好的兼容。关于采用HTML5 History API来架构单页应用的方案,也欢迎讨论。

文章来源:腾讯isux

但是更重要的事情是,虽然主题看起来漂亮,但是如果设计上加载很慢,那么很可能会降低网站的加载速度,从而影响用户体验。

有研究表明,每增加1秒加载时间,就会降低7%的转化率。

不仅如此,搜索引擎更喜欢加载速度快的网站,并且比加载速度慢的网站排名更前。

这就是为什么要确保网站的加载速度比选一个漂亮的模版更重要。这是许多使用Shopify的商家最容易忽略的问题。

检查加载速度使用PageSpeed Insights等在线工具就可以了。这个是谷歌官方提供的测速工具。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

通过PageSpeed Insights你可以了解谷歌如何根据速度去给你的网站评分,你还会看到Google提出的优化建议。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

对于Shopify建站,理想的情况就是找一个兼具速度和质量的Shopify主题,这个至关重要。一个好的主题,提供好的加载速度,从而提升用户体验,最终获得更多的订单。

Shopify各个页面的SEO

选好域名,选好模版,接下来就是要看是里面的内容优化了。

Shopify其实对SEO的功能非常友好,不需要更改代码,不需要修改整个网站,任何一个使用Shopify的商家都可以使用Shopify提供的SEO功能优化网站。

要使用好Shopify的SEO功能,一开始必须要进行关键词的研究。

很多商家都很排斥这一个内容,担心会不会很麻烦。

关键词的研究在SEO领域其实是一个很复杂的内容,但是可以通过一些在线的关键词工具可以轻松获得好的关键词。

接下来我会告诉你如何通过一些免费的工具研究关键词。

moz.com这家在线的SEO工具可以提供给我们免费SEO分析。但是一个账号只能查询10次,可以多注册几个账号即可。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

比如我正在为瑜伽裤制定关键词计划,那么我先搜索瑜伽裤关键词。我最关注的细节是 关键词的难度 和关键词的搜索量。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

关键词是指该搜索词目前的竞争程度。得分越低,竞争越小。商家最好要选竞争小的词。

另外除了竞争小,关键词的搜索量可能告诉的你现在有多少人正在搜索你的产品,所以尽可能选搜索量大的。

在免费的功能里面,moz除了为你提供目标关键词的数据之外,还会给出一些长尾关键词,这些关键词基本上是用户搜索的短语,而不是单个字词。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

在这里可以挖掘到潜在的长尾关键词,而且可以获取一些利基市场长尾关键词。

通过长尾关键词尽可能测试摸清楚用户的每个搜索意图,从而部署你的关键词。

另外还有一些其他的关键词研究工具我这里简单列举下:

Google Trends 主要是里面的关键词板块 提供了当下热门关键词和关键词热度(免费)

Keyword Tool Dominator 从亚马逊 etsy ebay 采集关键词(含免费版本)

AnswerThePublic 专门提供一些在语音搜索和功能性问答出现的常见问题(含免费版本)

Google Ads Keyword Planner 谷歌广告的关键词规划师功能提供目前人群的关键词建议(免费)

Google Search Console 谷歌站长工具提供访问网站时用户是搜索什么关键词来的(免费)

Rank Tracker 发现最佳的长尾关键词同时分析关键词的竞争难度等数据(含免费版本)

Google Correlate 提供一些与目标关键词相关但是难以被发现的关键词(免费)

接下来有了关键词就可以开始用户Shopify里面的标题和描述。

标题和描述优化

通过在标题和描述里添加关键词,可以尽可能的让客户搜到你的网站。那么在Shopify里面,在哪里编写你的标题和描述呢?

编辑Shopify的主页标题

进入后台点击online store---》Preferences就可以看到。

编辑Shopify产品类目页和详情页的标题和描述

只需要在具体的collection和详情页编辑页面最下面就可以看到SEO的编写框了。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

当自己创建标题的时候,一定要参考搜索引擎结果页面(SERP)前十页的网站标题结构,尽量与他们的标题结构保持一致,从而获取较好网站排名。

特别注意的是:标题的字数不要超过70个字符,除了字母以外空格和符号也算一个字符。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

通过上图,你会发现这些标题始终包含目标关键词,还有一些高频词如:Women等。

基本上,这种方式可能帮助你提高网站关键词排名。但这不一定能够保证用户点击你的网站。SERP上有个很重要的数据就是点击率,一个好的标题可以提高用户的点击率。

一些媒体机构研究表明,并对自己的内容进行了测试,确定了哪里标题的结构可以提高点击率。它们包含在标题中,元素越多,点击率就越高。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

这四个元素可以这样解释:

·低价:产品如果很便宜,那么一定要考虑加入这类关键词。比如:“便宜”、“低于50美金”、“负担得起”。

·新鲜度:如果某些东西时效性很强,那么请加上这类词比如:“圣诞节”、“假期”、”2019“。

·数量:如果你正在宣传的产品有很多,那么最好要加入数字,比如:”10个最佳的瑜伽裤“、”101个瑜伽裤“。

·速度:如果产品确实有加快促销的内容那么标题里面一定要加入类似关键词,如:”限今天“、”30分钟内结账“等。

另外提高点击率的另一个重要因素是:描述标签。

描述标签是标题下方的文本,这是用户直接看到网站介绍。

这里包含有关你产品描述行的内容,和明确的号召行用语(CTA),他可以明确的引导用户点击你的网站。

在描述里使用“发现”,“购物”和“购买”等字样作为客户搜索的点击号召性用语。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

比如上图,搜索瑜伽裤的SERP,我们就会找到我刚才说到的内容:

· Shop for…

· Discover...

你还会看到很多价格、和款式作为描述的内容来引起更多兴趣,所以在创建标题和描述的时候,请按照上面的方法创作内容。

研究了标题和描述如何写之后,接下来就是如何优化网站内容了。

优化产品描述

一个好的网站内容可以提升用户体验,和谷歌排名,更重要的是带来更多订单。

知道你的目标受众是谁

编写产品描述的时候,要先知道目标受众是谁。

你希望通过你编写的内容目标受众会产生兴趣,那么首先要了解你的受众在平日生活中的角色是什么,了解角色的特征,那么这些特征将会帮助你了解你的产品功能对目标受众最有价值。

在编写产品描述的时候要问自己以下几个问题:

·这个人是怎么到达你的页面的?

·他的兴趣是什么?

·为什么这个人对你的Shopify商店感兴趣?

·这个人怎么会把这个产品描述给朋友?

·这个人最感兴趣的功能或者产品便利是什么?

牢记这些问题,你将能够更好的编写产品描述。

例如,看看The Salt Lady这个产品。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

买家不仅仅是简单的一个购买灯泡的人。

相反,买家可能是一个家庭主妇,那么买家可能对关于家庭的全天然疗法感兴趣,而且非常在意过敏问题。在这种情况下,你的描述里面就有可能吸引这些潜在买家的兴趣来了解你的产品。

另外对于The Salt Lady来说,产品描述不是专注于描写灯具的装饰,而是要专注于产品最能吸引买家的点。

关注产品优势

作为商家,你很高兴能够分享你的产品的所有卖点,而且你想说明你的产品具有最佳的功能和最独特的规格。

但是,买家并不一定对产品一般性参数感兴趣。他们其实想知道产品如何使他们受益。

产品的功能只是关于产品技术信息的一个事实陈述。而描述产品优势可以直接说明产品如何改善买家的生活。

如果我们仔细查看上面非常独特的产品描述,我们可以看到产品的主要特征和优点。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

在本产品描述里,产品的功能包括来自喜马拉雅100%纯的盐、重量为4-6磅、以及开关线和灯泡组。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

产品的优势包括减少EMF污染、净化空气、减少过敏、哮喘和头疼症状。

另一个产品描述的例子是关于蜡烛的产品。

是什么可能让这只蜡烛如此特别?答案在于它能够直接给买家带来好处。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

在做产品描述的时候要清楚的概述这种小蜡烛的好处,描述的大部分篇幅应该以便利性为中心。描述强调的是拥有这种蜡烛的好处,而不是介绍蜡烛的香味和蜡烛的功能。

比如这个例子,客户可以从这支蜡烛获得主要的好处是:

1.你可以在不用投资很大、买更昂贵的蜡烛情况下获得这种香味。

2.提升晚宴效果,它会是一个很好的补充。

3.它安全易于使用,你可以点燃蜡烛后走开。

产品描述的内容可以通过具体的方式衡量产品价值,如何改善他们的生活,来直接说服潜在购买者。

编写描述之前,请概述产品的功能和优点。想想产品如何解决痛点问题,或者增加快感。

对于你列出的每个功能,请弄清楚这些功能如何使买家直接受益。

如果该功能是100%喜马拉雅盐,那么好处是减少过敏。

如果规格是1.75盎司的蜡烛,那么其好处是它可以用于小空间,例如床头柜、浴室或茶几。

将功能转化为这些便利将有助于你更快的编写具有说服力的产品描述。

讲一个好故事

一个好的产品描述应该除了以上内容外,还需要营造一个情感冲击。

情绪会影响买家的行为,因此你的产品描述是引发情绪最好的地方。

如何做?

给买家一个联想的空间。

比如一个卖天然紫水晶戒指的产品描述中:

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

产品除了描述产品功能外,他还讲了一个关于其中一个关键功能的故事。

通过描述传统紫水晶能够给精神带来益处,还有紫水晶的使用方式,来让客户想象到他在生活中使用这个戒指的情形。

另外一个例子买茶叶的例子。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

在产品描述里,我们了解到这种茶的历史意义和茶的诸多益处。

通过描述茶传统用途的故事,客户就会自然而然地联想到一个百年精心培育的茶,在中国农村人民之间分享的情节。

通过描述有关产品的迷你故事,就有可能在感情层面上与潜在买家联系。

描述故事的时候,带着这几个问题去写:

谁最初制作这个产品?

是什么激励他们制作这款产品?

制作这个产品的过程是什么?

这款产品在买家的日常生活中会如何看待?

添加最常使用的关键词

关键词通常是买家用来查找他们想买的产品所使用的关键词。

通过一些关键词的相关关联关键词,可以尽可能的让消费者找到你的产品。

比如“黑色礼服裤 女装”是一个你主打的关键词。通过LSIGraph查找关联关键词,此工具会抓取互联网上相关排名最高的关键词,然后列出这些页面最常出现的关键词。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

通过此关键词词表,我们可以看到“便宜”这个词是一个热门的搜索词,然后我们就可以把使用在我们的产品标题和描述里了。

利用Shopify的Blog引流

编写好了所有产品的标题和描述,那么还能在哪里地方做好内容呢。因为很快就没有地方可以优化内容了。

这就是为什么现在这么多店铺都有博客的原因。博客是不仅仅展示你所有关键词,并让搜索引擎知道你的网站在比如利基市场中的权威。

通过写博客,可以拉拢一些受众的兴趣。

比如通过看一家做瑜伽的网站博客。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

可以知道这家网站是针对冥想、瑜伽装备、所有自然健康的介绍、瑜伽姿势和技术感兴趣的受众。

书写Blog要注意的地方

使用Heading标签做好页面排面

在所有Heading标签里,H1是最重要的(一般是标题,Shopify已经默认为标题)因为搜索引擎使用它判断文章的重点。所以用H标签来将文章区分主次。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

对图像使用Alt文本

让搜索引擎知道文章使用的图片是什么含义,从而提升整篇文章的关键词相关度。

Shopify提供了很方便的功能。下图image alt text 就可以配置。

Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)

另外除了优化好内容,Shopify提供了很多用于SEO的App。

我们不仅仅要做好优化,还要学会如何省时间。我现在就推荐几款App:

P

未经允许不得转载:SEO » Shopify SEO终极指南(巨详细的操作教程,赶快收藏!)单页应用SEO浅谈