前端开发设计规范
前端UI设计规范与标准

前端UI设计规范与标准前言在现代互联网应用的开发中,用户界面(UI)设计在整体用户体验和产品成功中起着至关重要的作用。
良好的前端UI设计可以提升用户的使用体验,并为用户提供高效、直观的界面。
本文将介绍一些前端UI设计的规范和标准,以指导开发人员进行界面设计。
一、色彩选择色彩在UI设计中扮演着重要角色,可以传递品牌形象、情感和风格。
在选择色彩时,应遵循以下规范和标准:1.1 主色调选择根据品牌形象和用户需求,选择主色调。
主色调应与品牌形象相符合,并能够传递出正确的情感和风格。
1.2 色彩搭配选择主色调后,搭配辅助色彩以提升界面的视觉效果。
辅助色彩的选择应考虑到色彩的对比度和相容性,以确保用户界面的可读性和一致性。
1.3 颜色应用在设计界面时,将主色调和辅助色彩合理地应用于各个元素中,如背景色、文本颜色、按钮颜色等。
颜色的应用要一致性,具有明确的层次和视觉重点。
二、布局与结构良好的布局和结构可以使界面更加清晰、易于理解。
以下是一些布局与结构的规范和标准:2.1 界面结构界面应具有清晰的结构与层次,使用户能够轻松理解和操作界面。
采用一致的导航和布局结构,以及明确的标题和标签,能够提高用户界面的可用性。
2.2 响应式设计考虑到不同设备和屏幕大小,采用响应式设计来适应不同的屏幕分辨率。
界面的排版和布局应能够自动调整,并保持良好的可读性和用户体验。
2.3 对齐与间距保持元素之间的对齐和间距的一致性,可以使界面看起来更加整齐和专业。
合理的对齐和间距可以帮助用户理解和扫描界面上的信息。
三、字体与排版在UI设计中,字体的选择和排版的合理运用是非常关键的。
以下是一些字体与排版的规范和标准:3.1 字体选择选择与品牌风格相符合且易于阅读的字体。
字体的大小和粗细应根据不同元素和层次进行调整,以确保良好的可读性。
3.2 字体排版合理运用字体的大小、颜色、对齐和间距,使界面上的文字内容具有良好的视觉效果和阅读体验。
标题、正文和标签的字体排版应有清晰的层次和区分度。
前端UI设计规范制定管理办法

前端UI设计规范制定管理办法一、背景介绍随着互联网的迅猛发展,前端UI设计在网站和应用开发中扮演了至关重要的角色。
为了确保前端设计的质量和一致性,制定一套规范化的前端UI设计规范是必要的。
本文将介绍前端UI设计规范制定管理办法,旨在帮助公司或组织建立一套高效、规范的前端UI设计流程。
二、规范制定流程1. 需求分析阶段在开始制定前端UI设计规范之前,需要对项目或产品进行需求分析。
这包括确定目标用户群体、功能需求、平台适配等方面的要求。
通过充分了解需求,能更好地制定后续的UI设计规范。
2. 参考现有设计标准在制定UI设计规范之前,可以参考现有的设计标准和行业最佳实践。
例如,可以借鉴Bootstrap、Material Design等成熟的前端UI框架,以及相关设计规范文档。
合理利用这些资源,能够提高规范的制定效率和质量。
3. 制定UI设计规范内容根据需求分析和参考资料,制定详细的UI设计规范内容。
该规范应包括颜色设计、字体规范、排版布局、图标使用、按钮交互等方面的规定。
此外,还应该涵盖不同平台的适配要求,保证在不同设备上都能提供一致的用户体验。
4. 规范评审和修改初步制定UI设计规范后,需要组织内部成员进行评审。
评审人员应该包括UI设计师、前端开发人员、产品经理等相关角色,以确保规范的实施性和有效性。
根据评审意见,进行必要的修改和完善。
5. 规范发布和培训完成规范的最终版本后,需要将其以统一的形式发布给相关人员。
同时,组织培训会议,向设计师和开发人员介绍新的规范要求,解答可能出现的疑问。
通过培训,能够提高团队成员对规范的理解和遵守程度。
三、规范管理与执行1. 规范文档管理制定好的前端UI设计规范应以文档的形式进行管理,并确保文档的版本更新与迭代。
可以选择在线文档或内部文档管理系统来管理这些规范文档,以便团队成员随时查阅。
2. 规范执行与监督规范的执行是保证设计质量和用户体验的关键。
为了让规范得以有效执行,可以采用以下措施:- 设立UI设计专业团队,负责规范执行和监督。
前端开发中的表单设计与验证规范

前端开发中的表单设计与验证规范在前端开发中,表单设计和验证是一个非常重要的环节。
一个好的表单设计可以提高用户体验,并且有效地收集用户输入的数据。
而表单验证则可以确保数据的准确性和完整性。
在本文中,我们将讨论一些前端开发中的表单设计和验证规范,以帮助开发人员更好地设计和验证表单。
1. 表单设计的原则一个好的表单设计需要遵循一些基本原则。
首先,表单应该简洁明了,避免过多的字段和冗余的信息。
只要收集最必要的信息即可,以减少用户的输入量。
其次,表单应该有良好的布局和结构,使用户能够清晰地理解表单的结构和步骤。
合理地分组和排列字段,可以提高用户的操作效率和愉悦度。
2. 表单验证的类型表单验证是确保用户输入数据的有效性和完整性的关键步骤。
在前端开发中,常见的表单验证类型包括以下几种:- 必填字段验证:确保用户填写了必填字段,常用的验证方式是在表单提交前进行必填字段的非空验证。
- 数据格式验证:验证用户输入数据的格式是否符合要求,如邮箱格式、手机号格式、日期格式等。
可以使用正则表达式或内置的验证函数来进行数据格式验证。
- 数据范围验证:验证用户输入数据的范围是否符合要求,如数字范围、长度范围等。
可以使用条件判断语句来进行数据范围验证。
- 数据一致性验证:验证用户输入的数据是否一致,如密码和确认密码是否一致。
可以使用条件判断语句来进行数据一致性验证。
3. 客户端与服务器端验证在表单验证过程中,通常会有客户端验证和服务器端验证两个环节。
客户端验证是在用户提交表单前进行的验证,主要是为了提高用户的操作效率和体验。
而服务器端验证是在接收到用户提交的数据后进行的验证,主要是为了确保数据的安全性和完整性。
客户端验证可以使用JavaScript来实现,通过表单事件监听和手动触发进行验证逻辑的编写。
例如,在提交表单之前,可以通过JavaScript获取表单字段的值,并进行必填字段验证、数据格式验证等。
服务器端验证通常是使用后端语言(如PHP、Java)来实现,通过接收表单数据,进行必要的验证逻辑并返回验证结果。
《Web前端开发技术》课程标准

《Web前端开发技术》课程标准一、课程定位《Web前端开发技术》本课程是计算机软件技术专业、计算机网络技术专业的一门专业必修课,本课程的设计体现“以能力为本位、以职业实践为主线、以项目课程为主体”,打破了传统的学科体系的模式,通过多个项目的练习操作,熟练地掌握岗位所需知识和技能,并不断强化,项目体现操作能力和解决问题能力的培养。
充分体现了职业教育“以就业为导向,以能力为本位”的职业教育理念。
二、课程目标通过本课程学习掌握VUE的知识体系,模板语法、组件、过渡动画、生命周期等基础内容。
掌握VUE基本概念、VUE实例、VUE模板语法、VUE生命周期、VUE组件及组件间通信、VUE过渡与动画;掌握VUE-CLI脚手架、脚手架配置、APP路由、单页面APP创建、APP组件开发、VUE-CLI组件间传参、VUE-CLI插槽、组件切换过渡动画、编译打包处理。
培养学生web前端开发能力。
同时,通过本课程的学习,提高学生的操作技能,培养学生踏实认真、精益求精、创新的精神,培养良好的职业道德,为学生学习动态网站开发相关课程提供知识和技术支持。
通过项目的实现,让学生具备良好的综合素质和职业道德,能够吃苦耐劳、爱岗敬业、团结合作。
1.知识目标(1)理解Vue编程理念与直接操作Dom的差异(2)Vue常用的基础语法(3)理解MVVM设计模式(4)掌握Vue的组件和实例(5)掌握前端组件化,全局样式与局部样式(6)掌握父子组件传值与组件参数校验(7)熟悉Vue 中的动画特效(8)理解Vue中的CSS动画原理2.能力目标(1)具备Vue常用的基础语法应用能力(2)具备使用Vue编写TodoList功能的能力(3)具备插槽的使用,动态组件的应用能力(4)具备Vue-cli脚手架工具的使用的能力(5)具备组件化思维修改TodoList的能力(6)具备Vue中使用animate.css库的能力(7)具备Vue中同时使用过渡与动画效果能力(8)具备Vue中使用Velocity.js库的能力(9)具备Vue中动画的封装能力3.素质目标具有社会主义和共产主义的理想信念具有改革开放的意识和强烈的竞争意识具有良好的行为规范和社会公德以及较强的法制观念具有良好的职业道德和质量服务意识具有不断学习、不断创新的进取精神具有团队协作精神和较强的协调能力及独立工作的能力具有健康的体魄和良好的心理素质能吃苦耐劳、爱岗敬业三、课程设计1.设计思想以校企合作为切入点,以培养职业能力为核心,以项目教学为主要手段,积极探索教学方法与成绩评价方法的创新,保证课程目标的实现。
前端开发设计规范文档

前端开发设计规范文档-CAL-FENGHAI-(2020YEAR-YICAI)_JINGBIAN前端开发设计规范目录一、HTML使用规范、页面文件命名规范命名格式为:项目名缩写_所属功能_所属功能子项_... .jsp/html…,文件命名下划线不能超过三个,命名尽量使用简短的能明确表明文件用途的英文或者英文简写。
、页面head部分书写规范1)、JSP页面:需要在页面的最开始部分增加以下语句:2)、HTML页面:需要在页面的最开始部分增加以下语句:3)、HTML5页面:页面添加编码格式可简写为:4)、响应式的网页添加如下语句:5)、title元素:一般网页必须添加title元素,若为框架页面,则可以不写。
title统一使用中文,title内容要简洁明了,不能超过20个字。
6)、外部js的引用:页面加载时需要用到的js文件写在head中,引用时不用写language属性,HTML5可以省略type属性,如。
7)、外部CSS文件的引用:必须使用link方式引入,HTML5可以省略type属性,CSS文件引入要放在js文件前。
、HTML元素开发规范1)、代码的结构要保持完整性,单个标签必须要关闭,如:<div></div>,<br/>等。
2)、子元素要比父元素缩进两个字符。
3)、body中的所有内容不能直接书写在<body></body>标签中,需要在body中嵌入一层div,所有的元素需要写在改div中。
4)、除非必要,所有标签元素的样式都需要使用CSS文件来定义。
5)、img元素:所有展示用图片都要使用alt属性添加能简要描述图片的文字说明,如首页的广告图片等,必须具有width和height属性。
6)、所有Form都要指定action属性,但属性值需要则填写,不需要则留空,method属性统一使用POST;所有form表单都要在提交前对输入的数据前进行验证,验证使用jQuery validate插件,书写规范如下:7)、所有不可更改的input元素都要设置readonly属性。
前端开发设计规范文档

前端开发设计规范文档一、引言二、代码编写规范1.缩进和空格-使用2个空格作为一个缩进层级。
- 在每个关键词或运算符后添加一个空格,如if (condition) {}。
-每行代码的末尾都应该去掉多余的空格。
2.行长限制每行代码应控制在80个字符以内,避免过长的代码行导致代码难以阅读和理解。
3.注释-使用注释来解释代码的意图和逻辑。
-使用单行注释(//)来注释一行代码,使用多行注释(/*...*/)来注释一段代码。
-注释要保持与代码同步,当代码发生修改时,注释也应随之更新。
4.变量和函数命名- 使用驼峰命名法(camelCase)命名变量和函数。
变量和函数名应该清晰明确,能够准确表达其含义。
-避免使用缩写和简写,除非是常见的缩写或简写形式。
5.常量命名-使用全大写字母和下划线的命名方式命名常量。
-常量名要具有描述性,能够清晰表达其含义。
6.字符串引号-使用双引号("")包裹字符串,避免使用单引号('')。
7.条件判断和循环语句-在条件判断和循环语句中使用花括号({})包裹代码块,即使只有一行代码。
8.数据类型转换-使用严格相等运算符(===)进行数据类型和值的比较,避免使用弱相等运算符(==)。
三、组织结构规范1.文件和文件夹命名-文件和文件夹命名应该清晰明确,能够准确表达其内容。
-文件和文件夹的命名应使用小写字母、短划线和数字的组合,避免使用空格和特殊字符。
2.目录结构前端项目应该按照一定的目录结构进行组织,常见的目录结构如下:- src:项目源代码目录。
- assets:用于存放静态资源文件,如图片、字体等。
- styles:存放样式文件。
- scripts:存放脚本文件。
- pages:存放页面组件。
四、性能优化规范1.文件合并和压缩-将多个CSS和JS文件合并为一个文件,并进行压缩。
-使用工具和插件进行自动化合并和压缩操作。
2.图片优化- 使用适当的图像格式,如JPEG、PNG、WebP等,以提高图像加载速度。
前端UI设计规范精讲

前端UI设计规范精讲前端UI设计是一项重要的工作,它关乎到网站或应用程序的用户体验和整体形象。
为了使设计满足用户期望并保持一致性,制定一套UI设计规范是必要的。
本文将详细介绍前端UI设计规范的要点和流程。
一、整体设计风格在开始UI设计之前,确定整体设计风格是至关重要的。
这包括选择适合项目的色彩方案、字体风格、图标库等。
在确定风格之后,应该在整个项目中保持一致,以确保用户体验的连贯性。
1. 色彩方案选择恰当的色彩方案非常关键。
可以根据品牌形象和用户喜好来选择主色、辅助色和中性色。
要避免使用过多的颜色,以免造成视觉混乱。
2. 字体风格选择适合项目的字体风格,包括主标题字体和正文字体。
字体应该清晰易读,并与整体设计风格保持一致。
同时,应根据设备和浏览器的差异选择合适的字体。
3. 图标库使用统一的图标库可以提高界面的一致性和易用性。
可以选择开源的图标库或自定义设计符合项目风格的图标。
图标的形状、颜色和尺寸应与整体设计风格相匹配。
二、布局与组件设计良好的布局和组件设计能够提高用户的操作效率和体验。
在设计过程中,要考虑到不同设备和分辨率的适配问题,并制定相应的设计规范。
1. 布局设计设计响应式布局是必要的,以适应不同屏幕尺寸的设备。
布局应该合理,内容排布应符合用户的习惯和阅读习惯。
同时,要保持页面的简洁明了,不堆砌过多的内容。
2. 组件设计设计各种组件时,要确保其功能明确、易于使用和可访问。
按钮、输入框、下拉菜单等交互元素应该具备统一的样式和行为。
避免使用过多的动画效果和花哨的设计,以免分散用户的注意力。
三、可访问性与易用性为了让尽可能多的用户获得良好的用户体验,提高可访问性是必要的。
同时,考虑用户的习惯和心理需求,使界面易用也是设计规范中的重要内容。
1. 可访问性在设计过程中,要确保网页内容对各类用户(包括残障人士)都能够无障碍地访问。
应该注意颜色对比度、文本大小和清晰度等问题,并合理使用标签和ARIA属性。
前端UI设计规范制定负面示例

前端UI设计规范制定负面示例一、引言UI设计规范是前端开发中非常重要的一环,它能够确保团队成员在设计产品时遵循统一的标准,提高用户体验和用户界面的一致性。
然而,如果不正确地制定UI设计规范,就有可能导致一系列负面影响。
本文将通过几个具体案例,来探讨前端UI设计规范制定中的一些负面示例。
二、案例一:颜色使用不当在UI设计规范中,颜色的使用非常重要。
然而,如果没有明确规定颜色的搭配和使用方式,就容易出现颜色混乱、不统一的问题,影响用户对产品的整体感受。
比如,在一个电商网站中,首页推荐部分的商品使用了五颜六色的背景色,使得整个页面显得杂乱无章,给用户带来不良的浏览体验。
因此,在制定UI设计规范时,应该规定明确的配色方案,同时提供对应的色值和代码。
三、案例二:字体大小和风格缺乏一致性字体是用户界面中的重要要素之一,它不仅直接影响用户的阅读体验,还能够传达产品的整体风格和定位。
然而,在一些没有规范的项目中,设计师可能会随意地选择不同大小和风格的字体,给用户传递混乱的信息。
比如,在一个新闻资讯类App中,标题使用了多种不同字号和字体样式,导致页面缺乏整洁性,用户很难快速获取信息。
因此,在UI设计规范中,应该明确定义字体的大小和风格,确保整个产品的一致性。
四、案例三:排版规则不清晰排版是UI设计中重要的要素之一,合理的排版可以增强用户的阅读体验。
然而,在一些项目中,由于缺乏清晰的排版规则,导致页面排版混乱,难以阅读。
比如,在一个电影票预订网站中,电影海报和相关信息的排版并不统一,导致用户在选择喜欢的电影时出现困惑。
因此,在UI设计规范中,应该明确定义排版规则,包括标题、正文、按钮等元素的大小、间距和对齐方式。
五、案例四:交互效果不一致交互效果是用户界面中的重要组成部分,合理的交互效果能够提升用户的操作体验和产品的可用性。
然而,在一些项目中,由于没有制定统一的UI设计规范,导致交互效果不一致,给用户带来困惑。
比如,在一个社交媒体App中,点赞按钮在不同页面中的交互效果不一样,用户无法准确理解其含义。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
前端开发设计规范目录前端开发设计规范 (1)一、HTML使用规范 (1)1.1、页面文件命名规范 (1)1.2、页面head部分书写规范 (1)1.3、HTML元素开发规范 (2)1.3.1、HTML元素书写规范 (2)1.3.2、HTML元素命名规范 (3)二、WEB页面开发规范 (4)2.1、错误跳转页面的处理 (4)2.2、提示信息的处理 (4)2.3、页面的返回 (4)2.4、提交前数据的判断验证 (4)2.5、删除操作 (5)2.6、页面中java代码的使用 (5)2.7、网站页面布局规范 (5)2.7.1、前台页面尺寸 (5)2.7.2、标准网页广告图标规格(参考) (6)2.7.3、页面字体 (6)2.7.4、字体颜色 (7)三、javaScript开发规范 (7)3.1、javaScript文件命名规范: (7)3.2、javaScript开发规范 (7)3.2.1、javaScript书写规范 (7)3.2.2、javaScript命名规范 (8)四、css样式规范 (10)4.1、css样式文件命名规范 (10)4.1.1、通用样式文件命名规范: (10)4.1.2、业务类样式文件命名规范 (10)4.1.3、css样式文件命名须知 (11)4.2、css样式文件存放目录规范 (11)4.3、css样式定义规范 (11)4.3.1、css样式内容顶部注释规范 (11)4.3.2、css样式内容注释规范 (12)4.3.3、css样式定义规范 (12)4.3.4、css样式常用id的命名 (13)4.3.5、css样式常用class的命名 (16)4.4、css样式书写规范 (16)4.4.1、css样式排版规范 (16)4.4.2、css样式书写风格规范 (16)4.4.3、css样式属性定义顺序规范 (17)4.4.4、css样式其他规范 (18)4.4.5、css样式 Hack的使用 (19)4.4.6、字体定义规范 (19)4.4.7、css样式检测 (20)4.4.8、注意事项 (20)4.5、css样式引用规范 (20)4.6、媒体内容命名规范 (21)五、项目文件存放规范 (21)六、前端开发规则 (22)一、HTML使用规范1.1、页面文件命名规范命名格式为:项目名缩写_所属功能_所属功能子项_... .jsp/html…,文件命名下划线不能超过三个,命名尽量使用简短的能明确表明文件用途的英文或者英文简写。
1.2、页面head部分书写规范1)、JSP页面:需要在页面的最开始部分增加以下语句:2)、HTML页面:需要在页面的最开始部分增加以下语句:3)、HTML5页面:页面添加编码格式可简写为:4)、响应式的网页添加如下语句:5)、title元素:一般网页必须添加title元素,若为框架页面,则可以不写。
title统一使用中文,title内容要简洁明了,不能超过20个字。
6)、外部js的引用:页面加载时需要用到的js文件写在head中,引用时不用写language属性,HTML5可以省略type属性,如。
7)、外部CSS文件的引用:必须使用link方式引入,HTML5可以省略type属性,CSS文件引入要放在js文件前。
1.3、HTML元素开发规范1.3.1、HTML元素书写规范1)、代码的结构要保持完整性,单个标签必须要关闭,如:<div></div>,<br/>等。
2)、子元素要比父元素缩进两个字符。
3)、body中的所有内容不能直接书写在<body></body>标签中,需要在body中嵌入一层div,所有的元素需要写在改div中。
4)、除非必要,所有标签元素的样式都需要使用CSS文件来定义。
5)、img元素:所有展示用图片都要使用alt属性添加能简要描述图片的文字说明,如首页的广告图片等,必须具有width和height属性。
6)、所有Form都要指定action属性,但属性值需要则填写,不需要则留空,method属性统一使用POST;所有form表单都要在提交前对输入的数据前进行验证,验证使用jQuery validate插件,书写规范如下:7)、所有不可更改的input元素都要设置readonly属性。
8)、按功能模块添加简单明了的注释,在功能模块的开始标明模块开始,结束时标明模块结束,注释单独占一行;模块之间留行间隔便于查看代码。
9)、已过时的元素标签使用CSS样式来代替,已过时的标签属性禁止使用,使用CSS样式定义来实现。
1.3.2、HTML元素命名规范涉及到跟服务端交互的元素,元素命名应当与服务端程序中定义的对应变量名相同,或使用对象名.变量名的形式。
页面上使用到的不涉及与服务端交互的HTML元素其id和name需统一,所有命名使用元素标签的缩写_后缀方式,后缀命名使用小驼峰命名法即第一个单词全部使用小写,其他单词首字母大写,常见元素命名规则如下表所示:二、WEB页面开发规范2.1、错误跳转页面的处理400、401、403、404、405、406、407、410、412、414、500、501、502等错误代码使用其相应的统一页面,所有错误信息全部使用中文错误信息,标点符号使用中文半角符号。
页面设计与项目功能相匹配,做到简洁友好。
2.2、提示信息的处理成功提示信息可以使用弹窗或跳转统一成功页面的方式,成功页面的风格与网站总体风格相同,格式如下:"成功:"+提示信息+"!"。
2.3、页面的返回所有需要返回上一页的时候使用history.back();不使用history.go(-1)。
2.4、提交前数据的判断验证1)、所有由用户输入的数据在提交前都要进行验证。
2)、验证方式使用jQuery validate插件,需要验证的项:长度验证:默认长度为数据库中数据的最大长度,中文占两个字符,英文占一个字符。
为空验证:所有不允许为空的输入内容为空时不允许提交。
其他验证:需要根据输入内容的不同设定合适的验证,如Email格式是否正确,身份证号格式是否正确等。
3)、验证后发现错误,需要提示明确的错误信息。
错误提示信息样式:字体颜色#ff3366,文字前面加红色感叹号小图标。
4)、可输入表单需要具有输入内容的提示信息,可使用placeholder属性来定义或者自定义,颜色必须使用灰色,字体比网站使用字体小。
2.5、删除操作所有涉及删除的操作,需要用户进行确认之后才能进行操作。
2.6、页面中java代码的使用页面中不允许使用<% %>的方式嵌入java代码。
2.7、网站页面布局规范2.7.1、前台页面尺寸1)、800*600下,网页宽度保持在778以内,就不会出现水平滚动条,高度则视版面和内容决定,1024*768下,网页宽度保持在1002以内,不会出现水平滚动条,高度同样视版面内容决定。
2)、根据第一条原则,规定网页的尺寸为width=960px,height=600px。
3)、页面长度原则上不超过3屏(可根据实际情况设定),宽度不超过1屏。
4)、全尺寸banner为468*60px,半尺寸banner为234*60px,小banner为88*31px。
5)、每个非首页静态页面含图片字节不超过60K,全尺寸banner不超过14K。
2.7.2、标准网页广告图标规格(参考)1)、120*120,适用于产品或新闻照片展示。
2)、120*60,主要用于做LOGO使用。
3)、120*90,主要应用于产品演示或大型LOGO。
4)、125*125,适于表现照片效果的图像广告。
5)、234*60,适用于框架或左右形式主页的广告链接。
6)、392*72,主要用于有较多图片展示的广告条,用于页眉或页脚。
7)、468*60,应用最为广泛的广告条尺寸,用于页眉或页脚。
8)、88*31,主要用于网页链接,或网站小型LOGO。
2.7.3、页面字体正文内容中文统一使用宋体(可根据需要设定),大小为12px,标题使用14px 加粗,不建议使用13px字,英文字体使用Arial和Helvetica/Univers。
2.7.4、字体颜色1)、正文使用灰黑色#333333。
2)、超链接可以使用蓝色#1f376d或#425c9e,也可以根据整体页面布局进行调整,整个网站的文字超链接样式要统一。
三、javaScript开发规范3.1、javaScript文件命名规范:1)、可通用的javaScript文件:项目名称缩写-文件作用.js。
2)、其他javaScript文件:所属功能-文件作用.js。
3.2、javaScript开发规范3.2.1、javaScript书写规范1)、javaScript代码都需要写在javaScript文件中,在页面中进行调用,调用代码除页面加载时需要用到的外全都写在页面最低端。
2)、如验证用javaScript代码等,每个页面不同且比较短的,可以写在页面的最底端,从最后一个外部javaScript引入命令后开始。
3)、脚本变量开发规范:变量的使用尽量缩小到小的作用域。
如循环使用。
4)、尽量避免使用全局变量。
5)、每一句语句都要以分号“;”结束。
6)、函数程序体缩进四个空格,Tab键为4个空格,以Tab键作为缩进单位。
7)、函数名与“(”之间不应该有空格,“)”与“{”之间加空格。
8)、函数体之间应当加空行。
9)、如果代码本身是清楚的,则只需要在函数定义前,添加简单注释说明该函数的作用,若代码本身比较复杂,可在个别语句后添加简洁明了的注释。
3.2.2、javaScript命名规范1)、常量以及全局变量名必须全部使用大写字母。
2)、不要再命名中使用“$”和“\”等特殊字符,不要把“_”作为变量名的第一个字符和最后一个字符。
3)、变量名必须使用其类型的缩写字符串开始。
各种类型的缩写字符串如下:4)、变量名必须采用有意义的单词命名,如:strUserName、lngArrayIndex,以及不要出现数字编号命名,如:value1,value2…5)、如果变量名过长可以使用单词缩写,除了被广泛了解的单词缩写以外,所有使用单词缩写的变量名必须在定义时给出注释,如:6)、参数变量命名必须加前缀:p_。
7)、function命名规范:使用动词+名词的方式,并且命名需要明确指出其作用,动词前缀必须是同函数功能相关的完整动词,如getUserId(),用来取用户Id。
8)、所有命名使用小驼峰命名法:第一个单词全部使用小写,其他单词首字母大写,如:myClassName。
四、css样式规范4.1、css样式文件命名规范4.1.1、通用样式文件命名规范:1)、整个项目通用的css布局样式文件命名为:layout.css。