如何使用 Siter：10 分钟内搭建网站 (2026)

快速入门

本指南涵盖了 Siter 的所有功能：

• 入门 — 创建账户和基本设置
• 如何使用表单集合 — 从网站访客那里获取潜在客户信息和反馈
• 如何使用着陆页 — 几分钟内即可创建高转化率页面
• 如何使用嵌入式和本地视频 — 添加视频内容以吸引访客
• 如何使用直观设计工具 — 使用拖放界面进行创建
• 如何使用组和图层 — 整理元素以便于编辑
• 如何使用 Figma 插件 将 Figma 设计稿转换为实际网站
• 如何使用自定义地图 — 向您的网站添加位置数据
• 如何使用自定义链接 — 连接页面和外部资源

所需时间： 每部影片 5 分钟

本指南还包含以下内容： 专业提示 | 常见错误 | 故障排除 | 定价 | 替代方案

为什么信任本指南

我使用 Siter 已经超过 6 个月了，并且测试了这里介绍的所有功能。这篇 Siter 使用教程源于真实的实践经验，而非营销宣传或厂商截图。

Siter是目前功能最强大的网站搭建工具之一。

但大多数用户仅仅触及了它功能的冰山一角。

本指南将一步步教您如何使用 Siter。

您将通过屏幕截图和专业技巧了解每个功能。

网站教程

本 Siter 完整教程将一步一步地引导您了解每个功能，从初始设置到高级技巧，让您成为高级用户。

Siter入门指南

使用任何功能之前，请先完成此一次性设置。

大约需要3分钟。

注册后，您将访问一个控制面板，该面板将作为您网站的控制中心。

现在让我们一步一步来。

第一步：创建您的帐户

请访问 Siter 的网站 siter.io。

点击“开始”或“注册”即可开始。

请输入您的电子邮件地址并创建密码。

✓ 检查点： 检查你的 收件箱 请发送确认邮件。

步骤二：访问平台

Siter 完全在浏览器中运行——无需下载。

打开电脑或任何带有网络浏览器的设备。

使用您的新帐户凭据登录。

这就是仪表盘的样子：

✓ 检查点： 您应该能看到包含项目选项的主控制面板。

步骤 3：完成初始设置

Siter 提供预先设计好的模板，简化网站创建过程。

选择模板或从空白画布开始。

在完成初始设置后，您可以随时在 Siter 中修改模板、颜色和字体。

如何使用 Siter 表单集合

表单收集 可让您直接从您的网站获取潜在客户、反馈和用户数据。

以下是使用步骤。

观看 Forms Collection 的实际应用：

现在让我们逐一分析每个步骤。

步骤 1：添加表单元素

在 Siter 页面编辑器中打开您的项目。

点击“+”图标，即可向页面添加元素。

从元素菜单中选择“表单”。

步骤二：自定义表单字段

将表单拖动到屏幕上的所需位置。

点击每个字段即可自定义标签和输入类型。

要添加文本框和按钮等内容，只需点击并拖动即可。

✓ 检查点： 您应该能看到包含所有必填字段的表单。

步骤 3：配置提交

点击表单设置图标，设置提交内容的保存位置。

请输入您的电子邮件地址以接收表单回复。

按下按钮保存配置。

如何使用 Siter 着陆页

着陆页 它允许您使用拖放界面构建高转化率页面。

以下是使用步骤。

观看落地页创建过程：

现在让我们逐一分析每个步骤。

步骤 1：创建新页面

在项目控制面板中，点击“添加页面”。

您可以选择模板，也可以从零开始，完全掌控设计。

给你的页面起一个描述性的名字，比如“产品发布”。

步骤二：设计布局

使用拖放界面来定位元素。

添加文本、图像和按钮元素非常简单易行。

这就是它的样子：

✓ 检查点： 您的着陆页布局应该已经初具雏形了。

步骤三：提升转化率

在首屏上方添加一个清晰的行动号召按钮。

设计要简洁，每页只有一个主要目标。

自定义颜色和字体，使其与您的品牌相匹配。

如何使用 Siter Embed 和本地视频

嵌入式和本地视频 允许您添加视频内容，以吸引访客并解释复杂的概念。

以下是使用步骤。

稍后观看或立即观看——视频能让您的网站更具吸引力。

让我们逐一分析每个步骤。

步骤 1：添加视频元素

点击元素面板，然后选择“视频”。

选择嵌入视频或本地视频上传。

将视频元素拖放到所需位置。

步骤 2：配置视频源

对于嵌入式视频，请从 YouTube 或 Vimeo 复制链接。

将网址粘贴到视频设置面板中。

这就是它的样子：

✓ 检查点： 你应该能在编辑器里看到视频预览。

步骤 3：自定义播放设置

根据需要选择自动播放、循环播放或控制选项。

调整视频帧大小以适应您的布局。

将其放置在用户容易看到内容的位置。

如何使用 Siter 直观设计工具

直观的设计工具 无需任何编程技能即可创建专业网站。

以下是使用步骤。

Siter 是为没有任何网站经验的初学者设计的。

让我们逐一分析每个步骤。

步骤 1：选择您的工作区

从项目控制面板打开页面编辑器。

该编辑器会显示一个画布，供您自由绘制设计。

无需任何编程知识——所有操作都以可视化方式进行。

步骤 2：使用可视化编辑器

点击任意元素即可选中进行编辑。

您可以完全控制地将元素拖动到屏幕上的任何位置。

这就是它的样子：

✓ 检查点： 你应该能看到可视化设计工具流畅运行。

步骤 3：预览您的设计

点击预览按钮，即可像访客一样查看您的网站。

检查一下你的设计在不同设备上的显示效果。

根据预览结果进行调整。

如何使用站点组和图层

组和图层 可让您组织多个元素，以便更轻松地编辑和管理。

以下是使用步骤。

此功能非常适合包含许多元素的复杂布局。

让我们逐一分析每个步骤。

步骤 1：选择多个元素

按住Shift键并单击要分组的每个元素。

或者拖动选择框选中多个元素。

所有选中的项目都会显示选择手柄。

步骤 2：创建群组

右键单击并从菜单中选择“组”。

或者使用键盘快捷键 Ctrl+G 立即进行分组。

这就是它的样子：

✓ 检查点： 现在，各个元素作为一个整体移动和调整大小。

步骤 3：管理图层

从右侧边栏打开“图层”面板。

拖动图层即可更改其在剖面上的堆叠顺序。

使用眼睛图标可以隐藏或显示特定图层。

如何使用 Siter Figma 插件

Figma插件 无需编码即可将 Figma 设计转换为实际网站。

以下是使用步骤。

观看 Figma 插件概览：

现在让我们逐一分析每个步骤。

步骤 1：安装插件

打开 Figma 并转到“社区”部分。

在插件区域搜索“Siter.io”。

点击“安装”将其添加到您的 Figma 平台。

步骤 2：导出您的设计

打开您想要转换的 Figma 设计。

选择要导出为网页的帧。

这就是它的样子：

✓ 检查点： 您的帧已选好，可以导出了。

步骤 3：导入到 Siter

从“插件”菜单运行 Siter 插件。

系统提示时，请使用您的 Siter 帐户登录。

点击导出，您的设计即可在 Siter 中编辑。

如何使用 Siter 自定义地图

可定制地图 允许您添加交互式位置数据，帮助访客找到您。

以下是使用步骤。

地图非常适合 商业 网站和联系页面。

让我们逐一分析每个步骤。

步骤 1：添加地图元素

点击“+”按钮打开元素菜单。

从可用选项中选择“地图”。

将地图组件拖到您的页面上。

步骤 2：设置您的位置

点击地图打开设置。

请输入您的公司地址或坐标。

这就是它的样子：

✓ 检查点： 您的位置标记应该会显示在地图上。

步骤 3：自定义地图样式

调整缩放级别以显示合适的区域范围。

选择地图样式——标准、卫星或自定义主题。

调整地图框大小以适应您的布局设计。

如何使用 Siter 自定义链接

自定义链接 可连接页面、触发操作和链接外部资源。

以下是使用步骤。

链接对于导航和用户体验至关重要。

让我们逐一分析每个步骤。

步骤 1：选择元素

点击任何文本、按钮或图像元素。

打开右侧的属性面板。

在设置中找到“链接”选项。

步骤 2：设置链接类型

您可以选择网址、页面、章节、电子邮件或电话链接。

对于网址，请粘贴目标地址。

这就是它的样子：

✓ 检查点： 您的链路类型已选择并配置。

步骤 3：配置链路行为

选择是在新标签页中打开还是在当前窗口中打开。

对于叠加链接，选择“打开叠加层”选项以触发弹出窗口。

使用预览模式测试您的链接。

Siter 专业技巧和快捷方式

经过 6 个多月的 Siter 测试，以下是我总结的最佳使用技巧。

键盘快捷键

行动	捷径
撤销上一步操作	Ctrl+Z
重做操作	Ctrl+Y
复制元素	Ctrl+C
粘贴元素	Ctrl+V
群组元素	Ctrl+G
取消分组元素	Ctrl+Shift+G
重复元素	Ctrl+D
删除元素	删除键

大多数人错过的隐藏功能

• 屏幕边框功能： 您可以使用屏幕框架功能，在特定视口或屏幕尺寸上随意排列和控制元素，非常适合移动版本自定义。
• HTML/CSS 插入： 对于高级用户，可以直接在编辑器中插入 HTML 和 CSS 代码以实现自定义功能。
• 响应式自动调整大小： Siter 具有内置的响应式功能，当视口或屏幕断点触发时，会自动调整网页元素的大小。
• 创建下拉菜单： 通过对菜单项进行分组并设置悬停触发器，轻松创建导航下拉菜单。

避免常见的网站错误

错误一：忽略移动端设计

错误二：未测试响应式设计

错误三：忘记设置自定义字体

Siter故障排除

问题：检索共享信息时发生错误

原因： 这通常发生在浏览器 cookie 被阻止或网络连接不稳定时。

使固定： 请稍后再试，或清除浏览器缓存和cookies，然后刷新页面。

问题：元素未正确对齐

原因： 您可能正在使用与预期不同的屏幕断点。

使固定： 检查编辑器顶部的屏幕选择器，确保您位于正确的视口。

问题：发布按钮无法正常工作

原因： 您可能没有付费套餐，或者尚未连接您的域名。

使固定： 升级到 Solo 套餐（7 美元/月），即可连接您的自定义域名并发布上线内容。

问题：Figma插件无法导出

原因： Figma 设计中存在复杂的效果或不支持的元素。

使固定： 导出前，通过扁平化效果和使用标准元素来简化您的设计。

📌 笔记： 如果以上方法均无法解决您的问题，请联系 Siter 支持团队——他们在工作日回复迅速。

Siter是什么？

西特 是一款无需代码即可创建和发布专业网站的工具，无需任何编码技能。

这段平台介绍说明了为什么成千上万的设计师和初学者选择 Siter。

你可以把它想象成一个设计平台，你创建的内容就会完全呈现给访客。

观看这段快速概览：

它包含以下主要特点：

• 表单集合： 通过轻松创建表单，直接从您的网站获取潜在客户和用户反馈。
• 首页： 使用简单的拖放界面即可构建高转化率页面。
• 嵌入式视频和本地视频： 添加视频内容，吸引访客，并以可视化的方式阐释您的想法。
• 直观的设计工具： 使用浏览器中的可视化编辑器创建网站——无需编写代码。
• 分组和图层： 整理各个元素，以便于编辑和管理复杂项目。
• Figma插件： 导入您的 Figma 设计，即可立即将其转换为可运行的网站。
• 可自定义地图： 添加交互式位置数据，帮助访客找到您的商家。
• 自定义链接： 轻松连接页面、触发叠加层和链接外部资源。
• 响应式设计： 构建能够自动适应特定屏幕或设备的网站。

Siter通常会提供免费试用或基本免费计划，供用户探索平台。

如需完整评测，请参阅我们的 Siter 评论.

站点定价

以下是 Siter 在 2026 年的成本：

计划	价格	最适合
自由的	自由的	初学者可以探索网站搭建，网站数量不限，最多可创建 10 个页面。
独奏	每月7美元	需要自定义域名的个人 SEO 一个网站的功能
加	每月12美元	自由职业者 可管理最多 3 个网站，包含 4 名编辑人员。
专业版	每月 24 美元	需要无限页面、表单和 HTML 下载功能的机构

免费试用： 是的——免费套餐不限页数，最多可包含 10 页和 3 个表单。

退款保证： 如有退款疑问，请联系客服。

💰 性价比最高： Solo 套餐每月 7 美元——包含自定义域名、SEO 功能以及大多数用户创建网站所需的一切。

Siter 与其他方案

Siter 与其他竞争对手相比如何？以下是竞争格局：

工具	最适合	价格	等级
西特	希望集成 Figma 的设计师	每月7美元	⭐ 4.5
伽马	人工智能驱动 演示文稿 和网站	每月 8 美元	⭐ 4.6
耐用的	几秒钟内即可生成人工智能网站	每月 12 美元	⭐ 4.3
胡桃	快速构建的AI商业网站	每月 19 美元	⭐ 4.2
代码设计	设计到编码的工作流程	每月15美元	⭐ 4.1
10Web	WordPress AI 构建	每月10美元	⭐ 4.4
框架	高级网页动画	每月 5 美元	⭐ 4.7
多里克	简单的无代码网站	每月9美元	⭐ 4.3
Typedream	Notion风格的页面构建	每月 12 美元	⭐ 4.2
吉姆多	适合初学者的网站	每月9美元	⭐ 4.0
B12	服务企业	每月 35 美元	⭐ 4.4
苹果派	应用程序和网站建设	每月18美元	⭐ 3.9

快速精选：

• 综合最佳： Siter——完美平衡了设计自由度、Figma 集成和合理的价格。
• 最佳预算： Framer——每月仅需5美元起，拥有强大的动画功能。
• 最适合初学者： Jimdo——使用极其简单，并提供引导式设置。
• 最适合人工智能生成： 持久耐用——不到一分钟即可创建完整的网站。

🎯 Siter 替代方案

正在寻找 Siter 的替代方案？以下是一些最佳选择：

• 🚀 伽马： 人工智能驱动的平台，可根据简单的提示创建演示文稿和网站——非常适合快速创建内容。
• 💰 耐用的： 内置人工智能网站构建器，可在几秒钟内生成完整的企业网站 客户关系管理 以及发票工具。
• 🎨 奶油南瓜： 一款可根据文本描述构建专业网站的人工智能工具——非常适合非设计师使用。
• ⚡ 代码设计： 一个设计到编码的平台，可为开发人员导出简洁的 HTML 和 CSS 代码。
• 🔒 10Web： AI WordPress 建站工具，可自动创建和托管精美的 WordPress 网站。
• 🧠 菠萝建造者： 专注于简单人工智能网站工具 小型企业 需要快速见效的业主。
• 👶 框架： 一款面向创意团队的专业设计工具，具备高级动画和交互功能。
• 🏢 多里克： 简洁的无代码建站工具，提供白标选项，适用于代理商和自由职业者。
• 🔧 Typedream： 类似 Notion 的界面，让页面构建感觉既熟悉又简单。
• 🌟 Jimdo： 面向初学者的友好型建站工具，配备人工智能辅助功能，方便初次创建网站的用户。
• ⭐ B12： 专为服务型企业设计的AI平台，内置客户端工具。
• 🎯 Appy Pie： 用于构建网站、应用程序和 聊天机器人 无需代码。

完整列表请参见我们的 Siter 的替代方案 指导。

⚔️ 站点比较

以下是 Siter 与各竞争对手的对比情况：

• Siter vs Gamma: Siter 的自由手绘编辑器提供了更强的设计控制能力，而 Gamma 则擅长 AI 生成的演示文稿——选择 Siter 进行自定义设计。
• Siter vs Durable: Durable 利用 AI 更快地构建网站，但 Siter 提供像素级精确的设计控制——Siter 更受设计师青睐。
• 西特尔 vs 胡桃: Butternut 完全由人工智能驱动，而 Siter 需要手动设计——如果你想要创作自由，请选择 Siter。
• Siter vs CodeDesign: CodeDesign 为开发人员导出更简洁的代码，但 Siter 的 Figma 插件使设计师的工作流程更加流畅。
• Siter vs 10Web: 10Web 专注于 WordPress，而 Siter 则独立托管——对于非 WordPress 用户来说，Siter 更合适。
• Siter vs Pineapple Builder: 两者都以简洁为目标，但 Siter 提供了更高级的设计功能和 Figma 集成。
• Siter vs Framer: Framer 的动画效果更出色，但学习曲线更陡峭——Siter 更适合快速项目。
• 赛特对阵多里克: 两者都是优秀的无代码工具——Siter 的 Figma 插件为 Figma 用户带来了优势。
• Siter vs Typedream： Typedream 感觉像是 概念 Siter 的使用体验与 Figma 类似——您可以根据自己的工作流程进行选择。
• Siter 对阵 Jimdo: Jimdo 对完全的初学者来说更简单，但 Siter 提供了更大的设计灵活性。
• Siter vs B12: B12 包含面向服务型企业的客户管理工具——而 Siter 更适合纯粹的网站设计。
• Siter vs Appy Pie: Appy Pie 涵盖的范围更广（应用程序、聊天机器人），但 Siter 提供更优越的网站设计体验。

立即开始使用 Siter

你已经学会了如何使用 Siter 的所有主要功能：

• ✅ 表单集合
• ✅ 着陆页
• ✅ 嵌入式和本地视频
• ✅ 直观的设计工具
• ✅ 分组和图层
• ✅ Figma 插件
• ✅ 可自定义地图
• ✅ 自定义链接

下一步： 选择一项功能，立即试用。

总之，Siter 让任何人都能轻松搭建网站。

大多数人都是从直观设计工具开始的。

上手建站只需不到5分钟。

本指南会定期更新，以反映 Siter 的最新功能。

常见问题解答

Siter IO 靠谱吗？

是的，Siter.io 是一个合法的无代码网站搭建工具，由 Designmodo 公司开发。Designmodo 是一家位于纽约的公司，自 2010 年以来一直致力于开发设计工具。成千上万的设计师和企业家使用该平台创建专业网站，而无需任何编码技能。

Siter IO 的工作原理是什么？

Siter 的工作原理是让您直接在浏览器中使用拖放界面进行设计。您可以创建元素，自由地将它们放置在屏幕上，并对所有元素进行视觉自定义。该平台还提供 Figma 插件，允许您导入 Figma 设计并将其转换为可运行的网站。

Siter IO 的价格是多少？

Siter 提供免费套餐，可创建无限数量的网站，最多 10 个页面。付费套餐起价分别为：Solo 套餐（1 个网站，带自定义域名）每月 7 美元；Plus 套餐（3 个网站）每月 12 美元；Pro 套餐（5 个网站，页面数量不限）每月 24 美元。年付可享更多优惠。

Siter是什么？

Siter 是一款无需代码的网站搭建工具，专为希望在没有任何编程知识的情况下创建专业网站的设计师和初学者而设计。该平台提供自由手绘设计工具、Figma 集成、响应式设计功能以及内置 SSL 证书的托管服务。

哪款网站搭建工具被认为是最好的？

最佳网站搭建工具取决于您的需求。对于需要 Figma 集成和自由手绘设计的设计师来说，Siter 是一个绝佳的选择。如果需要 AI 驱动的网站生成功能，可以考虑 Durable 或 Gamma。对于 WordPress 用户，10Web 也非常适用。Siter 的优势在于其简洁性和设计自由度。

哪款网站搭建工具最适合新手？

Siter 是最适合初学者使用的网站搭建工具之一，因为它无需任何编程技能，并且采用简单的拖放式界面。该平台专为没有网站建设经验的用户设计，并包含预先设计好的模板，可简化创建过程。

Siter IO是免费的吗？

是的，Siter 提供免费套餐，包含无限网站数量、每个网站最多 10 个页面和 3 个表单。免费套餐允许您设计和预览网站，但您需要付费套餐（起价 7 美元/月）才能连接自定义域名并发布网站。

Siter IO好用吗？

是的，Siter 的评分高达 4.5/5，其直观的设计工具、出色的 Figma 插件和响应迅速的客户支持备受赞誉。用户欣赏其自由手绘的设计方式以及轻松构建专业网站的功能。对于熟悉 Figma 的设计师来说，它尤其适用。

一个50页的网站要多少钱？

使用 Siter，一个 50 页的网站，Plus 套餐每月只需 12 美元（包含最多 50 页），Pro 套餐每月只需 24 美元（页面数量不限）。相比之下，聘请开发人员搭建一个 50 页的网站可能需要花费 2,000 到 10,000 美元。因此，对于大规模网站建设而言，Siter 的价格优势显而易见。

价格合理的网站搭建工具有哪些？

Siter 是市面上价格最合理的网站搭建工具之一，其 Solo 套餐每月仅需 7 美元。该套餐包含自定义域名、SSL 证书、SEO 功能和网站托管。相比之下，其他竞争对手提供类似功能，每月收费却高达 15-30 美元，Siter 的性价比非常高。

如何在 Figma 中使用 Siter IO？

从 Figma 社区安装 Siter.io Figma 插件。打开您的设计，运行插件，选择要导出的框架，然后点击导出。您的 Figma 设计将转换为 Siter 中可编辑的网页，然后您可以将其发布为可访问的网站。整个过程只需几分钟。

无需编程的最佳免费网站搭建工具是什么？

Siter 是设计师们最理想的免费网站搭建工具之一，无需任何编程知识。免费套餐提供完整的网站设计工具，最多可创建 10 个页面。对于初学者来说，Jimdo 也是一个不错的选择。而对于无需编程的 AI 驱动型网站，Durable 和 Gamma 则是绝佳之选。