真实网站 01 · Tobias van Schneider
15 / 33
VANSCHNEIDER.COM · 强品牌型
好：个人气质就是网站的第一视觉。
黑白影像、徽章、字体和项目叙事形成统一世界观；访客还没读完介绍，已经感受到这个人的审美立场。
适合：设计师、创意总监与个人工作室。
品牌感很强，但前提是作品本身足够成熟。普通个人站可以借它的统一气质，不必照搬复杂装饰。
可借：一套稳定的视觉语言、代表项目优先、个人观点贯穿全站。
案例来源：vanschneider.com
15 / 33
真实网站 02 · Bruno Simon
16 / 33
BRUNO-SIMON.COM · 体验作品型
好：网站本身就是能力证明。
访客驾驶一辆小车探索项目，互动方式直接展示创意开发能力；不需要先写一大段“我擅长互动设计”。
提醒：惊喜不能代替清晰。
强互动会增加加载、操作和手机适配难度。只有当体验本身能证明核心能力时，复杂交互才值得。
可借：让展示形式成为证据。不要照搬：为了炫技增加与目标无关的互动。
案例来源：bruno-simon.com
16 / 33
真实网站 03 · Dennis Snellenberg
17 / 33
DENNISSNELLENBERG.COM · 接单作品型
好：身份、作品与联系形成一条直线。
首屏直接说明“设计师与开发者”，随后展示近期项目，结尾明确邀请合作。访客不用猜这个网站希望自己做什么。
适合：自由职业者与服务型个人品牌。
动画让体验更有质感，但信息结构仍然简单：定位、证明、联系。先学这条路线，再决定要不要加动效。
可借：首屏定位、精选项目、显眼联系入口，以及从头到尾一致的动效。
案例来源：dennissnellenberg.com
17 / 33
不知道控件名字 · Name That UI
20 / 33
NAMETHATUI.COM · 控件词典
先说现象，再拿到正确名称。
- 用大白话描述：“轮播图下面那几个小圆点”。
- 如果中文搜不到，让 AI 翻成简单英文再粘贴。
- 查看结果里的正式名称、用途和示例。
- 复制它给出的提示，再补上你的页面目的。
示例：“请在案例轮播下加入 Pagination Dots。当前页明显高亮，支持单击跳转，触控板一次只翻一页。”
入口：https://namethatui.com/
知识库方法落地：大白话 → 正确名称 → 可执行提示
20 / 33
不知道风格名字 · StyleKit
21 / 33
STYLEKIT.TOP/ZH · 风格与规则库
先按场景选，再导出规则。
- 先选场景：作品集、博客内容、品牌营销等。
- 只比较 2—3 种风格，记录喜欢与不喜欢的细节。
- 导出 AI 提示或设计规则，不只截一张图。
- 告诉 AI：保留我的内容与结构，只应用这套规则。
不要一句话塞进三种风格。先选一种主风格，再说明按钮、间距、字体和动效如何统一。
入口：https://www.stylekit.top/zh
Design.md 的作用：把选中的风格固化为颜色、字体、间距、组件与文案规则
21 / 33
域名购买 · 阿里云万网
30 / 33
本课统一演示阿里云万网
查询、实名、付款、解析。
01 登录
进入 wanwang.aliyun.com/domain。
进入 wanwang.aliyun.com/domain。
02 实名模板
先完成个人或单位信息审核。
先完成个人或单位信息审核。
03 查询拼写
输入完整名称，确认是否可注册。
输入完整名称，确认是否可注册。
04 选后缀
个人品牌优先看 .com，也可比较 .cn。
个人品牌优先看 .com，也可比较 .cn。
05 核对价格
同时看首年价、续费价和购买年限。
同时看首年价、续费价和购买年限。
06 购买后
进入域名控制台，设置解析与自动续费。
进入域名控制台，设置解析与自动续费。
付款前再查：拼写、实名主体、续费价格和账号双重验证。使用中国内地服务器开办网站，需要先完成 ICP 备案。
官方入口：wanwang.aliyun.com/domain
30 / 33