房源核心信息必须置于内，含标题、价格、户型图（用）、描述及联系入口；按决策路径分并配；物理地址用，中介信息归。

用

包住房源核心信息，别塞进 里凑数

用户点进详情页，真正要读的是标题、价格、户型图、描述、联系入口——这些必须落在

内。搜索引擎和读屏工具靠这个识别“这是页面主内容”。常见错误是整个页面用一堆 套娃，

要么没写，要么只包了 banner 或面包屑。

实操建议：

• 应直接子元素包含
  （房源标题）、
  （如“基础信息”“周边配套”）等语义块
• 避免在
  里放侧边栏、底部推荐、广告位——它们属于 或独立
• 如果用了前端框架（如 React/Vue），确保 SSR 或 hydration 后 DOM 中仍保留
  结构，别被 JS 动态删掉

按用户决策路径分块，不是按 UI 样式切栏

房产详情页的阅读动线很明确：先看值不值（价格+面积）、再看住不住得下（户型+楼层）、然后信不信得过（产权+中介信息）、最后要不要行动（电话+预约看房）。每个环节对应一个

，且必须带

作为该区块标题。

常见问题：

• 把“小区实景图轮播”和“VR 看房按钮”硬塞进同一个
  ，但它们服务不同目标（展示 vs 交互），应拆开
• 用
  替代 只为“看起来更语义化”，却没配
  —— 这会让辅助技术丢失上下文
• “交通配套”和“学区信息”混在一个
  里，其实用户查地铁和查学校是两个独立动作，应分设

+ 处理户型图与实拍图，别只用

户型图不是装饰图，它承载关键结构信息（几室几厅、朝向、尺寸标注）；实拍图也需说明拍摄位置（如“主卧朝南窗景”）。裸 缺少上下文，对 SEO 和无障碍都不友好。

正确写法示例：

  @@##@@
  

注意点：

• alt 属性必须描述图中可识别的关键信息，不能写“户型图”这种泛称
• 如果同一套房源有多张户型图（如原始结构 vs 改造后），每个
  独立，不要合并到一个
  里
• VR 看房链接不属于
  ，应放在相邻
  的操作区，用 或带 role="link" 的元素

只用于房源物理地址，中介公司信息用

在 HTML5 中有明确定义：表示“作者/拥有者”的联系信息，且**仅限当前页面内容的所属实体**。对房源页来说，就是这套房子的实际地理位置，不是中介门店地址，也不是客服电话。

错误用法：

• 把“链家北京朝阳大悦城店：010-8888XXXX”放进 —— 这是服务提供方，不是房源本身属性
• 用 包含经纬度坐标或地图嵌入代码 —— 它只接受文本联系信息
• 在房源列表页的每条卡片里都加 —— 列表页没有单个房源的“主内容上下文”， 语义失效

正确做法：房源详情页的物理地址用 ，中介公司介绍、经纪人信息、资质证书等统一归入 ，并用

标明“本房源由 XX 提供服务”。

复杂点在于多房源聚合页（比如“同小区在售房源”Tab），那里没有单一

，也就没有合法的 使用场景——此时老实用 更稳妥。