简单分享一个我们在平时在做网站页面设计时需要注意的细节。
如上面这个 Tab 组件，很多朋友会喜欢在页面上使用。
首先是因为这种 Tab 组件的动画交互很完善，光标在上面滑动的时候会有很多比较酷炫效果。
其次则是能把很多信息聚合起来，形成一个信息比较集中的内容块。
像上面这个 Tab 组件是主要是介绍产品定制参数的，用这种方式处理起来就使得页面没那么杂乱。
当然我也看过使用这种 Tab 区块去做其他内容区的，比如询盘订单的处理流程，用这种组件来处理就会显得比较高级。
但我们在使用这种 Tab 区块做页面内容的时候，一定要注意检查它的信息加载方式是不是异步的。
举个简单的例子，上面图片中的这个组件有 4 个 Tab。
异步加载方式就是，在页面初次加载的时候，只会主动加载 A Options 的内容，而其他的 3 个则不会去加载。
至于其他 3 个 Tab 的内容，只有当用户主动点击到那个 Tab 选项时才会去进行内容加载。
这也就导致了搜索引擎爬虫初次来访问我们页面的时候，只会看到 A Options 的内容，并不能看到其他三个 Tab 上面的信息。
就是因为这种信息加载的技术差异，导致了我们的内容对搜索引擎来说是隐身的。
试想一下你用这种 Tab 组件去做询盘订单的处理流程，虽然你自己访问页面知道是有六个步骤或者八个步骤，但在搜索引擎眼里它永远只能看到第一步“提交询盘信息”。
所以，怎么检查这种 Tab 组件的内容是异步加载还是同步加载？
方法其实非常简单，直接在对应页面上点击鼠标右键，会看到一个 View page source 的选项，选择之后便可以看到整个网页的初始代码了。
直接去这个代码里面搜索，你想要的内容在不在里面，如果没有的话，那大概率这个组件就是异步加载。
或者换一种方式，使用 Obsidian 这样的浏览器插件来抓取页面内容，如果能很方便抓得到内容的话，那就说明信息大概率是同步加载。
我觉得这个点对于没有技术背景的小伙伴来说，大概率会踩坑，所以在做页面内容建设的时候，尤其需要注意一下。
当然除了这种 Tab 组件外，还有不少第三方插件提供的功能组件会存在这种问题。
最好的做法就是，我们更新完内容之后，自己亲手去检查一下网页源代码里面有没有这部分内容。
如果没有的话，那就需要考虑到底要不要用这款功能插件。
