开发部web界面设计规范VIP免费

1 开发部 Web 界面设计规范版本修订历史起止日期作者 /修订人更改章节修改描述版本 /状态2 1. 目录结构规范1)目录建立原则：以最少的层次提供最清晰的访问结构。2)目录的命名以小写英文字母、下划线组成。3)根目录一般只放 index.html 已经其他必须的系统文件。4)根目录下的 images用于存放各页面都要使用的公用图片。5)所有 JS 等脚本存放在根目录下的scripts 或 js 目录。6)所有 CSS 文件存放在根目录下的style 或 css目录。2. 设计命名规范页面基本框架结构container header navbar menu main sidebar footer container— 就是将页面中的所有元素包在一起的部分header— 是页面的头部区域，一般来讲，它包含网站的logo 和其他一些元素navbar— 等同于横向的导航栏，是最典型的页面元素，也可以命名为nav menu— 此区域包含一般的链接和菜单，也可以命名为subNav,links main— 是网站的主要区域，也可以命名为content sidebar— 此区域包含网站的次要内容，例如最近更新内容列表等。footer— 包含一些附加信息，也可以命名为copyright 命名规则注意点1)尽量考虑为元素命名其本身的作用或用意，达到语义化不要使用表面形式命名，如：red/left/big等2)组合命名规则： [元素类型 ]-[ 元素作用 /内容 ]。如搜索按钮 btn-search、登录表单 form-login 。3)凡涉及交互行为的元素通常会有正常、悬停、点击和已经浏览等不同样式。参考：搜索按钮btn-search、btn-search-hover、btn-search-visited 1 2 3 4 5 6 7 3 常用命名汇总名称命名规范页头header top 登录条loginbar 标志logo 侧栏sidebar 导航nav 子导航subNav 菜单menu 子菜单submenu 工具条toolbar 表单form 栏目column 箭头arrow 搜索search 滚动条scroll 内容content 标签页tab 列表list 提示tips 栏目标题title 链接links 页脚footer end 服务service 下载download 注册register reg 状态status 按钮btn 上传upload 登录login 合作伙伴partner 版权copyright 网站地图sitemap 图片命名规则1)图片名称分为头尾两部分，用下划线隔开。禁止用中文名。2)头部分表示此图片的大类性质。例如：放置在顶部的长方形图片可以取名banner；标志图片取名logo；位置不固定并且带有链接的小图片取名button；做栏目链接的图片取名menu；不带链接表示标题的取名title；装饰的照片取名 pic；等。3)尾 部 分 用...