品牌设计机构 Astro 网站模板 | Nova – 英波双语单页与案例展示

Nova 是一套面向品牌设计工作室、网站制作团队和数字服务机构的 Astro 网站模板。首屏由米白底色、黑色大标题和不规则人物图片组成,向下串起案例、服务、团队、常见问题与客户评价,并提供英语、波兰语两套内容入口。

Nova 网站模板的浅色首屏、异形人物图片与品牌展示布局

适合把少量代表案例和服务讲清楚的机构官网。 首页有两张重点项目卡片、四项服务和一个集中的联系入口,内容规模比较克制。若计划给每项服务、每个案例都建立独立详情页,还需要继续扩展路由和内容结构。

首页的业务展开方式

首屏先给出品牌主张和两个行动按钮,客户标志与数字统计紧随其后;接着展示作品、介绍服务和团队,最后引导读者到页脚的项目合作入口。读者可以顺着页面浏览,也能从顶部导航直接跳到相应区域。

页面区域现有内容替换重点
品牌首屏大标题、人物图、双按钮、客户标志与统计主打服务、人物照片、真实业绩
代表案例网站与品牌设计两个示例项目项目图片、类别与名称
服务与团队四项编号服务、团队照片、成员头像服务范围、人员资料与合作方式
常见问题与评价四组问答、三条客户评价项目流程、交付口径与真实反馈
合作入口山景背景、合作文案、按钮和法律链接联系方式与实际询盘去向

这是一套双语单页官网。当前构建共输出 7 个 HTML:英文首页、波兰语首页、两种语言各自的隐私政策与 Cookie 页面,以及一个 404 页。服务、作品和团队都在首页内,没有现成的案例详情页或独立服务页。

浅色版面的用图重点

Nova 的底色偏暖,标题以黑色为主,少量棕色用于强调词和按钮。正文与标题都采用 Satoshi 无衬线字体,圆角按钮和较大的区域间距让页面显得舒展。它更依赖照片的构图和内容质量,而不是装饰图标的数量。

首屏人物图放在不规则轮廓中,右侧和下方会随容器裁切。换图时最好让人脸和主要动作靠近画面中部,并留出周围背景;直接换成横向多人合照,容易把边缘人物截掉。下方项目图则适合放网站画面、品牌物料或完整作品场景,让两个案例各自有明确主题。

页面中的客户标志、项目统计、团队成员和评价均为示例。尤其是首屏的大数字很醒目,应与真实业务情况一起替换;没有可公开的数据时,删去相应统计项也比保留示例数值合适。

双语内容从哪里改

首页文案优先修改 src/data/i18n/nova.json。 这个文件集中存放 en、pl 两套首屏、导航、案例、服务、团队、问答和页脚内容。只改 src/data/sections/ 下的通用区块 JSON,Nova 首页的对应文案可能仍会被双语配置覆盖。

  • 改文案与菜单:从 src/data/i18n/nova.json 入手,同步检查按钮文字、锚点和页脚链接;英语首页也保留了部分波兰语区块 ID,改菜单文字时不必改这些 ID。
  • 换照片与项目图:主要素材在 public/assets/images/t001-nova/,替换文件时保持图片路径一致,再查看首屏裁切和案例图的显示比例。
  • 改配色与字体:主题变量在 src/styles/themes.css,全局样式在 src/styles/global.css;修改背景、强调色和字体后应重新构建。
  • 调整首页区域:src/data/pages/index.json 决定区块的选择与顺序,适合删减不需要的区域或调整服务、团队等内容的位置。
  • 改公司与站点信息:检查 src/data/global/company.json、src/data/global/seo.json 和 site.config.mjs,避免只换首屏名称却留下示例公司或域名。

现有语言入口切换的是英语和波兰语路由,并不包含自动翻译功能。若只做英文站,可以在保留英文内容的同时精简波兰语入口;若改成中英双语,则需要继续修改语言配置和对应路由,不能只把菜单里的“PL”改成“中文”。

构建与联系入口

文件包采用 Astro、React 与 Tailwind CSS,锁文件对应的版本分别是 Astro 7.0.9、React 19.2.5 和 Tailwind CSS 4.3.2。项目要求 Node.js 22.12.0 或以上,可先用 npm ci 安装锁定依赖,再运行 npm run dev 调整页面,最后执行 npm run build 输出静态文件到 dist/。

本次演示已在临时副本中完成生产构建,并适配到子目录。包内构建脚本会按 BUILD_SCOPE 裁剪页面,博客和组件预览文件没有进入这次的 7 页产物;目录里有相关文件,不等于成品已经提供对应栏目。演示适配还恢复了清理脚本误删的本地字体,原始下载源码保持不变。

首页的菜单锚点、英波语言入口与 FAQ 展开结构已具备;“Start a project”目前跳到页脚合作区域,页脚按钮仍指向同一区域。 正式使用前,应把它接到实际联系页、咨询工具或询盘表单。

包内另有可复用表单组件与 send-form.php 示例,但当前 Nova 首页并未放入完整联系表单。需要邮件询盘时,还要加入表单、配置 PHP 运行环境和 SMTP 等参数;只上传静态产物不会获得邮件投递能力。

品牌设计机构 Astro 网站模板 | Nova – 英波双语单页与案例展示
此内容为付费资源,请付费后查看
M币10
立即购买
您当前未登录!建议登陆后购买,可保存购买订单
模板类型品牌机构双语单页
页面数量7 HTML(含双语/法律页)
技术栈Astro/React/Tailwind
响应式是
授权许可定制许可
下载方式网盘/直链
付费资源
© 版权声明
THE END
喜欢就支持一下吧
点赞8 分享
评论 抢沙发

请登录后发表评论

    暂无评论内容