跳到内容

看哪里 点右上角「显示网格」,红色的栏会显示出来:标题、照片、编号和作品列表的边缘都对齐在栏线上。标题巨大而紧凑,小字信息排成一行一行的表格感;悬停作品名时右侧照片和编号同步切换

这是什么

瑞士网格网页把 1950 年代瑞士国际主义平面设计带到屏幕:严格的多栏网格、左对齐的无衬线字、巨大的标题和小字之间的强烈对比、编号和细线,配色常是黑白加一种红。网格不只是隐形的辅助线,元素的位置都由它决定

也叫瑞士风网页国际主义网页网格系统Swiss Style WebGrid System

关键特征

缺了就不像
严格多栏网格左对齐无衬线大标题大小字强烈对比
加了更像
红黑白配色编号与细线不对称版面

容易混淆

瑞士网格网页Swiss Grid Web Design

严格的多栏网格、左对齐巨大无衬线标题、红黑白配色和编号

你可能会说

  • 很理性很整齐的网格网页
  • 巨大的黑色字加一点红
  • 像设计学院的作品集

适合用在

  • 设计师、建筑师和摄影师作品集
  • 展览、讲座和文化机构网页
  • 视频里的数据、标题排版,需要理性和秩序感

这样描述给 AI

做一个瑞士国际主义网格风格(Swiss Grid)的个人作品集首页:浅灰白 #f4f4f0 背景,12 栏网格、统一栏间距;顶部一条 2px 黑线上方是四组小字信息,各占 3 栏;左侧 7 栏放超大号紧凑的 Helvetica/黑体粗体标题「城市之光.」,句点是红色 #e30613;右侧 5 栏放一张 4:3 照片和带红色编号的小字图注;底部一条黑线下按 4 列排作品编号、时间和名字,悬停时编号变红、出现箭头;全部左对齐,没有圆角和阴影