关于网站制作的指标 第1篇
Largest Contentful Paint 考虑的元素类型包括：
元素（第一帧呈现时间用于 GIF 或动画 PNG 等动画内容）
元素内的 元素
元素（系统会使用视频的海报图片加载时间或第一帧显示时间，以较早者为准）
一个元素，带有使用 url() 函数加载的背景图片
包含文本节点或其他内嵌级文本元素子元素的块级元素。
后面可能会增加其他元素
为 LCP 报告的元素的大小通常是用户在窗口中可见的大小，如果元素延伸到窗口之外，或者元素被剪切或有不可见的溢出，这些部分不计入元素的大小。
对于根据固有尺寸调整过大小的图片元素，报告的尺寸为可见尺寸或固有尺寸（以较小者为准）。
对于文本元素，LCP 只会考虑能够包含所有文本节点的最小矩形。
对于所有元素，LCP 都不会考虑使用 CSS 应用的外边距、内边距或边框。
网页通常会分阶段加载，因此，网页上最大的元素可能会发生变化。
为了应对这种可能发生的变化，浏览器在绘制完第一帧后，会立即分派 largest-contentful-paint 类型的 PerformanceEntry，用于标识链接最大的内容元素，在渲染后续帧后，只要最大内容元素发生变化，它就会再分派一个 PerformanceEntry
元素只有在呈现并对用户可见后，才能被视为最大的内容元素。尚未加载的图片不会被视为已渲染。在字体屏蔽期间，文本节点也不会使用网页字体。在这种情况下，系统可能会将较小的元素报告为最大的内容元素，但如果这个较大的元素呈现完毕，系统便会创建另一个 PerformanceEntry
除了延迟加载图片和字体之外，网页还可能会在新内容可用时向 DOM 添加新元素。如果这些新元素中的任何一个大于之前的最大内容元素，系统还会报告新的 PerformanceEntry
如果从窗口甚至 DOM 中移除了最大的内容元素，除非渲染了较大的元素，否则它仍然是最大的内容元素
一旦用户与网页互动（通过点按、滚动或按键），浏览器就会停止报告，因为用户互动通常会改变向用户显示的内容（特别是滚动时）。
API 将为后台标签页中加载的页面分派 largest-contentful-paint，但在计算 LCP 时应忽略这些页面。
在页面进入后台后，API 将继续分派 largest-contentful-paint，但在计算 LCP 时应忽略这些（只有在页面始终在前台运行时才可以考虑元素）。
从往返缓存中恢复网页时，该 API 不会报告 largest-contentful-paint ，但应在在这些情况下衡量 LCP ，因为用户对它们的访问体验是不同的。
API 不会考虑 iframe 中的元素，但该指标会考虑，因为它们是网页用户体验的一部分。
API 从导航开始就测量 LCP，但对于预渲染的网页，LCP 应从 activationStart 开始测量，因为 LCP 对应于用户实际体验到的 LCP 时间。
可以使用 web-vitalsJavaScript 库来衡量 LCP，而无需记住所有这些细微差异
INP：与网页进行的每次 tap、click 或键盘互动的延迟时间
良好的响应速度意味着网页对互动的响应速度很快。
当网页响应互动时，浏览器会在所绘制的下一帧中提供_视觉反馈。
有些互动自然会比其他互动花费更长的时间，但对于特别复杂的互动，必须快速提供一些初始视觉反馈，让用户知道正在发生的事情。
INP 的目的不是测量互动的所有最终效果，而是下一次绘制被阻止的时间。通过延迟视觉反馈，用户可能会觉得页面响应速度不够快，而 INP 旨在帮助开发者衡量这部分用户体验。
一般 200 ms 以内
INP 低于或等于 200 毫秒表示网页响应良好。
INP 高于 200 毫秒且低于或等于 500 毫秒表示网页的响应能力需要改进。
INP 高于 500 毫秒表示网页响应速度很差。
互动的主要驱动因素通常是 JavaScript，但浏览器确实会通过并非由 JavaScript 提供支持的控件（例如复选框、单选按钮和由 CSS 提供支持的控件）提供互动性。 就 INP 而言，只观察以下互动类型：
互动发生在主文档或文档内嵌的 iframe 中。
系统会在用户离开页面时计算该页面的 INP。结果会得到一个能够代表网页在其整个生命周期内的整体响应能力的值。INP 较低意味着网页能够可靠地响应用户输入。
INP 是 First Input Delay (FID) 的继任指标。虽然两者都是响应速度指标，但 FID 仅衡量了网页上首次互动的输入延迟。INP 通过观察网页上的所有互动来改进 FID，即从输入延迟开始，到运行事件处理脚本所需的时间，再到浏览器绘制下一帧。 这些差异意味着 INP 和 FID 是不同类型的响应能力指标。FID 是用于评估网页对用户的首次展示的加载响应速度指标，而无论网页互动在何时发生，INP 都是更可靠的整体响应能力指标。
网页可能不会返回任何 INP 值。导致这种情况的原因可能有很多，其中包括以下原因：
优化耗时较长的任务
优化输入延迟
脚本评估和耗时较长的任务
使用 Web Worker 在浏览器的主线程之外运行 JavaScript
避免大型、复杂的布局和布局抖动
缩小样式计算的范围并降低其复杂性
TBT：总阻塞时间，从 FCP 到可交互时间 (TTI) 之间的总时长，其中主线程处于阻塞状态的时间足够长，足以阻止输入响应能力。
每当存在长任务（一种在主线程上运行时间超过 50 毫秒 (ms) 的任务）时，主线程就会被视为阻塞。
我们说主线程处于阻塞状态，因为浏览器无法中断正在进行的任务。如果用户尝试在耗时较长的任务过程中与页面互动，浏览器必须等待任务完成才能响应。
如果主线程处于阻塞状态的时间超过 50 毫秒，用户很可能会注意到延迟，并认为网页运行缓慢或损坏。
网站的 TBT 应低于 200 毫秒。
将所有工作拆分为运行时间不超过 50 毫秒的代码块，并在合适的位置和时间运行这些代码块。
降低第三方代码的影响
缩短 JavaScript 执行时间
去除不必要的 JS 加载、解析、执行
尽量减少主线程工作
尽量减少请求数量，减少传输大小
CLS：从页面开始加载到其生命周期状态更改为隐藏期间发生的所有意外布局偏移的累计得分。
每当可见元素的位置从渲染的帧更改为下一帧时，都会发生布局偏移。
只要窗口内可见的元素在两帧之间更改起始位置，该 API 就会报告 layout-shift 。此类元素被视为不稳定元素。
当资源以异步方式加载或 DOM 元素被动态添加到页面的现有内容之前，页面内容通常会发生意外移动。
布局偏移的原因可能包括尺寸未知的图片或视频、呈现的字体大于或小于其初始后备值，或者第三方广告或微件会自行调整大小。
由于网站在开发过程中的运行情况与其用户的体验之间的差异，会使此问题变得更糟。例如：
个性化内容或第三方内容在开发和生产环境中的行为通常有所不同。
测试图片通常已存在于开发者的浏览器缓存中，但为最终用户加载所需时间更长。
在本地运行的 API 调用速度通常非常快，以至于开发过程中出现明显的延迟，在生产环境中可能就会出现严重的延迟。
为了提供良好的用户体验，网站应努力使 CLS 得分不超过 。
如果网页是在后台加载的，或者在浏览器绘制任何内容之前在后台播放，则系统不应报告任何 CLS 值。
如果某个网页从往返缓存中恢复，其 CLS 值应重置为零，因为用户此次体验是一次不同的网页访问。
该 API 不会针对 iframe 中发生的偏移报告 layout-shift ，但该指标会报告这些变化，因为它们会影响网页的用户体验。
改善没有尺寸的图片
给嵌入内容的延迟加载预留空间
动画：尽量使用 transform 平移动画、缩放、旋转/倾斜元素
网络字体优化
TTFB：网络使用资源的第一个字节响应用户请求所需的时间。
TTFB 是以下请求阶段的总和：
重定向时间
Service Worker 启动时间（如果适用）
DNS 查找
连接和 TLS 协商
请求，直到响应的第一个字节到达
缩短连接设置时间和后端的延迟时间有助于降低 TTFB。
大多数网站都应尽量将 TTFB 控制在 秒以内。
使用 web-vitalsJavaScript 库也可以在浏览器中以较低的复杂性测量 TTFB
具体的项目平台
托管服务商
CDN
尽可能的使用缓存
避免多次重定向
使用 service worker
FID：从用户首次与网页互动到浏览器实际能够开始处理事件处理脚本以响应相应互动的时间。
为了提供良好的用户体验，网站应努力将 FID 控制在 100 毫秒以内
FID 指标只能在实际操作衡量，因为它需要真实用户的网页互动
Chrome 用户体验报告
PageSpeed Insights
web-vitals JavaScript 库
PerformanceObserver
拆分长任务
使用 web worker
缩短 JS 执行时间
减少多余的 JS
针对具体的情况优化页面
关于网站制作的指标 第2篇
用户是打开网站浏览很重要，而用户是何时离开，怎么离开，也很重要。退出率指的是用户在特定页面离开占这个网站的百分比。需要注意的是，退出率和跳出率是有差别的。
如果某个页面的退出率较高，界面可能存在问题，如某些元素无法加载，或页面出错。另一方面，对于电商网站来说，结帐和支付页面的高退出率反映了销售状况良好，成交比例高。
如果页面的退出率很高，那么可能需要重新设计了。想要降低页面的退出率，需要让页面内容去吸引用户，或可供用户交互的操作，简单点说，是让用户在这里有事情做。同时，这还不能损坏当前页面的行为召唤设计。
如果电商页面的退出率很低，对于销售和产品交易可能造成不好的影响。需要注意页面中是否包含了循环链接，或因某些障碍导致用户无法进入到下一个环节。
当然，用户很终还是会离开这个页面的。我们要关注其意外离开，或潜在错误导致的非正常的退出率数据。
北京网站建设公司时代创信温馨提示：这些指标只是给出一些网站设计方向，具体的网站设计制定要从自己的实际需求出发。
关于网站制作的指标 第3篇
链接跳转：访客通过另外一个网站上的链接跳转到你的网站
URL输入：直接在地址栏输入你的网站的URL并进入
绝大多数的网站的流量来源于这三个方面。
了解用户来源，有助于有意识地创建吸引用户的设计，打破原有流量来源结构，让更多用户了解网站。要让其他的网站主观上愿意链接到你的网站，常用方法是创建带有良好内容的博客，很好包含有受众喜欢的内容或素材。
进行搜索引擎优化也是常用的解决方案，为搜索引擎进行优化所带来的价值可能超出你的想象。
针对网站URL进行优化。创建让用户更容易记住的URL是很有必要的，国内的网站大都采用拼音式域名，国外的网站选择更加直观的单词组合，比如 所选择的是 Web Designer Depot。很好不要在域名中加入下划线，这样会让用户感到迷惑。
关于网站制作的指标 第4篇
网站的访客，一般可分为两种，一种是次来到网站的，第二种是已经来过又回来的访客。这两种访客的比例其实是很能反映网站的状况。对于这两种不同的访客，你需要有针对性地对网站进行设计，来进行处理。
首先，在视觉设计上要足够突出，这样可以吸引次来网站的访客。同时，网站的设计要进行更新，这样才能常看常新，不停地吸引人。有趣的图片和视频是很值得使用的元素。
你应该让访客能够了解网站的内容，以及如何找到他们想要的信息。大标题、LOGO和设计的导航都可以让网站的目标性更加突出。