深色科技风好看,但客户的甲方未必买账。艾诺给出的解法是把整站做了两遍——三十一个页面里有十五对是明暗成对的:首页、关于、服务、服务详情、项目、项目详情、团队、团队详情、联系、四套博客列表与三套博客正文,每一页都有对应的浅色版本。提案时要深色、正式上线要浅色,或者按客户偏好整站切换,都不需要重新调色。
内容侧走的是服务定价前置的路线:首页直接把代码与设计、数据分析、内容创作三项服务的起步价标出来,往下接简报分析、原型设计、排版上线三步流程,再接免费、中档、更高档位的订阅定价表。
它基于 Bootstrap 5.1.3 构建,版本在本批中属于偏早的一档,若要接入依赖新版 Bootstrap 的组件需自行升级。
这套结构同样适用于数字营销代理、网页与品牌设计工作室、内容生产团队、SEO 服务商、自动化工具开发、技术外包……凡是「按月订阅或按项目报价、需要同时向创意方和技术方展示、深浅两种基调都要用」的乙方生意都合用。
核心功能
三十一页中有十五对明暗成对,整站可按场景整体切换基调
首页直接标注各项服务的月度起步价,客户在首屏就形成预算预期
订阅定价表从免费档起步,适配低门槛引流加分层付费的模式
简报分析、原型设计、排版上线三步流程,交付节奏前置说明
项目集配分类筛选,创意类与技术类案例可分开归拢
团队与团队详情页,成员推荐位可突出主力顾问
博客四套列表排版加三套正文排版,内容型 SEO 有充足容器
服务与服务详情分层,每项能力都能拥有独立落地页
页面与技术规格
31 个 HTML 页面,其中 15 对为明暗成对版本,实测 165 个文件、7.6 MB
基于 Bootstrap 5.1.3,版本偏早,接入新版组件前需先升级
出场动效走 WOW.js,Swiper 承担主视觉与评价轮播
项目集筛选由 Isotope 驱动,图片放大走 Magnific Popup
下拉选择由 Nice Select 美化,表单在移动端样式统一
明暗两套样式各自独立,切换时无需依赖运行时主题脚本