首屏
Hero
初级网页首屏（Hero）是官网打开后最先呈现的核心内容区，通常放在导航栏下方，用标题、简短说明和主要操作介绍产品。它解决访客刚进站时不知道产品做什么、是否与自己有关、下一步能做什么的问题。
你可能会说：「我想让访客一打开官网，就看懂我们做什么，并知道下一步该点哪里。」
动手看看项目管理官网首屏
先看导航下方这一整块：标题说清产品价值，短说明补充它怎么做，主按钮给访客一个下一步。切换布局，再悬停或聚焦按钮试试反馈。
图文并排适合需要快速展示产品界面的官网。右侧放真实工作场景的预览，访客能把左边的承诺和产品联系起来。
要点首屏要帮访客弄清哪几件事？
- 1
先说清产品和目标用户
你可以先问：一个不了解产品的人，看完标题和说明，能否说出它帮谁解决什么问题？比如 AI 会议工具，写清“整理会议纪要并提取待办”，比只写“让协作更高效”更容易理解。
- 2
给出一个明确的下一步
如果你希望访客开始试用，就把“免费试用”作为主要操作；如果产品需要先解释清楚，可以引导他查看演示。首屏不必把所有入口摆出来，因为选择太多会冲淡你最希望他采取的行动。
- 3
让文字和视觉相互补充
首屏可以放产品截图、演示画面，也可以主要靠文字。选什么取决于产品怎么被理解：后台工具的真实界面能帮助访客判断用途，但截图里的细节通常代替不了一句说清价值的标题。
容易混淆的地方
首屏说的是官网开头承担主要介绍任务的内容区，不等于浏览器当前恰好看见的全部内容；屏幕高度不同，访客看到的范围也不同。它也不等于页头：页头通常放标志和导航，首屏则负责说明产品价值并引导行动。首屏可以有大图，但不是所有大图横幅都能完成这件事。
什么时候用
适合用
- 做一款新的 AI 写作工具官网时，用首屏快速交代它帮谁写什么，并引导访客开始体验。
- 为已有 SaaS 产品重做首页时，用首屏突出当前主打能力，让新访客找到试用入口。
- 做产品发布落地页时，用首屏概括这次发布的核心变化，再引导访客往下了解细节。
不适合用
- 做登录后的数据分析后台时，用户已经带着任务进来，用概览卡片和导航比官网式首屏更合适。
- 做一篇长篇帮助文档时，读者想尽快找到答案，用清楚的标题、目录和正文开头即可。
- 做订单支付页时，用户需要核对金额并完成支付，把空间留给订单摘要和支付表单。
练一练选一个答案，看看解释
你正在做一款 AI 会议纪要工具的官网首页。新访客常说看不出它具体能做什么，你会怎样设计页面开头？
让 AI 帮你做复制给 AI Agent 直接用
请为我的 AI 会议纪要工具设计官网首屏：面向经常开跨团队会议的项目负责人，用标题和简短说明讲清“会后自动整理纪要与待办”，展示一张结果示例，主要操作是“免费试用”。导航栏单独处理，首屏下方再展开功能细节；请同时考虑手机布局。