个人作品集站有个常见误区:页面越堆越多,反而让人找不到重点。这套个人作品集 HTML 网站模板走的是相反的路子——整站只有 12 个页面,7.2 MB,但该有的都有:关于我、服务能力、服务详情、项目集、项目详情、报价、常见问题、博客、联系。首屏直接亮出身份定位与一句话主张,导航右侧是「Hire Me」接单按钮,路径短得没有多余动作。中段有一片技能标签区,把交互设计、用户体验、线框图、前端开发这些能力项平铺出来,比一堆百分比进度条更实在。报价页把不同合作方式分档写清,这对独立接单的人来说能省掉大量前期沟通。两套首页可切换气质。这套结构不限于产品设计师,UI 与平面设计师、摄影师、插画师、自由开发者、文案与译者、独立顾问,凡是「一个人接活」的职业都能直接用。
核心功能
接单按钮常驻导航:从任意页面一键进入洽谈,转化路径极短
技能标签区:能力项平铺展示,比进度条更适合表达跨领域能力
项目集与详情页:作品可分类陈列,单个项目支持完整案例叙述
服务详情页:把每项服务的交付内容与流程写清楚
合作报价页:按项目制、月度驻场等方式分档,前置价格预期
两套首页:不同的首屏排版,可按接单方向切换
常见问题页:交付周期、改稿次数、版权归属这类问题可提前回答
博客模块:观点内容有独立位置,利于建立个人专业形象
页面与技术规格
共 12 个 HTML 页面,含 2 套首页,资源包约 7.2 MB / 109 个文件,是本批体积最小的完整站点
基于
Bootstrap 5,栅格与组件为原生用法,改版几乎无学习成本依赖极精简:
GSAP做动效,Slick与Owl Carousel做轮播,WOW.js做滚动浮现没有引入图表、日期、筛选等重型插件,加载负担轻,适合个人站长自行维护
页面少但结构完整,从首屏到成交的链路没有断点