页面常用布局
注:页面基于WP古腾堡(Gutenberg)编辑器的GreenShift构建
常用1栏布局
分栏占比:1模块宽度:1400px
素材宽度:1500px
常用2栏布局
分栏占比:1/2模块宽度:700px
素材宽度:800px
分栏占比:1/2模块宽度:700px
素材宽度:800px
分栏占比:3/5模块宽度:840px
素材宽度:900px
分栏占比:2/5模块宽度:560px
素材宽度:600px
分栏占比:2/3模块宽度:933px
素材宽度:1000px
分栏占比:1/3模块宽度:467px
素材宽度:500px
分栏占比:3/4模块宽度:1050px
素材宽度:1100px
分栏占比:1/4模块宽度:350px
素材宽度:400px
常用3栏布局
分栏占比:1/3模块宽度:467px
素材宽度:500px
分栏占比:1/3模块宽度:467px
素材宽度:500px
分栏占比:1/3模块宽度:467px
素材宽度:500px
分栏占比:2/4模块宽度:700px
素材宽度:800px
分栏占比:1/4模块宽度:350px
素材宽度:400px
分栏占比:1/4模块宽度:350px
素材宽度:400px
常用4栏布局
分栏占比:1/4模块宽度:350px
素材宽度:400px
分栏占比:1/4模块宽度:350px
素材宽度:400px
分栏占比:1/4模块宽度:350px
素材宽度:400px
分栏占比:1/4模块宽度:350px
素材宽度:400px
常用5栏布局不推荐作内容展示和图标展示,不利于三端适配
分栏占比:1/5模块宽度:280px
素材宽度:300px
分栏占比:1/5模块宽度:280px
素材宽度:300px
分栏占比:1/5模块宽度:280px
素材宽度:300px
分栏占比:1/5模块宽度:280px
素材宽度:300px
分栏占比:1/5模块宽度:280px
素材宽度:300px
常用6栏布局常用于图标展示,不推荐作内容展示
分栏占比:1/6模块宽度:233px
素材宽度:300px
分栏占比:1/6模块宽度:233px
素材宽度:300px
分栏占比:1/6模块宽度:233px
素材宽度:300px
分栏占比:1/6模块宽度:233px
素材宽度:300px
分栏占比:1/6模块宽度:233px
素材宽度:300px
分栏占比:1/6模块宽度:233px
素材宽度:300px
注:
1.【模块宽度】指网页模块的设计宽度(基于页面内容宽度为1400px);
2.【素材宽度】指建议为该模块准备的图片宽度,通常略微大于【模块宽度】,以确保图片清晰(基于页面内容宽度为1400px);
1.【模块宽度】指网页模块的设计宽度(基于页面内容宽度为1400px);
2.【素材宽度】指建议为该模块准备的图片宽度,通常略微大于【模块宽度】,以确保图片清晰(基于页面内容宽度为1400px);
图片&视频常用比例
横图常用比例绿色边框为常用






竖图常用比例绿色边框为常用






视频常用比例绿色边框为常用





注:图片常用格式 JPG(传统图片压缩格式),PNG(常用于透明背景图片的格式),Webp(最新图片压缩格式,可以替代JPG和PNG)。