2024年官网网页设计规范(共7篇)

官网网页设计规范 第1篇

①  新建画布

②  页面尺寸:1000px * 768(内容区域)

                        1440 px  比较常用

                        1920 px  比较流行 

                        2560 px  苹果 MAC 27 寸适用 

③  分辨率:72

④  颜色:RGB 8 位 

官网网页设计规范 第2篇

①  页面布局:header、banner、main、footer

②  常用字体:宋体 - 无(12-14px),无版权,可以免费使用

                  微软雅黑 - 锐利(12-14px),有版权,商用要购买版权

③  特殊字体:方正字体、汉仪字体(有版权,商用要购买版权)

④  广告法禁用词汇:禁止使用 “国家级”、“最高级”、“最佳” 等用语

字体介绍 

        字体具有多种不同的风格,每种风格都适用于不同的场景和用途。以下是一些常见的字体风格及其适用场景的简要介绍:

①  Regular(常规):常规字体是字体家族中最基本和常见的风格。它适用于大多数正文文本和一般排版情况,也被称为普通字体或标准字体。

        _Regular_ 字体风格通常具有中等的笔画粗细和一般的字形设计,没有特别的修饰或强调。它是字体家族中的默认样式,用于大部分正文文本和一般排版的情况。其他字体风格,如_bold_(粗体)、_italic_(斜体)和_light_(轻体),通常是基于 _regular_ 样式进行变化和扩展的。因此,当你选择一种 _regular_ 字体时,你会得到一种中等粗细的字体,适合在大多数正常文本场景中使用。

②  Bold(粗体):粗体字具有更加明显的笔画粗细,用于突出和强调文字内容。它通常用于标题、子标题、重要的关键词或需要引起注意的部分。

③  Italic(斜体):斜体字具有文字向右倾斜的外观。它常用于强调特定文字、引述、书名、科学名称或外来语词汇。斜体字也可以用于添加一些倾斜和动态感觉。

④  Light(轻体):轻体字较为细薄,通常用于辅助排版、注释、引用等较小的文字内容,或者在需要柔和、优雅的设计风格时使用。

⑤  Thin(细体):细体字比轻体更加纤细,适用于特定的设计风格,如时尚、艺术或品牌标识等。

⑥  Black(黑体):黑体字非常粗黑,用于需要极强视觉冲击力和醒目效果的场景,如大标题、标语、海报等。

⑦  Condensed(紧缩体):紧缩字体具有较小的字符间距,用于在有限空间中显示更多文本内容,例如窄栏排版、标签、报纸标题等。

⑧  Extended(加宽体):加宽字体具有较大的字符间距,用于强调宽敞、稳重或霸气的设计风格,例如大字标题、商标等。

⑨  Decorative(装饰性字体):装饰性字体具有独特的造型和装饰元素,适用于特殊场合和创意设计,如节日活动、广告、标志等。

        这些只是一些常见的字体风格示例,实际上还有许多其他独特的字体风格和变体可供选择,以满足不同的设计需求和品牌风格。选择合适的字体风格取决于文本内容、排版需求、品牌风格和目标受众等因素。

官网网页设计规范 第3篇

        网页设计规范包括用户友好的 界面设计、一致的 导航结构、易读的 内容排版、合适的 配色方案响应式设计 等。这些规范旨在提供良好的用户体验,确保网页易于浏览和操作,并在不同设备上保持一致的外观和功能。

官网网页设计规范 第4篇

①  Banner 是什么呢?

②  Banner 的作用是什么? 

        宣传、展示、广而告之,或者是能给企业、产品或者人带来相应的转化率。

③  Banner 由哪些部分组成呢?

        主要是由文案、商品图或模特、背景图四项中的至少一项组成。 

①  纯色背景 

②  图案/渐变背景 

③  形状背景 

④  立体空间形状 

⑤  场景形式 

⑥  场景合成 

构图:就是把各部分组合,配置并加以整理出一个艺术性比较高的画面

        如果将一张脸比喻成一幅设计作品,五官便是其中的元素,而脸型则是构图之魂。

①  上下构图 

②  左右构图 

 

③  文字居中 

⑤  三角构图 

⑥  斜线构图 

①  左对齐 

②  右对齐 

③  居中对齐 

  

④  矩形对齐 

⑤  圆形对齐 

⑥  三角对齐 

官网网页设计规范 第5篇

1、路径/文件名设定 路径/文件命名时一律采用小写英文字母、数字、下划线的组合,其中不得包含汉字、空格和特殊字符;目录的命名请尽量以英文翻译为优先,尽量避免使用拼音作为目录名称2、路径/文件名称需与栏目菜单名称具有相关性 3、 各路径下的开始文件,命名为index.* 静态文件为,动态文件为、 文件名中用___下划线作为连接符。5、 如页面文件过长需要拆分,建议多个文件按顺序依次命名为filename01.*、filename02.*…… 内容不同但属于同类的,且需定期更新的页面文件或文本采用: 名称缩写+(年份)+月份+日期+序号 ,如= news081508.*6、大流量网站的首页和各栏目首页尽量使用以html为文件后缀名的静态页面。其他经 常访问的动态页面也建议模拟为静态页面。

官网网页设计规范 第6篇

1、依照网站的定位确定整体的设计风格。 2、主体框架页面、内容页尽量采用方型结构。禁用长距离的斜线及弧线结构,可允许小范围内的斜线及弧线。封面页、专题页可不受此限制。 3、设计时尽量在方块区边缘、按钮、标题装饰块上体现设计技巧,拐角可以有曲线变化。拐角块最大不得超过18像素。同一页面弧度尽量保持一致。 4、各主要栏目之间要求使用一致的布局,包括一致的页面元素;一致的导航形式,使用相同的铵钮,相同的顺序。可跟首页有变化。 5、首页及各级页面都必须带有网站的LOGO(建议小于150×54),并链接到网站首页。6、统一按兼容分辨率800*600设计。为了使显示更友好,建议使用778或者760 px设计。7、网站页面长度建议1屏半到2屏。原则上长度不超过3屏,宽度不超过1屏。根据用户习惯和网站需要,国内中文网站综合类、门户类(包括垂直门户)网站可设计超过3屏。 二、图形设计规范

1、 图片标准尺寸全尺寸banner为468×60px,半尺寸banner为234×60px,小logo为88×31px另外150×68、120×90,120×60也是标准尺寸,网站logo一般控制在150×54以内,客户要求或特殊广告图片可另定尺寸。建议首页存储大小不得超过150K(包括图片),其它页面经压缩后尺寸不得超过70K。

2、 图片的分类及命名规则☆ 名称分为头尾两两部分,用下划线隔开。☆ 头部分表示此图片的大类性质,例如广告、标志、菜单、按钮等等。☆ 一般来说:放置在页面顶部的广告、装饰图案等长方形的图片我们取名:banner标志性的图片我们取名为:logo在页面上位置不固定并且带有链接的小图片我们取名为button在页面上某一个位置连续出现,性质相同的链接栏目的图片我们取名:menu装饰用的照片我们取名:pic不带链接表示标题的图片我们取名:title依照此原则类推。 ☆ 尾部分用来表示图片的具体含义,如果有类似图片就用数字区别。 ☆ 下面是几个样例,大家应该能够一眼看明白图片的意义: , ☆小标一定做成透明的。

3、Banner制作要求 1)_anner(468×60Pixel)容量尽量限制在15K内,格式尽量选用GIF及动态格式。 2)帧切换时尽量半静半动。少用满底256色以上的图像。闪切变化主要体现在文字上。 3)广告条的border设为0,并要求加上alt说明。

4、图标和图片 1)在图标的制作上应采用简捷,色彩明快的图标;在选用单色图标时应根据本栏目的色彩进行搭配。 2)图标存储为GIF格式(除个别情况外),尽量采用16色、填充色或单色。 3)图片依情况存成GIF或JPEG格式,原则上色调单一的图片存成GIF格式,色彩复杂、层次丰富的存在JPEG格式。 4)设计时不得用15K以上的图片,如图片过大可以考虑采用图片分割的办法。 5)内容图片、导航图片的border设为0,并要求加上alt说明。 6)普通图片不必加alt说明,但如果有链接要把border设为0。 7)公用图片或有可能更换的图片不要指定图片的尺寸大小(width,height)。

官网网页设计规范 第7篇

1、新闻、信息类通常用新开窗口方式打开。2、顶部导航、底部导航通常采取在本页打开,特殊栏目和功能可新开窗口。3、链接带下划线为链接通常的默认风格,顶部导航或特殊位置为了观赏性可用样式表取消下划线。4、链接的颜色可配合主题颜色风格改变,通常为蓝色、暗蓝色、黑色,但激活后的链接颜色、鼠标移动其上时的链接颜色要同本身颜色进行区分。

六、页面制作规范

1、色彩规范 1)根据网站性质,避免在一个页面上有太多的色彩,活泼但不失稳重,颜色柔和但不乱2)文字的色彩要与页面协调。 3)即使页面有背景图片,也应该设置背景色,通常默认设置背景色为白色

2、表格 1)定义表格宽度时使用绝对值(指定像素)。 2)内嵌最大表格宽度为775pix,align=left (前提在设定为778pix的框架内)3)页面中从上至下尽量拆分成多个层叠的表格,尽量用TBODY这个标签可以控制表格分行下载,当表格内容很大时比较实用,在需要分行下载处加上

3、字体 1) 为了保证不同浏览器上字号保持一致,字号建议用点数pt和像素px来定义,pt一般使用中文宋体的9pt和11pt,px一般使用中文宋体12px 和 这是经过优化的字号,黑体字或者宋体字加粗时,一般选用11pt和 的字号比较合适。2) 大小为9pt时,行距为120%;信息类最终页面采用弹出方式,标题及正文字体规定为11pt,行距为140%。所有页面字体大小建议不要超过11pt。 3) 考虑字体大小的兼容性,避免使用size=2的方式定义,尽量使用pt或px并用css定义4)文字颜色与页面配色协调,不使用与背景色相近的颜色。 5) 非图像设计的字体一律采用windows标准宋体。(如果做特殊效果需做成图)要加粗文字用Bold,不要用Strong。 6) 页面文本不使用下划线方式,也尽量少采用粗体显示。

4、CSS书写规范1)所有的CSS的尽量采用外部调用2)代码较长的首页和重要栏目首页可直接内嵌CSS,避免调用时间太长,使页面未及时调用CSS风格而显得凌乱。3)书写时重定义的最先,伪类其次,自定义最后(其中a:link a:visited a:hover a:actived 要按照顺序写)便于自己和他人阅读。

5、JS调用规范所有的javascript脚本尽量采取外部调用

6、首页head区代码规范head区是指首页HTML代码的和之间的内容。 head区必须加入的标识 1)公司版权注释 2)网页显示字符集 例如:简体中文:繁体中文:英 语:3)网站简介4)搜索关键字5)网页的css规范网页标题 收藏夹图标

7、错误页面规范所有程序出错页面、找不到的页面不要使用默认的出错提示,要设计为带网站标识和说明的个性化的出错提示页面。

8、所有页面必须均需经过浏览器兼容测试,通常须支持主流浏览器IE、Firefox。

来自: 思奇剑 > 《文档资料》

0条评论

发表

请遵守用户 评论公约

网站制作规范

公司内部网站设计规范

比如: 格式的网页全部用 .htm 命名3.主索引页名称为 或者.目录的命名请尽量以英文为指导。

Div CSS布局入门教程(三)

猜你喜欢

热门内容

  • 友情链接:
  • 蒲城响应式模板 沂南网站建设制作 中阳中国万维网 巩留域名建站 繁峙免费网址 阳明电商平台开发 运河企业官网建设 云阳企业网页制作 迎泽手机网站开发 威远网络推广电话 偃师排名优化公司 十堰网站建设方案 临泽网站的优化 伊川网站优化 诗晨网络科技 广州登领贸易有限公司 砀山顺德网站建设 余庆外贸网站设计 澳门网站的优化 藁城医院网站建设 武汉凌峰万基汽车服务有限公司 伊吾怎样做网站 巴塘网站推广优化 潼关网页设计模板网站 湖南网站建设步骤 嵊泗企业做网站 玛沁优秀网页设计 新邱定制网站 班玛旅游网站建设 怀远网页设计实例 尖扎谷歌企业邮箱 心月健康网 桓台网站定制 深泽怎么建设网站 泸西企业网站制作 孝南制作企业网站 晋宁直销网站建设 秭归网络推广网站 茌平网站建设介绍 夏河怎样制作网页 汤阴企业网站建设 衡阳企业网站建设 历下企业网站建设 甘谷企业网站建设 佛山企业网站建设 新华企业网站建设 裕安企业网站建设 融安企业网站建设 宜丰企业网站建设 东港企业网站建设 林口企业网站建设 平南企业网站建设 九原企业网站建设 汉滨企业网站建设 龙岩企业网站建设 北湖企业网站建设 延庆企业网站建设 西夏企业网站建设 措美企业网站建设 龙里企业网站建设 保德企业网站建设 勐腊企业网站建设 乐至企业网站建设 哈密企业网站建设 平坝企业网站建设 晋安企业网站建设 西峰企业网站建设 印台企业网站建设 铅山企业网站建设 宁武企业网站建设 阿克苏seo关键词优化 济源建站程序 马鞍山网站代运营 天峻网页设计制作 珠海网站建设技术 庆城外贸推广 德保人才网 茂名橘子建站 宣汉网站设计报价 广西网站设计方案 金川建站公司 庐阳怎么做网站 松江公司网站建设 台东营销型网站 金安dede仿站 娄烦网站设计欣赏 曲靖网站建设技术 鹤壁网页改版 新会网站优化外包 德昌网站建设设计 双牌如何建设网站 图木舒克制作网站 万秀如何推广网站 阜平网站方案 旺苍微信定制开发 鹿邑怎么做网站 北屯网页制作 金林建网站的公司 吉安网站推广 杂多免费网站制作 西畴网站开发公司 榆次网站定制 铜仁网站建设知识 逊克如何制作网页 创业之家网 阜新网站建设技术 秦皇岛公司网络推广 致连网站 - 上海致连网络科技有限公司 菏泽设计网站公司 绥中手机网站开发