零代码搭建个人作品集网站：Canva + Carrd 手把手教程（2026版）

Wed, 27 May 2026 00:00:00 +0000

你可能以为建个人网站需要学 HTML/CSS，或者花几百美金找人开发。但在 2026 年，零代码工具已经成熟到可以让零基础的人在 30 分钟内做出一个漂亮的个人作品集网站。

本篇教程用两个工具：Canva（设计素材）+ Carrd（搭建网站），从零开始带你做一个响应式单页作品网站。不需要写一行代码。

准备清单

你需要什么	说明	花费
Canva 账号	用来做 Logo、Banner、作品展示图	Free
Carrd 账号	用来搭建和发布网站	Free（Carrd 域名）/ $19/年（自定义域名）
域名（可选）	比如 `yourname.com`	~$10/年（Namecheap 等）
个人照片 + 作品截图	5-10 张展示你作品的图片	$0
文字内容	个人介绍、项目描述、联系方式等	$0

🔗 注册 Canva（免费开始）→ 🔗 注册 Carrd（免费开始）→

第 1 步：用 Canva 设计素材（15 分钟）

1.1 设计个人头像/Avatar

打开 Canva，搜索"Circle Profile Photo"模板：

选择「Create a design」→ 搜索「Logo」→ 选 500×500 px
上传你的个人照片
在左侧「Elements」里搜「Circle Frame」，把照片放入圆形框架
如果需要，加一个背景色或渐变
导出为 PNG（透明背景）→ 保存到本地

💡 Canva Pro 用户（$12.99/月）可以用 Magic Studio 一键去背景，效果很好。

这是用户打开网站最先看到的部分，第一印象最重要。

Canva 里「Create a design」→ 选「Desktop Wallpaper」（1920×1080 px）
背景：用渐变色（Element → Gradients）或简单的几何图案，不要放照片以免和文字冲突
放上你的名字 + 一句话简介，字体建议用 Inter / Montserrat （免费字体）
导出为 JPG

1.3 设计作品展示卡片

如果你有 3-5 个项目要展示，给每个项目做一张统一风格的卡片：

Canva「Create a design」→ 选 800×600 px
统一使用相同的布局：项目截图 + 项目名称 + 简短描述
保持风格一致：相同的字体、配色、圆角、间距
导出为 PNG

完成以上三步后，你应该有：

1 张头像 PNG
1 张 Hero Banner JPG
3-5 张作品卡片 PNG

第 2 步：用 Carrd 搭建网站（15 分钟）

Carrd 是目前最简洁的单页网站搭建工具。2026 年 Carrd 依然保持着极致简约的设计哲学——一切都在一个页面里完成。

2.1 选择模板

登录 Carrd
点击「New Site」→「Start from a Template」
在模板分类里选「Portfolio」
推荐「Paradigm」或「Momentum」模板——适合展示个人作品

2.2 设置页面样式

进入编辑器后，首先设置全局样式：

设置项	推荐值
Canvas 宽度	960px
背景色	#FAFAFA 或 #FFFFFF
主色调	选一个品牌色（如 #4F46E5 Indigo）
字体	标题用 Bold，正文用 Regular
圆角	12-16px（现代感）

2.3 添加各板块

Carrd 使用「Section + Element」的模式。按以下结构添加：

Section 1：Hero（顶部）

Element → Image：上传 Hero Banner
Element → Text：你的名字（H1，大号）
Element → Text：一句话简介（副标题）
Element → Button：链接到作品区或联系你

Section 2：About（关于我）

Element → Image：上传头像
Element → Text：3-5 句自我介绍
Element → Icons（可选）：GitHub / LinkedIn / Twitter 链接

Section 3：Portfolio（作品展示）

Element → Columns：创建 2-3 列布局
每列：Image（作品卡片）+ Text（项目名称）+ Text（描述）+ Button（查看详情链接）

Section 4：Contact（联系方式）

Element → Form：如果你需要收集访客邮箱
Element → Text：邮箱地址
Element → Icons：社交媒体链接

2.4 发布网站

点击右上角「Publish」
选择 URL：免费版用 yourname.carrd.co，Pro 版可以绑自定义域名
设置 SEO Title 和 Description
点击「Publish」

完成！你的个人作品网站已经上线了。🌐

第 3 步：进阶优化（可选）

绑定自定义域名

如果你有自己的域名（如 yourname.com），Carrd Pro ($19/年) 支持绑定：

Carrd 内设置 → Custom Domains
添加你的域名
在域名注册商（如 Namecheap）添加 Carrd 给的 DNS 记录
等待 DNS 生效（通常 5-30 分钟）

$19/年 = 一个月不到 $1.6，强烈推荐，让网站看起来更专业。

添加 Google Analytics

Carrd Pro 支持嵌入代码：

注册 Google Analytics 账号，获取 Measurement ID
Carrd 设置 → Advanced → Custom Code → Head
粘贴 GA 跟踪代码
保存后就能看到访客数据

添加表单收集线索

如果你想收集访客邮箱（比如"获取我的简历 PDF"），Carrd 内置了表单功能，可以连接到 Google Sheets、Mailchimp、或者 Zapier 做自动化。

💡 设计建议（来自做了 100+ 个 Carrd 页面的经验）

少即是多。 单页网站最好的作品集通常只有 4-5 个板块。越多越乱。
配色不超过 3 个。 主色 + 辅助色 + 中性色（灰/白）。不要五颜六色。
字体不超过 2 个。 标题一个、正文一个。Carrd 内置了 Google Fonts。
手机优先。 Carrd 会自动适配移动端，但发布前一定用手机打开检查一下排版。
CTA 清晰。 每个页面应该有一个明确的 Call-to-Action（查看我的作品/下载简历/发邮件给我）。

工具	用途	价格
Notion	当作品集管理后台，记录每个项目的详情	Free
Figma	做更精细的视觉设计（比 Canva 更专业）	Free
Google Analytics	追踪网站流量	Free
Typeform	做更漂亮的联系表单（替代 Carrd 内置表单）	Free（10 个问题/月）

常见问题

Q: Canva 免费版够用吗？

A: 做个人作品集完全够用。免费版有 250,000+ 模板、5GB 云存储、基础 AI 功能（去背景每天有限额）。Pro 版 ($12.99/月) 多了 Magic Studio 全套 AI 工具、品牌套件、1TB 存储，适合频繁做图的设计师。

Q: Carrd 免费版和 Pro 的区别？

A: 免费版支持无限网站，但只能用 xxx.carrd.co 子域名。Pro ($19/年) 支持自定义域名、表单、嵌入代码、Google Analytics、去除 Carrd 水印。$19/年很良心。

Q: 我可以用这个网站找工作吗？

A: 完全可以！很多设计师和开发者的个人作品集就是用 Carrd 做的。只要内容好，HR 不会在意你用什么工具搭的网站。

Q: 能不用 Canva 吗？用 Figma 代替行吗？

A: 完全可以。Figma 更适合有设计基础的用户，Canva 更适合完全没有设计经验的新手。两个工具的免费版都够做素材。

Q: 网站加载速度快吗？

A: Carrd 的网站加载速度非常快，全球 CDN 分发。你上传的图片大小控制在 500KB 以内就好。

总结：30 分钟 = 一个专业个人网站

步骤	工具	时间	花费
1. 设计素材	Canva	15 分钟	Free
2. 搭建网站	Carrd	15 分钟	Free / $19/年
3. 绑定域名	Carrd Pro	5 分钟	~$10/年（域名费）
总计		~35 分钟	$19-29/年

如果你一直拖着没做个人网站，现在就是最好的时机。花一个午休的时间，你就能拥有一个专业、好看、能打的作品集。

Disclaimer: Some links are affiliate links. We may earn a commission at no extra cost to you. Prices and features are accurate as of May 2026 and may change.

作品集 on 诚实雷达