《网页设计标准及网页设计必备知识》由会员分享，可在线阅读，更多相关《网页设计标准及网页设计必备知识（11页珍藏版）》请在金锄头文库上搜索。
1、 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际 526 http:/电话：029- 82085135 82083700 传真：029-88452259网页设计标准及网页设计必备知识一、尺寸1、800*600 下，网页宽度保持在 778 以内，就不会出现水平滚动条，高度则视版面和内容决定。2、1024*768 下，网页宽度保持在 1002 以内，如果满框显示的话,高度是 612-615 之间.就不会出现水平滚动条和垂直滚动条。3、在 ps 里面做网页可以在 800*600 状态下显示全屏，页面的下方又不会出现滑动条，尺寸为 740*560 左右4、在 PS 里做的图到了网上就不
2、一样了，颜色等等方面，因为上面只用到安全色，而中的或者以及或者的色域很宽颜色范围很广，所以自然会有失色的现象.页面标准按 800*600 分辨率制作，实际尺寸为 778*434px页面长度原则上不超过 3 屏，宽度不超过 1 屏每个标准页面为 A4 幅面大小，即 8.5X11 英寸全尺寸 banner 为 468*60px，半尺寸 banner 为 234*60px，小 banner 为 88*31px另外 120*90，120*60 也是小图标的标准尺寸每个非首页静态页面含图片字节不超过 60K，全尺寸 banner 不超过 14K标准网页广告尺寸规格一、120*120，这种广告规格适用于产
3、品或新闻照片展示。二、120*60，这种广告规格主要用于做 LOGO 使用。三、120*90，主要应用于产品演示或大型 LOGO。四、125*125，这种规格适于表现照片效果的图像广告。五、234*60，这种规格适用于框架或左右形式主页的广告链接。六、392*72，主要用于有较多图片展示的广告条，用于页眉或页脚。七、468*60，应用最为广泛的广告条尺寸，用于页眉或页脚。八、88*31，主要用于网页链接，或网站小型 LOGO。广告形式 像素大小 最大尺寸 备注BUTTON 120*60(必须用 gif) 7K 215*50(必须用 gif) 7K通栏 760*100 25K 静态图片或减少运动
4、效果430*50 15K超级通栏 760*100 to 760*200 共 40K 静态图片或减少运动效果巨幅广告 336*280 35K585*120竖边广告 130*300 25K全屏广告 800*600 40K 必须为静态图片，FLASH 格式图文混排 各频道不同 15K弹出窗口 400*300(尽量用 gif) 40KBANNER 468*60(尽量用 gif) 18K悬停按钮 80*80(必须用 gif) 7K流媒体 300*200（可做不规则形状但尺寸不能超过 300*200） 30K 播放时间小于 5 秒 60 帧 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际
5、526 http:/电话：029- 82085135 82083700 传真：029-88452259(1 秒/12 帧)网页中的广告尺寸1.首页右上，尺寸 120*60 2.首页顶部通栏，尺寸 468*60 3.首页顶部通栏，尺寸 760*604.首页中部通栏，尺寸 580*60 5.内页顶部通栏，尺寸 468*60 6.内页顶部通栏，尺寸 760*607.内页左上，尺寸 150*60 或 300*300 8.下载地址页面，尺寸 560*60 或 468*609.内页底部通栏，尺寸 760*60 10.左漂浮，尺寸 80*80 或 100*10011.右漂浮，尺寸 80*80 或 100*1
6、00 以上几种说法可能有点小的出入，大家可以探讨一下。IAB 和 EIAA 发布新的网络广告尺寸标准在这 6 种格式中，除了去年 iab 发布的 4 种“通用广告包”中的格式：160x600, 300x250, 180x150 及 728x90，还包括新公布的 468x60 和 120x600（擎天柱）2 种。二、命名文件夹命名文件夹主要建立以下文件夹：1、Images 存放一些网站常用的图片；2、Css 存放一些 CSS 文件；3、Flash 存放一些 Flash 文件；4、PSD 存放一些 PSD 源文件；5、Temp 存放所有临时图片和其它文件；6、copyright 版权信息（可选）8
7、、readme 说明文件Css 统一命名 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际 526 http:/电话：029- 82085135 82083700 传真：029-88452259注：本 CSS 命名规则只适合物 table 制作模式下1、 css 文件统一放在 css 文件夹下；命名 css.css2、 主样式定义：body、table、td、tr、a3、 链接样式定义：link_white（白色）；link_black (黑色)；link_blue (蓝色) 等等；说明:如有重复的后面加阿拉伯数字;如 link_red01 有下划线的如:link_red_4、
8、文字样式定义：font_red (红色)；font_red_14 (红色 14 号字)；font_red_14b (红色14 号加粗)5、 边框样式定义：border_red_tblr (红色四个边)；border_red_blr(红色底左右三边)；border_red_lr(红色左右两个边)；border_red_b (红色底一个边)等等；6、 表单样式定义：text_100 (文本字段宽为 100)； textarea_200_red (文本区域宽为 200有红色边框)；select_100 (列表宽为 100)；button_150 (按钮宽 150)；说明：表单用宽度定义，在命名中最长
9、写到：“text_100_red”7、 线的样式定义：line_X (横线)；line_Y (竖线)；line_X_red (红色横线)；line_X_red2 (两个像素的红色横线)；说明：在 line 中只定义虚线，实线在 border 中定义8、 其它样式定义：在这里主要定义一些个性化的样式；文件命名head.asp 头文件 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际 526 http:/电话：029- 82085135 82083700 传真：029-88452259foot.asp 底文件index.asp 首页文件sort.html 分类嵌套文件article_
10、channel.asp 文章_频道页article_list.asp 文章_列表页article_detail.asp 文章_显示页注明：如果有多个文章频道,则用 article01,article02,article03 等等exhibit_channel.asp 展会信息_频道页exhibit_list.asp 展会信息_列表页exhibit_detail.asp 展会信息_显示页product_channel.asp 产品中心_频道页product_list.asp 产品中心_列表页prodect_detail.asp 产品中心_显示页corporation_channel.asp 会员
11、_频道页corporation_list.asp 会员_列表页corporation_detail.asp 会员_显示页information_channel.asp 商机信息_频道页information_list.asp 商机信息_列表页information_detail.asp 商机信息_显示页 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际 526 http:/电话：029- 82085135 82083700 传真：029-88452259job_channel.asp 招聘_频道页job_list.asp 招聘_列表页job_detail.asp 招聘_显示页hr
12、_channel.asp 求职_频道页hr_list.asp 求职_列表页hr_detail.asp 求职_显示页job_hr_channel.asp 人才中心_频道页job_hr_lisr.asp 人才中心_列表页job_hr_detail.asp 人才中心_显示页copyright.asp 版权页图片命名1、导航命名：menu_*.gif 如：menu_bg .gif(导航的背景图)2、会员登录：login_*.gif 如：login_bg.gif (会员登陆的背景图)3、搜索命名：search_*.gif 如：search_bg.gif (搜索的背景图)4、小 图 标：ico_数字.gi
13、f 如：ico_001.gif5、线的命名：line_X_颜色.gif 如：line_X_red.gif(红色横向虚线)说明：line 只命名虚线line_Y_red.gif(红色纵向虚线)6、广告命名：ad_数字.gif 如：ad_001.gif 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际 526 http:/电话：029- 82085135 82083700 传真：029-884522597、其它栏目的图片：以栏目名的第一个字母_*.gif如：xwzx_bg.gif (新闻中心背景) cpzx_l.gif (产品中心的左边图)8、产品与栏目热点图片： pic_数字.gi
14、f 如：pic_001.gif说明：上、下、左、右 可以缩写为 T、B、L、RCSS 标准化设计命名1、类 class 的命名规范示例头：header内容：content/container尾：footer导航：nav侧栏：sidebar栏目：column页面外围控制整体布局宽度：wrapper左右中：left right center登录条：loginbar标志：logo广告：banner页面主体：main热点：hot新闻：news下载：download 用心互联 用网服务地址：西安市高新区唐兴路 6 号唐兴数码国际 526 http:/电话：029- 82085135 82083700 传真：029-88452259子导航：subnav菜单：menu子菜单：submenu搜索：search友情链接：friendlink页脚：footer版权：copyright滚动：scroll内容：content标签页：tab文章列表：list提示信息：msg小技巧：tips栏目标题：title加入：joinus指南：guild服务：service注册：regsiter状态：status投票：vot
