REF-1 · 视觉参考册 · 2026-08-06

18 个值得抄结构的承包商官网

从线索库 4,493 个抓到截图的站里筛出来的。机器先筛(AI 判过“现代/过时”、体检 A 档、截图完好 → 803 个), 再由人逐张翻完整长截图挑——因为库里没有“设计好不好看”这个分,只判了“是不是老式的”。 每张卡片点开是整站长图,可以直接看跨屏的结构节奏。

截图库
27,465张 · 覆盖 4,493 个站
AI 视觉判定
1,612站 · 只判现代/过时
确定性体检
5,065站 · 技术分不是美学分
人工过眼
48站长图 · 选中 18

一个反直觉的发现:体检分和好看程度几乎不相关。库里 SC 97–99 的那批,视觉上大多是老派红蓝堆盒子—— 分高是因为信息全、有表单、有 FAQ。反过来,下面设计最好的几个站,体检分只有 74–80。 挑参考站不能按分排序,只能看图。

Mink Plumbing 首页长截图
本项目的源

THE Mink Plumbing · Tyler, TX

1,575 条评价 · 体检 79 · AI 把它判成了 dated(理由:高饱和色条、渐变立体按钮、描边阴影,2010s 风格)。

这跟 NOTES.md 的结论并不矛盾——机器判的是细节工艺(渐变、阴影、描边), REF-1 提取的是材质与版面(纸纹/沥青纹的底、母题的三次出现、4.5× 字阶)。同一个站,两层东西,分开看。

下面按视觉语言分四类,第一类跟 Mink 是同一路子但做得更狠。

01 / 04

品牌母题型

有自己的一套视觉符号(吉祥物、复古徽章、专属配色),整站被这套符号串起来。最难抄,也最值钱——客户不会觉得在哪见过。

5 个站

Reliant Plumbing

Austin, TX 2,900 条评价 体检 80

奶油米底 + 深蓝 + 复古徽章。整站不用白灰交替盒子,底色一路暖着走,靠色温而不是分割线换段。

偷这个:整站换一个非白的底色。成本极低、观感提升最大——跟 NOTES 里 "no flat grounds" 是同一件事的另一半。

reliantplumbing.com ↗

Willard Heating, Cooling & Plumbing

Forney, TX 6,209 条评价 体检 85

复古地精吉祥物 + 粗衬线 + 红/墨绿。文案跟母题咬合(“Anything But Garden-Variety”),吉祥物在页面里反复出现。

偷这个:一个角色形象 + 一句只有他能说的话,贯穿首屏、服务区、页脚。这是 motif 层能吃下的第四种母题。

willardac.com ↗

Village Plumbing, Air & Electric

Houston, TX 10,035 条评价 体检 84

复古 pin-up 插画 + 橙黄/藏蓝,1946 老牌的怀旧感做成了资产。手绘 “callback” 手写体点缀。

偷这个:老牌客户别做成科技风,把年份变成插画风格。插画还能补上摄影缺口。

villageplumbing.com ↗

Bacon Plumbing Heating Air Electric

Rockwall, TX 7,251 条评价 体检 97

黑 + 深红的暗调,几乎没有白底段落。品牌名本身就是记忆点,视觉不抢戏、只做衬托。

偷这个:暗底整站。同行 95% 是白底蓝字,暗底本身就是差异化——motif-ink 已经有了,缺的是敢全用。

everyonelovesbacon.com ↗

Elmer's Home Services

San Antonio, TX 7,541 条评价 体检 88

粉 / 深蓝撞色 + 大圆角卡片 + 手绘感优惠券。跟 Mink 是同一个气质,但配色更狠、卡片系统更整齐。

偷这个:优惠券做成实体券的样子(虚线边、价格超大),比一行文字 CTA 好用得多。可直接进 bv-motifs。

elmershomeservices.com ↗

02 / 04

编辑排版型

靠字体、留白和栏宽撑住,几乎不靠图。看着像杂志内页而不是承包商官网。摄影还没到位时,这条路最省。

3 个站

Berrett Home Services

Dallas, TX 2,815 条评价 体检 80

淡青 + 米色,衬线大标题,大段留白。“The stakes are too high to hope for the best.” 这种句子被排成了主视觉。

偷这个:把一句狠话排成整屏,不配图。这是 REF-1 那条 “photography is the highest-value gap” 的临时解。

berretthomeservices.com ↗

ABC Home & Commercial

Austin, TX 5,029 条评价 体检 80

米色底 + 衬线标题 + 双栏正文,段落带小标题,读起来像长文报道。老牌家族企业的叙事被当内容做。

偷这个:About / 团队页别做卡片墙,做成一篇能读的文章。

abchomeandcommercial.com ↗

Air & Energy

Bradenton, FL 3,229 条评价 体检 77

蓝色几何色块拼贴,“Four trades. One company.” 四个业务做成四个方块,一眼说清业务结构。

偷这个:多业务线客户,用色块拼贴代替图标列表。

airandenergy.biz ↗

03 / 04

暗色电影型

首屏一张暗调大图或视频 + 极简大字,下面才开始常规内容。首屏做气氛,转化交给第二屏。

5 个站

Air Repair Pros

Frisco, TX 4,836 条评价 体检 74

暗色人物特写压得很低,白字细体压在图上,“Comfort You Can Count On.” 只有两个按钮。

偷这个:首屏只留标题 + 两个按钮,别塞表单。

airrepairpros.com ↗

Medley Heating, AC & Plumbing

Carrollton, TX 1,759 条评价 体检 96

夜景视频首屏,红光扫过。整屏几乎没有信息,只有一句话和一个按钮。

偷这个:视频首屏必须配暗色遮罩,否则字读不了——他们的遮罩浓度值得量一下再抄。

callmedley.com ↗

Lex's Plumbing

Frisco, TX 978 条评价 体检 96

全屏工程车 + 老板本人站位,电话号码做成红色大按钮直接压在图上。小公司也能撑住场面。

偷这个:小客户没素材时,一张站在车前的照片就够做首屏。

lexsplumbing.com ↗

Miller and Sons Plumbing

Ocala, FL 2,382 条评价 体检 74

暗色车厢特写 + 细体大字,“Putting You At Ease With Your Plumbing Needs”。质感偏冷静克制。

偷这个:细字重大标题(300–400)压暗图,比粗体更贵气。Switzer 可变字体正好能开到这个重量。

millerandsonsplumbing.net ↗

Mansfield Plumbing, Electric, Heating & Air

Mansfield, TX 3,263 条评价 体检 93

青绿色调的门廊全屏照 + 手写体 “Your Neighborhood”,把“邻居”这个定位做成了画面。

偷这个:手写体只用一个词,做定位词的强调,别整段用。

mansfieldtxplumbing.com ↗

04 / 04

干净现代型

白底、卡片、圆角、图标——最容易做,也最容易撞脸。这几个是里面做得最不像模板的,可以当安全牌。

5 个站

Weeks Service Company

League City, TX 5,403 条评价 体检 79

暖米底而不是纯白,工程车照片压成横条,图标区规整。整体节奏松、不挤。

偷这个:把纯白 #fff 换成暖米 #faf7f2,什么都不改,档次立刻不一样。

weeksservicecompany.com ↗

Rescue Air and Plumbing

Dallas, TX 3,868 条评价 体检 95

全宽街景大图 + 心电图红线做分隔,三卡片布局干净,深蓝表单块收得住。

偷这个:用一根有含义的线(心电图 / 管道线)做 section 分隔——Curve.astro 的 bite 参数可以直接长出这个变体。

rescueairtx.com ↗

Sunrise Plumbing

Rockwall, TX 1,618 条评价 体检 98

青绿 + 深色摄影,团队照当满屏背景,“The Sunrise Standard” 四条价值观排成一栏。

偷这个:价值观段落用真人合照当底图,比图标卡片可信。

sunriseplumbingtexas.com ↗

Chris' Plumbing

Weatherford, TX 1,291 条评价 体检 98

暖调生活照(爸爸和孩子洗手)+ 黑色卡片表单并排。“Gotta Bad Leak, We’ll Fix It!” 口语化标题。

偷这个:生活场景照 > 工具照。买家是家里的女主人,不是同行。

chrisplumbingtx.com ↗

Culligan of DFW

Irving, TX 3,239 条评价 体检 50

全国连锁的模板,但产品卡、评价栏、蓝色波浪块做得非常干净。注意它体检分只有 50——好看不等于分高。

偷这个:产品 / 套餐卡片的排法。这是电商级做法,本地承包商很少用。

dallasculligan.com ↗
整站长截图