北京无线城市WEB网站视觉设个计规范V2-0.docVIP

Colors 网站配色方案 主色为草绿色，导航NAV选用透明白色衬底，突出积极向上、清晰的风格。辅助色为浅灰色、橙色、天蓝色，作为大量的边框、标题栏、按钮等。 蓝色做为页面点缀，用于链接以及重点文字的颜色，突出重点。 Homepage Navigation 首页导航 导航的作用是让用户知道：这是什么网站？ 无线城市的LOGO，同时有文字说明网站上有什么？ 重点栏目和ZONE我能在这里做什么？通过频道 、功能区最方便快捷的到他想要去的地主 导航高度要限制在一定范围内，并包含最主要的功能元素。超过了一定页面高度会对用户浏览造成负面影响。 导航功能应该明确，突出频道，搜索，用户基本信息操作。避免复杂的信息，干扰用户行为。 Header and Footer 页头和页脚 页头、页脚： 高度24px、85px 表达了本地天气情况，以及移动其他页面链接。 Home page主页面 内容页面宽度为960px（所有页面需统一为这个数值），居中。 1、登录前(红色区域不同) 2、登录后（红色区域不同) 布局 除了个别特殊布局以外，网站主要分2栏和3栏，总宽必须为960px。规格如下： 内页两栏宽度：69+10+260 页面中的标题栏规格： 市民主页布局元素规范 Topbar和navbar的高度 轮播图尺寸 左右栏高宽 左侧为235*35 右栏为255*35 图片规格 服务图标： 生活服务图片： 我的声音图片尺寸： 机构导航： Elements元素 一、翻页 统一使用CSS制作的翻页效果，绿色表示当前页。 二、文字尺寸单位、字体使用、行间距、超链接、色彩 1、尺寸单位：（采用px） 侧边栏文字：12px 适用范围：所有说明性文字，普通信息。 中栏文字：14px 适用范围：新闻栏、中栏文字。 标题文字：16px 适用范围：标题或者重点突出的文字信息。 特殊文字： 18px 适用范围：特殊的、需要非常重点突出的提示文字（谨慎使用） 2、字体使用： 英文、数字标准字： arialverdana 中文为：宋体 3、行间距（红色区域为14px行间距，蓝色区域为12px行间距）： 4、文字颜色： 重要文字：重要文字 #D5592 # fb4303 一般文字：一般文字 #000000 5、超链接规范： 1、、信息类通常用新开窗口方式打开。2、顶部导航、底部导航通常采取在本页打开，特殊栏目和功能可新开窗口。3、带下划线为链接通常的默认风格Nomal+visited 1: 超链接样式 #333333 应用范围：一般性链接、列表或者表格类常见信息链接 Nomal+visited 2：超链接样式 #54add5 应用范围：标题链接、业务或者用户名等区别于一般信息的链接 Nomal+visited 2：超链接样式 # ffff33 应用范围：顶部蓝色背景内链接 Hover1: 超链接样式 #54add5 下划线 Hover2: 超链接样式 # ffff33下划线 Important link：粗体 流程图样式： （暂未定） 图片规范 1、图片格式采用：jpg、gif为主，尽量不采用png、bmp等 2、图片大小要求：装饰性小图片、背景、样式、图标等不应超过10kb 3、图片样式：灰色边框 3、图片尺寸： 头像部分不包括边框为55px*55px 应用类图标：65px*65px 五、面包屑 六、错误页面规范所有程序出错页面、找不到的页面不要使用默认的出错提示，要设计为带网站标识和说明的个性化的出错提示页面。 八、按钮、应用图标风格 圆角按钮风格，色调统一使用配色方案的辅助色系进行设计 应用类图标统一圆角设计，非应用类的功能性图标统一采用图标加功能文字形式 圆角按钮风格，色调统一使用配色方案的辅助色系进行设计 九、弹出窗口、弹出层风格 暂未定 图片命名规范 图片的分类及命名规则?名称分为头尾两两部分，用下划线隔开。头部分表示此图片的大类性质，例如广告、标志、菜单、按钮等等。 一般来说:放置在页面顶部的广告、装饰图案等长方形的图片我们取名：banner标志性的图片我们取名为：logo在页面上位置不固定并且带有链接的小图片我们取名为button在页面上某一个位置连续出现，性质相同的链接栏目的图片我们取名：menu装饰用的照片我们取名：pic不带链接表示标题的图片我们取名：title依照此原则类推。? 尾部分用来表示图片的具体含义，如果有类似图片就用数字区别。? 下面是