软件开发网页设计规范

软件开发网页设计规范

* 来源: * 作者: * 发表时间: 2020-05-10 0:17:58 * 浏览: 0
软件开发WEB的页面框架是指构成完整页面的组织结构。通常由以下三个部分组成:Head,Main,Foot,有时由于布局的需要,在Head之下,Head还将添加ld,菜单用于页面功能导航。对于软件开发公司的Web应用程序,页面布局与Web应用程序的功能区域相对应,并且页面各个部分之间的分割比例需要遵守一定的规则。页面布局的设计首先需要在浏览网页时考虑用户视觉流的要求:从视觉流向上,用户首先看到页面“ ldquo”,即“ Head”部分的左侧,通常存在一个标识此WEB应用程序的徽标,其次是显示WEB应用程序主要功能的“标识”,“菜单”用于页面导航,其次,用户将在页面左侧看到“标识”,侧边栏,通常也是用于页面功能导航,以及“菜单选择”。相应地,此处的内容可以树状结构显示更详细的功能,下一部分是页面中心的内容部分,用户的视线落在WEB页面的底部。 l在高度方向上,按照黄金分割法将标题和菜单区域划分为上1/3区域; l在宽度方向上,按照黄金分割法,划分左中间1/3区域的侧边栏区域,剩余的下面的空间留给内容区域使用; l在高度方向上,根据黄金分割法,将脚区域划分为下1/3区域,在页面布局中,每个功能区域的划分基于ldquos,pixels和ldquo,按比例,分辨率为1024 * 768作为基准,其中:lHead区域,按照比例方法设置宽度,按照100%设置宽度,并确定高度由固定的像素值占据,一般会占用吗? px,如果有菜单区域,请调整为? px,lMenu区域和ldquo,头的配置要求是相同的,宽度是按100%设置的,高度是结合ldquo来确定的,head的高度设置,一般占? px,lSidebar区域,宽度与ldquo结合,内容的黄金分割率,由固定像素的方式确定,一般占? px,高度按比例设置,l内容区域,高度和宽度方向布局按比例设置,lfoot区域,宽度按100%设置,高度由固定的像素值确定,通常占用? px,1.1.1.1页面显示对于页面布局,除上述要求外,还需要考虑以下要求:l可以适应1024 * 768、800 * 600两种分辨率,l接口级别不超过3层,l默认值在窗口设置下,不应显示水平和垂直滚动条; l当界面内容超出显示区域时,它以浮动层的形式显示,并且根据用户的感觉,对角线的位置屏幕的相交线是用户的直接视图,而页面的顶部四分之一是易于吸引用户注意力的位置,因此在放置页面时要注意这两个位置的使用。要求:父页面或主页的中心位置应设计在对角线焦点附近,子页面的位置应靠近主窗体的左上角或中心,l当需要弹出多个子页面时向上,它们应该移到右下角。最好移动以显示表单标题,l将用户的徽标,主要功能导航和某些系统操作功能放在页面的顶部,1.1.1.2页面美化界面的大小应适合美观,并应感到舒适和舒适。在有效范围内可以吸引用户的注意。建议和要求:l长宽比接近黄金分割点,长宽比不平衡,或者宽度超过长度; l布局合理,不要太密或太空白,合理使用空间,l同一页上的按钮尺寸应保持一致,不同页上的按钮尺寸应尽可能接近。避免你在按钮上使用太长的名称,l按钮的大小应与界面的大小和空间相匹配,l避免在空的界面上放置大按钮,l放置控件后,界面不应有较大的空白位置,l字体大小应与界面大小相协调,常用字体为12px,l前景色和背景色应合理协调,对比度不应太大,主色应柔和,最好少使用深色,例如红色,绿色等,您可以借用Windows界面的颜色,l大型系统中常用的主要颜色是“,E1E1E1”,“ EFEFEF”,“ C0C0C0”等, l界面风格应保持一致,文字,大小,颜色和字体应相同,建议进行艺术处理或特殊要求。建议使用图片表达,l如果表单支持大或放大,则表单上的控件也应随表单缩放,避免仅缩放表单而忽略控件的缩放,l系统对话框页面不应该支持缩放,即仅右上角的关闭功能,通常情况下父窗体支持缩放。当子窗体不需要缩放时,如果用户可以提供自定义界面样式,则选择颜色,字体等,1.2页面字体页面字体属性设置在相应的CSS中定义,页面文本编码要求为UTF-8。指定字体属性时,需要设置:中文在CSS文件中使用ldquo,Arial,英文使用ldquo,Arial或ldquo,verdana,font-family必须具有ldquo,Arial。要在页面属性中设置字体大小,您需要设置不同级别的内容,通常是:nldquo,Head中的标题文本,20px,nldquo,Menu中的导航文本,14px,nldquo,Sidebar中的文本,12px,nldquo ,内容有关页面字体属性的特定设置,文本中的文本(12px或14px),标题(nldquo),脚下的文本(12px或10px),请参阅附录中的CSS示例。
扫描二维码关注我们
确 认