新浪页面设计规范Word文档格式.docx
- 文档编号:21428390
- 上传时间:2023-01-30
- 格式:DOCX
- 页数:16
- 大小:310.83KB
新浪页面设计规范Word文档格式.docx
《新浪页面设计规范Word文档格式.docx》由会员分享,可在线阅读,更多相关《新浪页面设计规范Word文档格式.docx(16页珍藏版)》请在冰豆网上搜索。
④频道二级标准头
频道LOGO┊产品功能区
⑤正文页面标准头
正文导航┊搜索功能
频道二极三级和专题页面
标准尾
①首页标准头尾②通用标准尾类型说明:
①首页标准尾
相关导航┊版权信息┊相关许可证号
②通用标准尾
本频道信息┊相关导航┊版权信息
频道首页频道二极三级和专题页面正文页面
页面导航
①频道导航②二级导航③专题导航&
专题图④三级导航⑤导航指向
①频道导航
频道LOGO┊功能性导航┊主导航位置区┊次要导航位置区
新闻中心、频道首页及产品页面均可使用
②二级导航
二级导航
所有频道二级均可使用
③专题导航
专题图┊导航
专题页面,可根据需要添加删除专题导航
④三级导航
指向导航
三级页面
⑤正文导航
频道LOGO┊指向导航
正文页面
版式结构:
版块基本元素:
版块组合形式:
版块元素之间距为8PX同名版块元素间的距离为6PX(例如EEC中EE距离为6EC距离为8PXH2等分版式为6PX)
ABC版块AF版块DC版块EEC版块
CFC版块FA版块CD版式CEE版式
H1通栏版式H2等分版式H3等分版式H4等分版式
H(N)分版式
模块类型
标题种类:
①焦点图②头条区③A类模块④B类模块⑤C类模块
种类说明:
以下图例除特殊注明外,所指距离均包括模块边框线
①焦点图
②头条区
③模块标题
④模块内容
⑤图片列表和图文混排
⑥段落关系
⑦段落格式
文字规范
样式类库:
①文字格式②连接样式③项目符号
注:
所有文字设计均依据下列样式组合
①文字格式
12号字格式:
字号12px┊字体宋体&
Arial┊行距21px┊粗体&
细体┊
14号字格式:
字号14px┊字体宋体&
Arial┊行距24px┊粗体&
10号字格式:
字号10px┊字体Arial┊行距无┊细体┊
20号字格式:
字号20px┊字体黑体&
Arial┊行距无┊细体┊
说明:
10号字格式,12号字格式,14号字格式中的数字英文字母为Arial,中文为宋体
②连接样式
动态链接样式:
鼠标初始:
颜色#000099■┊状态下划线__
鼠标经过:
颜色#CC0000■┊状态下划线__
鼠标点击:
鼠标结束:
颜色#660066■┊状态下划线__
静态连接样式:
颜色#自定义□┊状态无
颜色#自定义□┊状态下划线__
重要链接样式:
③项目符号:
点状项目符号:
点·
数字项目符号:
数字01020304050607080910
形状项目符号:
自定义
应用组合:
①导航类②标题类③信息类④段落类⑤功能类⑥注释类⑥表单类
①导航类
a统一导航:
12号文字格式=字号12px┊字体宋体&
Arial┊细体┊颜色#333333■┊行距21px
静态连接样式=鼠标初始:
颜色#333333■┊状态无
颜色#333333■┊状态下划线__
文字其它说明=关键词句之间用竖杠符号|间隔
b本页导航:
Arial┊细体┊颜色#自定义□┊行距21px
c标题导航:
颜色#000099■┊状态无
颜色#000099■┊状态无
文字其它说明=关键词句之间用横杠符号-间隔
d导航指向:
文字其它说明=关键词句之间用大于号符号>
间隔
②标题类
a版块标题:
20号文字格式=字号20px┊字体黑体┊细体┊颜色#自定义□┊行距无
文字其它说明=标题文字位置前可选择性修饰符号和图片,默认为无
a一类标题:
14号文字格式=字号14px┊字体宋体&
Arial┊粗体┊颜色#自定义□┊行距无
文字其它说明=标题文字位置前可选择性修饰符号和图片,默认为三角形符号
a二类标题:
Arial┊细体┊颜色#自定义□┊行距24px
文字其它说明=无
a三类标题:
Arial┊粗体┊颜色#自定义□┊行距21px
a四类标题:
c头条标题:
20号文字格式=字号20px┊字体黑体&
Arial┊细体┊颜色#自定义□┊行距无
颜色#CC0000■┊状态无
c正文标题:
Arial┊细体┊颜色#333333■┊行距无
e段落标题:
Arial┊细体┊颜色#333333■┊行距24px
③信息类
a14项目列表:
动态连接样式=鼠标初始:
颜色#660066■┊状态无
文字项目符号=点状·
&
数字01&
无符号
文字其它说明=正常默认为点状符号,排行性质为数字符号,词语或者小空间区域可采用无符号
b12项目列表:
b图片列表:
Arial┊细体&
粗体┊颜色#自定义□┊行距无
文字其它说明=正常图片列表默认为细体,焦点图处采用粗体
④功能类
a普通功能文字:
Arial┊细体┊颜色#000099■┊行距无
文字其它说明=以下为各种功能文字应用形态
更多:
更多>
>
更多应用于深背景连接连接色彩采用反白,连接颜色可自定义
全文:
[全文]
详细:
[详细]
评论:
[评论]
翻页功能:
[上一页]
⑤注释类
a时间:
b投票:
12号文字格式=字号14px┊字体宋体&
c点击:
Arial┊细体┊颜色#333333■┊行距无⑥表单类
a表单文字:
12号文字格式=字号12px┊字体宋体&
Arial┊细体┊颜色#333333■┊行距无
⑦正文类
正文文字:
14号文字格式=字号14px┊字体宋体&
图片规范
片类型:
①横图②竖图③方图④专题图类型说明:
①横图 比例4:
3┊尺寸种类280*210┊应用焦点图
130*98┊应用通栏图片列表
120*90┊应用图文混排图片列表
100*75┊应用图片列表
77*58┊应用图片列表
56*41┊应用图片列表
比例3:
2┊尺寸种类130*87┊应用通栏图片列表
120*80┊应用图片列表
比例2:
1┊尺寸种类120*60┊应用广告性图片②竖图 比例3:
4┊尺寸种类75*100┊应用图片列表
55*73┊应用图文混排③方图比例1:
1┊尺寸种类55*55┊应用图文混排
38*38┊应用图文混排④专题图普通专题┊尺寸种类750*100┊应用普通专题
特殊专题┊尺寸种类750*200┊应用特殊专题
表单规范
图片类型:
①按纽②输入框③文本框④菜单⑤复选框⑥单选框类型说明:
表单形式建议采用WIN2000默认外观。
①按纽字号12px┊字体宋体&
按纽高度20px┊文字居中┊文字边距上4px下5px左20px右20px②输入框字号12px┊字体宋体&
按纽高度20px┊文字居中┊文字边距上3px下5px左3px右3px ③文本框字号12px┊字体宋体&
按纽高度20px┊文字居中┊文字边距上5px下5px左5px右5px ④复选框WIN2000默认外观。
④单选框WIN2000默认外观。
④菜单字号12px┊字体宋体&
Arial┊细体┊颜色#333333■┊行距无
按纽高度20px┊文字居中┊文字边距上3px下5px左3px右3px
色彩规范
基本结构:
白色正面:
雪花,纯静,清白,和平,轻盈,纯洁、天真、洁净、真理、
反面:
寒冷,受伤,弱点,放弃,冷淡、贫乏,死寂
白色在中华文化中也代表着死亡的颜色。
黑色正面:
夜晚,煤碳,能力,稳定,拘谨,可靠,能力,精致
害怕,无效,死亡,秘密,阴险,邪恶,病态
灰色正面:
智能,成熟,财富,尊严,贡献,抑制
否定:
混乱,衰变,具体,阴影,沮丧,厌烦
红色正面:
胜利激情爱力精力性别热情、浪漫
血战争火危险怒撒旦火焰、暴力、侵略
红色在很多文化中代表的是停止的讯号,用于警告或禁止一些动作
黄色正面:
明亮、光辉、黄金收获改革
懦弱叛逆嫉妒冒险疾病愚蠢
紫色正面:
懦弱,叛逆,妒忌,危机,
疾病,愚蠢创造、谜、忠诚、神秘、稀有
创造、谜、忠诚、神秘、稀有
绿色正面:
植物,自然,春天,肥沃,希望,安全自然、稳定、成长、
衰变,无经验,羡慕,贪欲,逃避现实,坏的运气
在北美文化中,绿色代表的是「行」,与环保意识有关,也经常被连结到有关财政方面的事物。
蓝色正面:
天空,海洋,精神性,定度,和平,个体忠诚、安全、保守、宁静、冷漠、悲伤
寒冷,沮丧,忧郁,淫秽,神秘,保守主义
白色在中华文化中也代表着死亡的颜色
CULTURE
RED
BLUE
GREEN
YELLOW
WHITE
USA,Europe
Danger
Manliness,sweet,calm,Authority
Safety,safe,sour
Caution,Cowardice
Purity
France
Nobility
Freedom,Peace
Criminality
preliminary
Neutrality
Egypt,ArabNations
Death
Virtue,Faith,Truth
Fertility,Strength
Happiness,WelfareorWealth
Joy
India
Life,Creativity
WelfareorWealth,Fertility
Success
Death,Purity
Japan
Anger,Danger
Shame,Despicableness
Future,Youth,Energy
Grace,Dignity,Nobility,childish,joyful
China
Happiness,Joy,Festivity
Sky,Clouds
Mingdynasty,royal,Honor
Birth,Wealth,StrengthorPower
?
彩色爱好
的西方成人的彩色”通用”命令:
(1)蓝色的,
(2)红色,格林,(4)紫色的,黄色的,(6)橘色
色彩尽量采用标准色216网络安全色
选择色盘时请考虑功能性的颜色
色彩调和共性调和面积调和
色彩构成(Interactionofcolor),可以理解为色彩的作用,是在色彩科学体系的基础上,研究符合人们知觉和心理原则的配色。
配色有三类要素:
光学要素(明度、色相、纯度),存在条件(面积、形状、肌理、位置),心理因素(冷暖、进退、轻重、软硬、朴素华丽),设计的时候运用逻辑思维选择合适的色彩搭配,产生恰当的色彩构成。
最优秀的配色范本是自然界里的配色,我们观察自然界里的配色,通过理性的提炼最终获得我们所需要的东西。
小面积用强色,大面积用弱色
面积调和的原则是:
色彩面积的大小可以改变对比效果,对比色双方面积越大,调和效果越弱;
反之,双方面积越小,调和效果越强。
对比双方面积均等,调和效果越弱;
对比双方面积相差越大;
调和效果越强。
只有恰当的面积比才能取得最好的视觉平衡,形成最好的视觉效果。
纯度对比调和。
色相对比调和多个色相对比调和两个补色对比调和两个类似色对比调和两个同一色对比调和灰色与高纯度黄色调和小面积用强色,大面积用弱色”。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- 新浪 页面 设计规范
![提示](https://static.bdocx.com/images/bang_tan.gif)