逸尘的AI知识库

前端网站落地页提示词模版

9分钟阅读

前端网站落地页提示词模版

这部分的内容新手入门比较友好，更好看的前端网站模板可以在github上面找，也可以让AI推荐。因为AI自己写的（在没有专业提示词的情况下）没有经验老成的程序员沉淀了几十年的模板审美好。

通用模版

  1. 技术栈：用纯粹的 HTML + TailwindCSS 来做

  2. 核心功能：我要做一个 xx 网站

  3. 功能区域：你要有完整的以下区块：

    区块说明
    headerlogo 和网站名、导航按钮、中英文切换、深浅切换、登录按钮等
    hero介绍网站的标题、公告栏、CTA 按钮
    branding品牌展示：介绍网站用的技术栈
    introduce突出核心优势，什么是 xx？
    benefit说明选择的理由，为什么选择 xx？
    usage使用指南，分步骤说明
    feature功能特点，列举核心功能
    showcase案例展示
    status展示关键数据
    pricing定价
    testimonial用户评价
    FAQ常见问题
    CTA行动号召，启动您的第一个 xx
    footer版权声明、隐私政策、服务条款、免责声明、联系信息、合规链接、网站地图、法律声明、社交媒体链接、返回顶部

    其他内容需要编写得专业、真实。

  4. 网站文案：所有网站上的文案内容，我要求你使用 xx 语言。关于这个 xx 网站，你需要强调 xxx

  5. 网站风格：网站配色和风格需要现代化、高级，类似于苹果官网的风格。网站采用响应式设计，需要自适应各种屏幕尺寸。

英文完整版 Prompt

现在我要你帮我做一个网站的前端落地页，你要遵循以下要求：

  1. 技术栈：用纯粹的 HTML + TailwindCSS 来做

  2. 核心功能：我要做一个 xx 网站

  3. 功能区域：你要有完整的以下区块：

    SectionDescription
    headerLogo & Site Name, Navigation Buttons, Language Toggle (EN/CH), Dark/Light Mode Toggle, Login Button, etc.
    heroIntroduction Section: Website Title, Announcement Bar, CTA Button
    brandingBranding: Technical Stack Overview
    introduceHighlight Core Advantages: What is XX?
    benefitWhy Choose XX? Key Reasons to Choose
    usageUsage Guides: Step-by-Step Instructions
    featureCore Features: Listing Key Functions
    showcaseCase Studies: Success Stories
    statusKey Metrics: Data Highlights
    pricingPricing Plans
    testimonialUser Reviews: Testimonials
    FAQFrequently Asked Questions
    CTACall to Action: Start Your First XX
    footerCopyright Notice, Privacy Policy, Terms of Service, Disclaimer, Contact Information, Compliance Links, Sitemap, Legal Statements, Social Media Links, Back to Top

    其他内容需要编写得专业、真实。

  4. 网站文案：所有网站上的文案内容，我要求你使用英语。关于这个 xx 网站，你需要强调 xxx

  5. 网站风格：网站配色和风格需要现代化、高级，类似于苹果官网的风格。网站采用响应式设计，需要自适应各种屏幕尺寸。

中文完整版 Prompt

  1. 技术栈：用纯粹的 React + TailwindCSS 来完成我前端落地页的制作

  2. 核心功能：用户可以上传背景图片和输入文本，从而通过 AI 来返回配有用户输入文本的图片（将文本自然地融入背景图）

  3. 功能区域：你要有完整的以下区块：

    区块说明
    headerlogo 和网站名、导航按钮、中英文切换、深浅切换（不需要登录按钮）
    hero介绍网站的标题、公告栏、CTA 按钮
    图配文区域图片上传组件 + 文本输入组件（上方）、结果展示组件（下方）；详情参考截图；文本输入中汉字不少于 3 个，英文单词不少于 2 个
    branding品牌展示：介绍网站用的技术栈
    introduce突出核心优势：免费、无需登录、很自然地融合图片和文本
    benefit说明选择的理由，为什么选择此网站
    usage使用指南，分步骤说明
    showcase案例展示
    status展示关键数据
    pricing定价
    testimonial用户评价
    FAQ常见问题
    CTA行动号召：完成您的第一张图片
    footer版权声明、隐私政策、服务条款、免责声明、联系信息、合规链接、网站地图、法律声明、社交媒体链接、返回顶部

    内容需要编写得专业、真实。

  4. 网站文案：所有网站上的文案内容，我要求你使用中文。关于这个网站，你需要强调图配文的优势，突出网站的特色

  5. 网站风格：网站配色和风格需要现代化、高级，类似于苹果官网的风格，同时可以参考截图网站。网站采用响应式设计，需要自适应各种屏幕尺寸。

本地服务类落地页模版

适用于实体商家、本地服务类网站（装修、咨询、调查等）

英雄区域

  • 一个引人注目的标题，解释你做什么以及为什么这很重要
  • 一个与业务紧密相关的强力行动号召（例如：“免费预约调查”）
  • 强调您专业能力的副标题

关于我们 / 为何选择我们

  • 简要介绍您的企业、资质和本地专业知识
  • 突出你的独特之处（认证、经营年限、社区联系）

问题部分

  • 清晰列出你的理想客户面临的问题
  • 使用项目符号以增强清晰度和即时共鸣

解决方案部分

  • 将自己定位为能够解决这些问题的专家导师
  • 强调你对这些问题的权威性和深刻理解

服务部分

  • 突出 3-5 项核心服务，并附简短描述
  • 为每项服务提供详细页面的链接

优势部分

  • 专注于客户可以期待的结果
  • 使用视觉元素或图标，使这些优势能被快速识别

流程部分

  • 将客户旅程分解为三个简单步骤：
    1. 如何开始（例如，安排咨询）
    2. 您的核心服务流程
    3. 最终结果或转变

作品集 / 案例研究部分

  • 展示您作品的实际案例，使用前后对比照片或详细的案例研究
  • 向潜在客户展示切实可见的成果

客户评价部分

  • 尽可能展示真实的视频客户证言，或者结合详细和简短的书面客户证言
  • 包含星级评分，作为快速的可视化信任信号

担保 / 保证部分

  • 提供满意度保证或质量保证以降低风险感知
  • 这使访客放心，他们的投资是安全的

常见问题解答部分

  • 解决常见问题并克服异议
  • 确保最紧迫的问题得到清晰解答

强力行动号召与页脚

  • 在页面底部重申清晰且具有行动力的行动号召
  • 在页脚中包含必要的联系信息、社交媒体链接，以及任何行业关联或法律信息

关系图谱