人们很容易想直接丢入整个落地页然后按转换。对于长页面，逐节处理整体更快，也更容易验证。
为什么分片更胜一筹
- 更小的单元易于快速查看。你能一眼判断主视觉区块是否转换正确；但无法同时判断四十个部分。
- 你避免了意外导入站点页眉、页脚和 cookie 横幅。
- 如果某个部分转换效果不好，你可以修复源内容并单独重跑，而不必重做全部。
- 嵌套保持更浅，因为你不会带着页面的外层包装器。
两种分片方式
可视化选择器
加载页面，然后使用可视化选择器悬停在渲染预览上，点击你想要的内容块。它会获取该元素的标记——并且重要的是，会随它一起带上页面的样式表，这样样式位于基于类的 CSS 文件中的内容块在转换时仍能保持样式完整。
复制根节点
先转换整个页面一次，打开结构图，点击你想要的那一行上的目标图标。该行会成为复制根节点，并且只导出其子树——外层包装器会被丢弃。你也可以用叉号图标排除单个行。
可扩展的工作流程
- 先转换并粘贴主视觉区块。把它做好——间距、字体、按钮悬停状态。
- 每次向下移动一个部分，依次粘贴到上一个下方。
- 每两三个部分之后，依次查看三种设备视图。尽早发现响应式问题比到最后才处理便宜得多。
- 把你会复用的内容——功能行、客户评价块——随时保存到 Elementor 模板库。
让各个部分保持独立
不要把所有内容合并到一个巨大的容器中。每个部分保持一个顶层容器，符合 Elementor 页面通常的构建方式，让重新排序变得简单，并且允许你在不为树结构纠结的情况下设置部分级别的背景和内边距。
为什么选择器会携带样式表
这里有一个微妙之处，决定了分片是否可行。在样式位于文档头中基于类的 CSS 的页面上，元素自身的标记几乎不包含任何样式信息——<section class="hero"> 并不能告诉你 .hero 长什么样。
因此，当你确认选择时，选择器并不会只返回该元素。它会将页面自身的样式块前置到提取的标记前，这样这个分片就是自包含的，转换后外观也能保持完整。它自己的高亮样式会被标记并排除，所以选择器的 UI 不会泄漏到你的输出中。
这就是为什么从 Tailwind 或 Bootstrap 页面中选择一个部分可以成功，而从开发者工具中复制该部分的 outerHTML 并粘贴进来只会得到无样式标记。如果你是在手动提取而不是使用选择器，也请复制样式块——否则你转换的只是一副骨架。
哪种分片方法适合哪种情况
这两种途径不可互换，选错会浪费时间：
- 当你拥有整个页面且只想要其中一部分时，使用选择器。它可视化，能替你处理样式表问题，并且你永远不会把页面其余部分加载到转换器中。最适合从竞品风格的参考页面或大型模板中提取主视觉区块。
- 当你想要一个页面中的多个部分时，使用复制根节点。转换一次，然后重新导出不同子树，无需每次重新运行分析。最适合系统地向下处理一个你打算完全重建的页面。
在处理过程中留意嵌套
分片有一个人们很晚才注意到的副作用：每个分片到达时都会带着源页面中位于它上方任意多个包装器层级。粘贴四个分片后，你可能会得到四个处于不同深度的部分，这会让最终页面虽然看起来没问题，但编辑起来不一致。
结构图会为每次转换显示 最大嵌套深度。每处理一个分片时看一眼，每次都争取达到相同的较浅深度——通常是通过将复制根节点设置在低一到两个层级，而不是接受最外层包装器。这里各节之间的一致性比绝对数值更重要。
关于页眉、页脚和 cookie 横幅的说明
整页转换会拾取 body 中的所有内容，在真实页面上这意味着站点页眉、页脚、cookie 条，可能还有聊天小部件。这些都不属于你的部分，事后再到 Elementor 中删除比一开始就不导入更慢。
这是支持分片最有力的实际论据。它还避免了一个特别令人不快的意外：导入的固定定位页眉在转换期间会被故意降级为绝对定位——这是为了让它无法覆盖你的整个站点——从而留下一个页眉形状的块漂浮在你的部分上方，直到你找到并删除它。
什么时候整页转换也没问题
短页面——一个主视觉区块、两三个部分和一个页脚 CTA——一次转换就很干净。逐节处理在长营销页面以及任何标记不是为转换而编写的页面上，能体现其价值。
一个合理的规则：如果你能在三个滚动高度内看到整个页面，并且它没有站点框架，就整页转换。任何更长的页面，或者任何从真实网站上抓取而非作为独立块编写的页面，分片处理都更快。