用重复的内容保持良好的语义
Preserving good semantics with repetitive content
假设我正在构建一个典型的文档编辑器：
其中预览（红色）是表单数据的最新格式化视图。
预览元素包含语义元素（例如h1、h2、main、header等）。它本身就是一份文档，从概念上讲确实有意义。但这使得 real 文档的结构对于爬虫和屏幕阅读器来说相当混乱。例如，可能有两个 h1 或 main 元素。我正在寻找避免这种情况的方法。
此外，还有内容重复的问题（见图）。
对于问题的可访问性部分，我可以向预览元素添加一个 aria-hidden="true" 属性。事实上，视障人士不需要预览，这对他们来说只是多余的，他们只需要表格。
但对于爬虫，我的选择如下：
- 不要在预览元素中使用语义元素，而是使用
divs ()。
- 在另一个 URL 上托管预览并通过
iframe 插入它（这就是我现在正在做的，但对我来说似乎很老套）。
- 就这样吧，爬虫不关心。
任何 idea/resource/suggestion?
只要您的预览区域明确指出辅助技术，有多余的信息就完全没有问题。如果您有 <iframe>，请确保其上有 title 属性。
<iframe title="preview area"...>
但是，您可能 validator 有多个结构元素的问题。
例如HTML只允许一个<main>元素：
A document must not have more than one main element that does not have the hidden attribute specified.
你可以有多个<header> elements but a <header> has a default role of banner并且横幅角色说：
Within any document or application, the author SHOULD mark no more than one element with the banner role.
这里的关键是“should", meaning it's a strong recommendation but not required. You can also get away with multiple banner roles if your preview section has role="document".
我建议 不要 使用 non-semantic 元素 (div)，因为辅助技术用户可能想要检查生成内容的实际语义结构，尽管我想您也可以为使用所有完整语义的预览设置“在新选项卡中显示”选项，有点像您的第二个项目符号，但不使用 iframe。
假设我正在构建一个典型的文档编辑器：
其中预览（红色）是表单数据的最新格式化视图。
预览元素包含语义元素（例如h1、h2、main、header等）。它本身就是一份文档，从概念上讲确实有意义。但这使得 real 文档的结构对于爬虫和屏幕阅读器来说相当混乱。例如，可能有两个 h1 或 main 元素。我正在寻找避免这种情况的方法。
此外，还有内容重复的问题（见图）。
对于问题的可访问性部分，我可以向预览元素添加一个 aria-hidden="true" 属性。事实上，视障人士不需要预览，这对他们来说只是多余的，他们只需要表格。
但对于爬虫，我的选择如下：
- 不要在预览元素中使用语义元素，而是使用
divs ()。 - 在另一个 URL 上托管预览并通过
iframe插入它（这就是我现在正在做的，但对我来说似乎很老套）。 - 就这样吧，爬虫不关心。
任何 idea/resource/suggestion?
只要您的预览区域明确指出辅助技术，有多余的信息就完全没有问题。如果您有 <iframe>，请确保其上有 title 属性。
<iframe title="preview area"...>
但是，您可能 validator 有多个结构元素的问题。
例如HTML只允许一个<main>元素：
A document must not have more than one
mainelement that does not have thehiddenattribute specified.
你可以有多个<header> elements but a <header> has a default role of banner并且横幅角色说：
Within any document or application, the author SHOULD mark no more than one element with the banner role.
这里的关键是“should", meaning it's a strong recommendation but not required. You can also get away with multiple banner roles if your preview section has role="document".
我建议 不要 使用 non-semantic 元素 (div)，因为辅助技术用户可能想要检查生成内容的实际语义结构，尽管我想您也可以为使用所有完整语义的预览设置“在新选项卡中显示”选项，有点像您的第二个项目符号，但不使用 iframe。