首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

【译】JavaScript对SEO影响

在通过React构建应用中,最常见方式就是客户端渲染。React客户端渲染本质上就是一个HTML根文件通过加载React相关脚本,在运行阶段将页面内容展示出来。...所有路由都由该HTML文件生成,且都发生在客户端已经加载特定路由以及接收到数据之后,这就是为什么被称为客户端渲染原因。在这种情况下,开发人员无法控制SEO标签,因为只有一个HTML根文件。...由此,就出现了一些用来动态设置SEO标签库。 但是,客户端渲染还会带来另外一个问题,搜索引擎爬虫将无法正确爬取这些页面,因为这些页面内容是在运行时生成。...服务端渲染 Angular UniversalAngular应用提供了源生服务端渲染支持,还可以结合ngx-seo-page去动态设置SEO标签。 4....如果做了这些操作,就会提高搜索引擎排名。 总结 综述,我们了解了客户端展示应用程序在被搜索引擎正确索引时会遇到问题,以及开发人员在设置SEO标签时会遇到问题。

2.9K10
您找到你想要的搜索结果了吗?
是的
没有找到

Google Analytics各种ID

这一节来介绍Google Analytics里面的几个ID标识: Client ID 默认情况下,Google Analytics 会为每台设备分配一个唯一 Client ID,并在报告中将每个 Client...更多关于Client ID和User ID可以看:Client ID和User ID之间区别 Google Signal Google Signals,中文名为谷歌标识,利用谷歌内部用户标签实现访客跨设备跟踪...Google Signal是谷歌内部ID体系,只需要开启即可,在原数据视图即可,可以用于跨设备跟踪。...更多关于Google Signal可以看:详解Google Analytics中新跨设备报告功能 Container ID Container ID、容器ID 容器ID是一些代码设置集合,代码加载时候会加载里面的配置...Tracking ID结构是以为UA-开头,如UA-10000-1,UA表示Universal Analytics,10000是账号ID,1表示媒体资源编号。

3.2K30

1.2.1 、Google Analytics布署几种方法

这一节主要介绍如何部署GA跟踪代码和如何对跟踪代码做个性化定制,提高数据准确度以及检验代码是否部署正确。...header里面,主要是为了更快加载到跟踪代码,确保数据准确度,以往加载在footer,存在页面还在加载用户就离开了,跟踪代码没加载情况。...图1-13 跟踪代码获取 注意:Google分析在2017年9月发布了全局版跟踪代码测试版,本书仍是以讲解统一版为主,下面是统一版跟踪代码,只需将其中UA-XXXXX-Y替换成自己跟踪ID即可...图1-17 获取跟踪ID (2)GTM中新建Universal Analytics 在GTM中选择“管理”→“跟踪信息”→“跟踪代码”→“Universal Analytics”,命名为“GA默认跟踪代码...图1-19 完整配置 这里之所以推荐这种方法做默认跟踪代码部署,是因为通过模板来部署,做个性化配置很简单,可以看图1-18所示,里面有“更多设置”和“高级设置”,这些就是做个性化配置、优化、跨站

1.2K10

深入了解Google Analytics 4 中有关会话指标

每位用户感兴趣会话数:感兴趣会话数除以用户数所得结果 感兴趣会话占比:计算方式感兴趣会话数除以会话数 会话数 Google Analytics 4 会话计数方式与之前计算方法略有不同...对比一下Universal AnalyticsGoogle Analytics 4 和Adobe Analytics会话/访问分割规则: 根据Universal AnalyticsGoogle...Analytics 4 会话分割机制,可以预见Google Analytics 4 会话会比Universal Analytics要小,因为如果广告系列来源在会话期间发生变化或某个会话跨越了一天边界...,也就是午夜,Google Analytics 4 不会创建新会话,而 Universal Analytics 会创建新会话。...关于用户数,详细可以看:Google Analytics 4 中识别用户方式:身份空间 感兴趣会话占比 计算方式感兴趣会话数除以会话数

2K20

Google Analytics:GA1到GA4

Google Analytics是谷歌外部收购而来,在2005年时候收购了Urchin,Urchin就是Google Analytics前身,而Urchin前身是Quantified Systems...GA1是Classic Anlaytics,是在2005年时候发布。 GA2是Universal Anlaytics,是在2012年时候发布。...GA4是Google Anlaytics 4,是2020年时候发布,为了替代在2020年9月就停止服务Google Analytics for APPP,也是有些临时顶替节奏,在推出前两个月,更新特别频繁...还有另外一种划分方法,是根据加载js。 GA1js是urchin.js,这是2005年收购Urchin后直接改名为Urchin From Google就发布。...GA2js是ga.js,这是在2007年发布。 GA3js是analytics.js,这是在2012年发布。 GA4是gtag.js,这是在2017年发布。

98120

不同版本Google Analytics做事件跟踪

随着Google Analytics版本更迭,对新手来说可能难以区分,常常布署A版本跟踪代码,事件跟踪却B版本写法,导致事件跟踪设置失败,这一节看看不同版本Google Analytics如何做事件跟踪...,版本包含: Google Analytics Classic经典版 Google Analytics Universal统一版 Global Site Tag 普通全局版 Google Analytics...其中 Google Analytics Classic经典版和Global Site Tag 普通全局版,只能通过硬编码形式布署事件跟踪; Google Analytics Universal统一版可以实现方法最多...,至少有6种; Google Analytics 4,现阶段有三种方法可以实现事件跟踪; 这里看看不同版本事件跟踪写法。...,event后面跟是ACTION,这是因为Global Site Tag报告和Universal是一样,要兼容。

96820

Google Analytics增强版电子商务功能分步指南

我们今天要向大家简单介绍下,如何使用Google Analytics增强版电子商务插件。...如果您选择DIY方式,安装插件可以通过三个步骤完成: 确保您使用Universal Analytics,因为ec.js只能使用该协议。...如果您仍在使用传统版Google Analytics(分析),则需要更新为通用版(您会看到“管理”标签上“媒体资源”列中Universal Analytics(分析)升级”链接)。...插件功能 借助GA增强型电子商务插件,您可以通过将正确命令添加到跟踪代码中来跟踪各种事件和操作。其中细节关键是,要通过正确命令为正确页面找到正确特征。...在“Google Analytics(分析)GA报告”页上“转化>电子商务”下,您会发现两个非常有价值报告,可协助您快速入门和提升业务。

4.3K40

Google Analytics 4 中识别用户方式:身份空间

可以总结为就是,Google Analytics 4 身份空间优先级是:User ID>Google Signal>设备ID。...与Universal Analytics相比 如果有人问你Google Analytics (Universal版本)是通过什么识别用户,你很大概率会说是Client ID。...可以说对,也可以说不对,因为Universal Analytics会通过其他ID去识别用户,如果你有设置User ID,那么它会优先使用User ID去识别用户,它优先级是User ID>Client...后面Universal Analytics也引入Google Signal,在媒体资源“跟踪信息”——“数据收集”里可以设置,开启后,它优先级是User ID>Google Signal>Client...其实,虽然Google Analytics 4 增加身份空间和设备ID概念,但实际上 Google Analytics 4和Universal Analytics识别用户方式和逻辑还是一样

1.3K20

3.1.5 、Google Tag Manager基础知识——GTM中重要概念

要使用模板,请直接选择所需模板并填入必要详细信息,GTM会自动生成正确代码,并使用您指定触发器来触发这些代码。...3、这里要部署统一版跟踪代码,所以选择Universal Analytics,可以看到代码“代码配置”已经跟之前是不同,如图3-12所示,有一些设置需要您填。 ?...(2)Universal Analytics配置详解 可以看到代码使用是很简单,但是看回内置模板部署统一版GA跟踪代码示例中第三步图3-13,可以看到里面有“选择设置变量”、“高级设置”等选项,...图3-15 Universal Analytics配置 这里将Universal Analytics配置分为三个模块,分别是跟踪类型、GA(分析)设置和高级设置。...触发方式可以设置为“触发次数不受限制”、“每个事件触发一次”和“每次网页加载触发一次”; 触发顺序设置在“高级设置”→“代码触发顺序”中,可以控制代码在某些代码触发之前之后才触发,表示这个代码要在另一个代码之前之后触发才有可能触发此代码

3.5K21

Angular SSR 探究

你知道 Angular Universal 吗?可以帮助网站提供更好 SEO 支持哦!一般来说,普通 Angular 应用是在 浏览器 中运行,在 DOM 中对页面进行渲染,并与用户进行交互。...静态 HTML 网站 SEO 表现还是要好于动态网站,这也是 Angular 官网所持有的观点(Angular 可是 Google !)。...此时,网页虽然不能处理浏览器事件,但是支持通过 routerLink 进行跳转。这么做好处是,我们可以先用静态网页抓住用户注意力,在用户浏览网页时候,同时加载整个 Angular 应用。...这给了用户一个非常好极速加载体验。为项目增加 SSRAngular CLI 可以帮助我们非常便捷将一个普通 Angular 项目转变为一个带有 SSR 项目。...Angular Universal 主要关注将 Angular App 如何进行服务端渲染和生成静态 HTML,对于用户交互复杂 SPA 并不推荐使用 SSR。

10.2K51

Angular开发实践(六):服务端渲染

Angular Universal Angular在服务端渲染方面提供一套前后端同构解决方案,它就是 Angular Universal(统一平台),一项在服务端运行 Angular 应用技术。...这些页面不会处理浏览器事件,不过它们可以 routerLink 在这个网站中导航。 在实践中,你可能要使用一个着陆页静态版本来保持用户注意力。...同时,你也会在幕后加载完整 Angular 应用。 用户会认为着陆页几乎是立即出现,而当完整应用加载完之后,又可以获得完全交互体验。..., // 客户端应用 AppModule ServerModule, // 服务端 Angular 模块 ModuleMapLoaderModule, // 用于实现服务端路由惰性加载...AppServerModule 还会告诉 Angular 再把你应用以 Universal 方式运行时,该如何引导它。

4.7K100

2020前端性能优化清单(三)

那么,最好代码分割方式是什么?Phil Walton 表示,“除了对动态导入代码进行分割外,我们还可以包级别对代码进行分割,对于每一个引入 node 模块基于包名单独打包到一个’块‘中。”...rel="modulepreload"> 标签")提供了一种提前加载(且优先级高)模块脚本方法。...Shubham Kanodia 编写了一份详细低维护智能打包指南[56]:你可以正确使用这种方式将老旧代码代码通过代码片段只发送给老版浏览器。 ?...Guess.js[92] 是一组工具和库,它们使用 Google Analytics 数据来确定用户最有可能访问从给定页面中哪个页面。...根据从 Google Analytics 或其他来源收集用户导航模式,Guess.js 构建了机器学习模型,用以预测并预加载每个后续页面上所需 JavaScript。

2.1K20
领券