网站 Banner 图提示语库 v1
产出日期:2026-10-28。用途:给自家官网(智连诺)和客户站生成 banner 图时直接套用的版式提示语,减少"一眼 AI 味"。
方法:基于 ~/workspace/banner-collection/ 的 166 张真实企业站 banner(31 个站点),用拼图方式逐张细看其中 66 张(覆盖全部 31 个站点,每站至少 2 张),逐张拆解构图、配色、字体层级、文案位置与留白、CTA 形式后归纳。
一、素材构成(先摸清样本再谈规律)
- 总量 166 张:次页 124 张(about 63、product 38、news 23)、首页 hero 42 张。
- 行业构成(全是工业 / 科技类 B2B 企业站):LED 显示(奥拓、艾比森、雷曼、联建、强力巨彩)、激光与装备(大族、邦德、宏山、海目星、杰普特、华工、天准)、新能源储能与光伏(嘉立创、AlphaESS、Bluetti、EcoFlow、Jackery、古瑞瓦特、阳光电源)、精密测量与机器视觉(海克斯康、思瑞、凌云光、奥普特)、模具与精密制造(方正模具、横河精密、银宝山新、长盈精密)、阀门(纽威、神通)、机器人与自动化(海康机器人、拓斯达)。
- 对智连诺的适用性:样本没有建站/数字服务同行,迁移时把"产品"换成"终端设备上的网站界面"或"抽象数字单体",版式规律不变(文末试作 2 张已验证这条迁移路线可行)。
二、跨站通用规律(66 张细看后的共性)
- 左右分工是绝对主流:左文案右主体(或右文案左主体)。文字永远压在留白、渐变或半透明色块上,几乎从不直接压在复杂实景照片上——需要压图时,必有一侧做渐隐或斜切色块垫底。
- 配色两大阵营:深蓝/黑底 + 高亮蓝光效 = 工业科技默认色(激光、机器人、测量类几乎全用);白/浅蓝底 = 产品展示与信任类(储能消费品、产品中心)。品牌色(橙、金、红)只做点缀:角标、按钮、关键词、徽章,面积从不超过 15%。
- 字体层级最多三级:大标题(口号或品名,画面最大字)→ 副标/卖点行(小一号)→ 小注(型号、日期地址、数据来源)。特殊处理只有四种:渐变字、描边空心字、巨型字当图形用、单个关键词用异色/金色提亮。
- CTA 克制且只有两种形态:描边胶囊按钮(深色底用,如 AlphaESS 的 "Discover More")或实心圆角矩形 + 箭头(浅底/活动图用,如宏山 "REGISTER YOUR INTEREST >")。文案都是"动词 + 名词"短句:查看更多、了解详情、获取方案。约一半 banner 根本没有 CTA,只有标题。
- 信任背书有固定视觉件:金色奖牌徽章(古瑞瓦特 NO.1 / TOP 3)、巨型描边英文词(AlphaESS 的 TIER 1)、数据来源小字("Source: S&P Global…")、总部建筑实景、世界地图网点。没有真实荣誉时不要编,用建筑实景和数据小字替代。
- 大量 banner 是"底图模式":图本身不带字(纯渐变、抽象科技底、实景照),文字由网页 HTML 叠加。生图复刻这类时,提示语必须明确写"左侧(或一侧)大面积留空、无任何文字",后期再叠字,否则生图工具会自己编字且经常出错。
- 慎用两类:① 价格卡片 + 节日吉祥物的促销型(Bluetti 万圣节款)是消费电商打法,B2B 服务慎用;② 人物图库图(办公人物、登山剪影、灯塔、手捧幼苗)同质化最严重、最容易显假,只适合栏目页凑数,不适合做主视觉。
三、使用说明
- 每条提示语是一个完整模板:把里的变量换成实际内容即可直接喂给生图工具(中文提示语,国内外工具通用)。
- 生成后必查:中文有没有错字/缺笔(本轮试作 2 张均一次写对,但属运气)、徽章里的数字是否准确、界面小字是否糊成乱码(远景小字糊是通病,正式图建议后期用 PS/网页叠字覆盖关键文案)。
- 尺寸建议统一要求宽幅 1920×800 左右(约 21:9),与样本主流比例一致。
四、复刻提示语(共 14 条)
01|左文右物 · 卖点竖列型
- 适用行业/场景:工业设备、仪器、任何"单品讲参数"的产品页主图(次页 product 通栏)。
- 版式结构:深色渐变棚拍背景;左侧约 40% 放标题两行;中间偏右放产品主体(占高约 60%);最右侧竖排 3 条"小图标 + 两行小字"卖点;底部一条反射地面。
- 用词风格:主标题英文口号式、可用斜体 + 品牌色(如 "More Than High Power");副标一行说清品类;卖点小字只写参数事实,不写形容词。
- 代表样本:宏山激光 product-1(www.hsglaser.com)。
- 提示语全文:
宽幅网站横幅图,1920×800,深灰蓝渐变摄影棚背景,底部有微弱反射的深色地面。左侧大标题:第一行是橙色斜体英文口号,第二行是白色常规字体的产品品类名。画面中右部放一台的写实 3D 渲染图,侧面视角,占画面高度约六成,带柔和投影。最右侧竖排三个卖点条目,每条是一个白色线性小图标加两行白色小字,内容依次为。左上角有几道竖向的速度线光效装饰。整体专业、克制、工业科技感,无人物,无其他文字。
02|深色荣誉背书 · 巨型描边字型
- 适用行业/场景:拿到行业排名/奖项/认证时的首页 hero 或品牌页头图;没有真实荣誉不要用(不可编造)。
- 版式结构:黑金或深色渐变底,一道弧形光带横贯下部;左侧文案三段竖排(引子小字 → 加粗核心结论 → 出处一行);右侧一个巨型描边空心英文词/数字当图形,占画面右半。
- 用词风格:结论句式"被评为/入选 + 排名 + 类目",出处必须写真实来源与年份;语气是陈述事实,不喊口号。
- 代表样本:AlphaESS home-1(BNEF TIER 1)。
- 提示语全文:
宽幅网站横幅图,1920×800,深黑棕色渐变背景,一道金色弧形光带从左下向右上横贯画面下部,带柔光反射。左侧文字区:第一行白色小字评选结果,第二行白色特大粗体两行,第三行白色小字,其下方一个白色描边胶囊按钮,按钮文字。右侧是巨大的白色描边空心英文文字,字高占画面一半以上,部分被画面边缘裁切,像图形一样排布。高级、庄重、颁奖感,无人物,无其他文字。
03|实力宣言 · 金色奖牌徽章型 ★已试作
- 适用行业/场景:首页 hero,适合有"年限 / 客户数 / 排名"类硬数字可写的公司(智连诺可用:专注建站 6 年、服务企业 120 余家——均为已核实口径)。
- 版式结构:明亮浅蓝天空底(左上带阳光放射),底部一条城市天际线剪影;左侧大标题(占宽约 50%),标题下方横排 2 枚金色圆形奖牌徽章(上小字下大数字);右侧主体物放在一个金色/浅色展台上。
- 用词风格:标题是"品类 + 地位"宣言句(如"全球领先的 XX 解决方案供应商");徽章只放可核实的数字,图角可加一行极小字注明数据来源。
- 代表样本:古瑞瓦特 home-1。
- 提示语全文:
宽幅网站横幅图,1920×800,浅蓝色天空渐变背景,左上角有柔和的阳光放射光效,底部边缘一条深蓝色城市天际线剪影。左侧:深蓝色特大粗体中文标题,标题下方横排两枚金色圆形奖牌徽章,带麦穗边纹,第一枚上部小字、下部大数字,第二枚上部小字、下部大数字。右侧:一组摆放在一个金色几何展台上,呈阶梯状排列。明亮、专业、可信赖的 B2B 科技风,无人物,无其他文字。
- 智连诺试作:
~/workspace/banner-trials/zln-trial-1-badge-hero.jpg——标题与两枚徽章文字一次写对,设备三件套上金色展台、天际线、阳光位置都对版式。可用作官网主图候选(正式用前建议把屏幕里的小字界面换成真实案例截图叠加)。
04|产品全家福 · 反射展台型
- 适用行业/场景:产品中心页、系列页头图;一款产品有多个型号/尺寸时。
- 版式结构:浅灰蓝雾面渐变背景(或浅天幕 + 远景圆月/光球),产品 5–8 件按高低错落居中成组,下方镜面反射;画面不带字(底图模式),标题由网页叠加。
- 用词风格:图内无文案;若叠字,只叠一行品类总名。
- 代表样本:古瑞瓦特 product-1、AlphaESS product-1、EcoFlow home-1(深色版)。
- 提示语全文:
宽幅网站横幅图,1920×800,浅灰蓝色雾面渐变背景,远景有一个淡淡的圆形光球。画面中央偏右:一组的写实渲染图,共件,尺寸高低错落成梯队排列,全部为配色,站在一层带镜面反射的浅色地面上,倒影清晰柔和。画面左侧三分之一保持干净留白,不放任何元素。整体通透、高级、产品目录感,画面中不要出现任何文字和 logo。
05|白底引线标注型
- 适用行业/场景:产品详情页头图、卖点拆解页;产品有 3–4 个可视化卖点时。
- 版式结构:纯白底;产品居中占高约 70%;左右两侧各放 2 个卖点细节小图(局部特写方图),用细虚线引线连到产品对应部位,小图下方一行小字说明。
- 用词风格:卖点小字是"结构名词 + 参数"(如"2×15W 内嵌音响"),不写营销形容词。
- 代表样本:艾比森 product-1。
- 提示语全文:
宽幅产品说明横幅图,1920×800,纯白色背景。中央是一台的写实渲染图,,占画面高度约七成。产品左右两侧各悬浮两个方形细节特写小图,分别展示,每个小图用一条橙色细虚线引线连接到产品上的对应位置,小图下方各有一行深灰色小字说明,文字依次为。版面干净、电商详情页式的信息图风格,无人物,无其他文字。
- 智连诺试作(第二批):
~/workspace/banner-trials/zln-batch2-05-callout.jpg——主体迁移为"笔记本上的企业官网",四个标注小字(品牌首屏设计 / 产品展示页 / 在线询盘表单 / 多端响应式)全部一次写对,橙色虚线引线对版式;瑕疵是左右两侧的特写卡片被画幅边缘裁切,正式使用需重生成放宽构图或裁图修正;屏幕内网站为生图虚构的演示站界面,正式用应换真实案例截图。
06|浅底几何 · 大标题排版型
- 适用行业/场景:白皮书、方案报告、下载页、栏目封面;没有产品图可放、靠文字撑场面时。
- 版式结构:米白/极浅底;品牌色半透明菱形/三角几何块散布四角,几根细线构成山形或网格暗纹;标题靠右或居中放大,占画面视觉中心;副标一行小字压在标题下。
- 用词风格:标题是完整的主题句(可中英混排),副标写明版本/对象/范围;学术感、报告感,不用感叹号。
- 代表样本:艾比森 home-1(LED 能效白皮书)。
- 提示语全文:
宽幅封面式横幅图,1920×800,米白色背景,四角散布着的半透明菱形几何块,画面下部有几根同色细线条勾勒的抽象山形轮廓。画面中右部:特大号粗体标题两行,下方一行深灰色小字副标题。左半部大面积留白。极简、出版物封面感,无产品图,无人物,无其他文字。
07|白底斜切色带 · 描边按钮型
- 适用行业/场景:产品页、服务页头图,想要轻量、现代、不压抑的感觉时(与深色工业风形成区分)。
- 版式结构:白/浅灰底;右侧一条品牌色大斜切色带贯穿,产品压在斜带上,产品后垫 2–3 层同色线框错位描边;左侧文字:品名(品牌色大字)→ 中文副标(关键词用品牌色)→ 一行三角符号引领的卖点(关键词加粗)→ 描边胶囊按钮。
- 用词风格:卖点用"更 X"比较级短句并排(更强/更广/更高),每条不超过 6 字。
- 代表样本:思瑞测量 home-1(CROMA 三坐标)。
- 提示语全文:
宽幅网站横幅图,1920×800,白色到浅灰的干净背景,右侧有一条的大斜切色带从右上贯穿到右下。一台的写实渲染图放在画面右侧,压在斜色带上,产品身后有两三层同色细线方框错位叠放作装饰。左侧文字区:第一行大号英文字体产品名,第二行深灰色中文大字,第三行三个小三角符号引领的卖点短句,关键词加粗,第四行是一个描边的胶囊按钮,按钮文字。清爽、现代、留白充足,无人物,无其他文字。
- 智连诺试作(第二批):
~/workspace/banner-trials/zln-batch2-07-diagonal.jpg——深蓝斜切色带 + 笔记本压带 + 线框错位描边全部对版式;文字三级(WEBSITE DESIGN / 企业官网定制开发 / 更专业·更出彩·更易获客)与描边胶囊按钮「免费获取方案」一次写对,无错字。可作服务页头图候选。
08|斜切半透明色块 · 实景叠字型
- 适用行业/场景:所有次页通栏(关于/产品/新闻列表页)的万能头图——有真实场景照片、又要压标题时的最稳妥解法。
- 版式结构:全幅实景照片打底;左侧约 45% 盖一层斜切(约 70° 斜边)的品牌色半透明色块;白色标题两行压在色块上,靠左对齐;照片主体(如设备、建筑)露在右侧。
- 用词风格:标题是英文短语或"品类 + 方案"句式,可用斜体增加设计感;只放标题,不放正文和按钮。
- 代表样本:纽威股份 home-1(Complete Solutions for Industrial Valves)。
- 提示语全文:
宽幅网站页头横幅图,1920×800,全幅实景照片:。画面左侧约百分之四十五覆盖一层斜切边的半透明色块,斜边从左上向右下倾斜。色块上靠左对齐白色文字标题两行:,字体略带斜体。照片主体集中在右侧不被遮挡。专业、稳重、企业官网感,无人物特写,无其他文字。
09|活动邀请 · 左侧信息面板型
- 适用行业/场景:展会邀请、门店/展厅开业、发布会、线下活动页。
- 版式结构:左侧约 55% 是品牌色到照片的渐变信息面板:左上角 logo 位置(生图不写 logo,用文字代替),其下特大标题 → 副标 → 两行带小图标的信息(日历图标 + 日期、定位图标 + 地址)→ 实心圆角按钮带 ">";右侧是活动场地/建筑实景照,与面板羽化融合。
- 用词风格:标题用事件名全称大写式排版;信息行只写事实(日期、地址);按钮是明确动作(立即报名/预约参观)。
- 代表样本:宏山激光 home-1(欧洲展厅开业)。
- 提示语全文:
宽幅活动邀请横幅图,1920×800。右侧约一半是实景照片:。左侧是渐变信息面板,与照片羽化融合过渡。面板内自上而下:特大白色粗体标题两行,白色副标题一行,再下面两行带白色小图标的信息行,第一行日历图标加,第二行定位图标加,最下方一个实心亮蓝色圆角矩形按钮,按钮文字为白色。信息层级分明、邀请函气质,无人物,无其他文字。
10|舞台居中 · 活动大标题型
- 适用行业/场景:大型展会参展预告、年会、庆典类活动页;与 09 的区别是这条"图为主角、信息居中",09 是"信息为主角"。
- 版式结构:深蓝科技舞台底(光轨、星点、反射地面);标题居中放大在上部三分之一;标题正下方横排一个蓝色实心小标签(展位号/场次)+ 两行小字(日期、地点);画面下部中央放主体渲染图(展位/产品/建筑)。
- 用词风格:标题用活动全称,不缩写;标签内只放编号类短信息。
- 代表样本:海克斯康 home-1(进博会)。
- 提示语全文:
宽幅活动横幅图,1920×800,深蓝色科技感背景,有流动的光轨线条和细小星点,底部是带倒影的深色镜面地面。画面上部中央:白色特大粗体标题。标题正下方横排一个亮蓝色小长方形标签,标签内白色小字,标签右侧两行白色小字。画面下部中央放的写实渲染图,带蓝色轮廓光。盛大、舞台感,无人物,无其他文字。
11|栏目意象特写型
- 适用行业/场景:新闻中心、资讯、博客等栏目页头图——不需要每篇配图,一张意象图全栏目复用。
- 版式结构:一张有隐喻的特写照片全幅打底(报纸一角、摄像机、键盘手部),整体压暗或加一层品牌色渐变,左侧留出标题区(底图模式,文字网页叠加);构图主体偏右下。
- 用词风格:图内不出现文字(唯一的例外是实物自带的文字,如报纸上的 NEWS);叠字只叠栏目名。
- 代表样本:思瑞测量 news-1(报纸特写)、天准科技 news-1(摄像机)、大族激光 news-1(笔记本手部)。
- 提示语全文:
宽幅栏目页头图,1920×800,一张暗色调的特写摄影:,主体位于画面右侧,整体色调压暗并带一层淡淡的深蓝色渐变。画面左侧三分之一是较暗的平整区域,保持干净,不放任何元素和文字。纪实感、新闻感,无清晰人脸。
12|总部建筑 · 蓝天留白型
- 适用行业/场景:关于我们、公司介绍页头图;传递"真实存在、规模可信",是 B2B 最经典的信任图。
- 版式结构:建筑实景/效果图全幅:主体建筑居中偏右,仰拍或平视,蓝天占画面上半 50% 以上且干净,就是天然的叠字/留白区;地面只占底部一条。
- 用词风格:图内无字;网页叠字时把公司口号放天空区,白色或深色大字一行。
- 代表样本:奥拓电子 about-1、海康机器人 about-1、雷曼光电 about-1、拓斯达 about-1(带左侧蓝渐变版)。
- 提示语全文:
宽幅企业形象横幅图,1920×800,一栋的写实建筑摄影,轻微仰拍视角,建筑位于画面中右侧。画面上半部百分之五十以上是干净通透的蓝天,只有极少量白云,作为大面积留白。地面和绿化只占画面底部一条。阳光明媚、画面明亮,大气、可信赖,画面中不要出现任何文字、招牌字和人物。
13|深色夜光 · 全球布局地图型
- 适用行业/场景:海外业务、全球布局、出口实力类页面(关于/出海业务页);外贸独立站业务尤其合用。
- 版式结构:深海军蓝底;下半部一条弧形地平线上的夜光世界地图(城市灯光点阵),主要市场位置打上白色光点 + 品牌色小标签(国家名);上半部全留白给网页叠字。
- 用词风格:图内标签只写国家/城市名;叠字标题用"全球 / Global"句式。
- 代表样本:邦德激光 home-1。
- 提示语全文:
宽幅网站横幅图,1920×800,深海军蓝色太空感背景。画面下半部是一条弧形地平线上的世界地图夜景,由金色城市灯光点阵组成,各大洲轮廓清晰。地图上在位置各有一个白色发光圆点标记,旁边带一个小小的矩形标签,标签内白色小字写国家名。画面上半部保持干净的深蓝留白。全球化、宏大叙事感,无人物,无其他文字。
- 智连诺试作(第二批):
~/workspace/banner-trials/zln-batch2-13-global-map.jpg——弧形地平线夜光世界地图 + 北美 / 欧洲 / 中东 / 东南亚四处发光标记与英文标签全部正确,上半部深蓝留白干净(底图模式,标题后期网页叠字)。外贸独立站业务页主图候选。
14|黑底发光科技单体 · 大留白型 ★已试作
- 适用行业/场景:首页 hero 的科技感路线;尤其适合没有实体产品的数字服务、软件、IT 公司——用一个发光的抽象单体当主角,替代产品图。
- 版式结构:纯黑底;单个发光 3D 单体(线框立方体、地球、芯片、浏览器窗口、品牌字母)居右或居中偏右,占宽约 35%;左侧 50% 以上纯黑留白放白字标题 + 一行副标 + 描边胶囊按钮;单体下方有镜面反射。
- 用词风格:标题用动词开头的获益句(如"让网站成为获客引擎");副标用"·"分隔的业务清单,一行排完;按钮文案给具体动作(免费获取方案)。
- 代表样本:大族激光 home-1(线框立方体)、联建光电 home-1(发光 logo 体)、海目星 home-1(地球底图)。
- 提示语全文:
宽幅网站主视觉横幅图,1920×800,纯黑色背景。画面右侧:一个由蓝色发光线框构成的 3D 全息单体,带青蓝色辉光,下方有深色镜面反射。画面左侧大面积纯黑留白,自上而下排白色文字:特大粗体标题两行,一行较小的业务清单,一个白色描边的胶囊形按钮,按钮内文字。高级、克制、电影感,无人物,无其他文字。
- 智连诺试作:
~/workspace/banner-trials/zln-trial-2-dark-glow.jpg——线框浏览器窗口 + 地球 + 光轨,左侧标题"让网站成为获客引擎"、业务清单、描边按钮全部一次写对。可直接作官网深色版主图候选。
五、试作小结与待挑事项
- 本轮按第 03、14 条各试生成 1 张(见各条目下),两张的中文标题、徽章数字、按钮文字均一次生成正确,版式与样本的吻合度高,说明"样本反推提示语"这条路可批量复用。
- 两张未做任何后期,未发布、未上正式官网,等用户挑:① 亮色信任版(03)适合官网主站;② 深色科技版(14)适合深色版官网或外贸站。
- 正式使用前建议:关键文案用网页叠字或 PS 覆盖一遍(防生图小字翻车);设备屏幕里的界面换成真实案例截图。
- 第二批(2026-10-28 晚):按第 05、07、13 条各试生成 1 张(见各条目下)。07、13 文字与版式一次到位;05 标注文字全对,但两侧特写卡片被画幅边缘裁切,正式用需重生成或裁图修正。五张试作已一并更新到产出汇总页 out.tryfavs.com 的「Banner 试作图」区。
六、覆盖度备注
- 细看清单:66 张,覆盖全部 31 个来源站点(每站至少 2 张,长盈精密仅 1 张存量即看 1 张),页面类型覆盖 home / about / product / news 四类。
- 未逐张细看的其余 100 张多为同站同版式变体,不影响规律归纳;个别抓取物本身不是设计型 banner(如嘉立创 news-2 实为后台界面截图、邦德 product-1 为近空白底图),已在规律部分按"底图模式"处理,未单独成条。