网页设计制作规范要求

合集下载

网页设计一般规范

网页设计一般规范一、文件组织规范1．首先创建站点文件夹(使用英文字母命名)。

2．按站点栏目在站点文件夹中创建若干相应子文件夹及图片文件夹image。

3．首页创建在站点根文件夹下，文件名必须是inde某.htm或default.htm。

站点根文件夹下，只能有inde某.htm和若干子文件夹。

4.其他网页文件、图片文件、媒体文件等，都放在对应的子文件夹内。

5.所有文件夹、文件(网页文件、图片文件)命名时，不得含有汉字和空格。

6.所有图片文件需放置在image文件夹内。

二、主页制作规范1．使用表格实现布局，在布局的单元格中添加页面内容。

2．分辨率控制为800某600兼容1024某768(页面居中，不能出现水平滚动条)。

3．有清楚完整的页面结构。

头部的CI标志、主题图片或文字、导航栏。

分块合理安排的主体页面内容。

尾部的版权。

4．有恰当的颜色设计和背景设计(颜色控制在三种、背景使用专用背景图片)。

5．导航栏和所有大小标题进行适当的修饰。

三、普通网页制作规范1．必须放置在相应子文件夹内。

不能放置在站点根文件夹下。

2．页面要有基本的布局(页面居中，分辨率控制8OO某600兼容1024某768)。

所有内容安排在布局好的表格中(一般将表格线隐藏)。

3．一般应安排返回主页或父页的链接。

4.文件大小控制在64K以内（含页内图片文件）。

5．注意各种对齐方式的使用(水平对齐、垂直对齐、内容与边框距离的控制等)。

6.不得遗漏“标题名”的设计制作，形成“无标题文档”。

7．网页页面的高度一般控制在三屏以内，超过三四屏应使用书签(锚点)技术。

四、其他一些规范1．站点和网页的主题明确突出，去除与主题无关的一切东西。

所有应用技术服从于内容的需要，禁用妨碍主题内容的技术。

2．站点中所有网页间的链接有清晰的结构，形成易于漫游的导航系统，不得出现任何一页没有相应的链接，让用户点击“后退"按钮3．所有网页不得出现任何一个无效链接和无效图片。

《网页设计与制作》相关规范—网站设计通用规范

Xingtai Polytechnic College《网页设计与制作》—相关规范网站设计规范（通用）一、设计风格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、图片的分类及命名规则(1) 名称分为头尾两两部分，用下划线隔开。

(2) 头部分表示此图片的大类性质，例如广告、标志、菜单、按钮等等。

(3) 一般来说:⏹放置在页面顶部的广告、装饰图案等长方形的图片我们取名：banner⏹标志性的图片我们取名为：logo⏹在页面上位置不固定并且带有链接的小图片我们取名为buttonXingtai Polytechnic College《网页设计与制作》—相关规范⏹在页面上某一个位置连续出现，性质相同的链接栏目的图片我们取名：menu⏹装饰用的照片我们取名：pic⏹不带链接表示标题的图片我们取名：title⏹依照此原则类推。

网页设计规范尺寸

网页设计规范尺寸网页设计规范尺寸是指在进行网页设计时应遵循的一些标准尺寸。

这些规范尺寸可以帮助设计师在设计过程中更好地控制页面布局和元素的排列，提高用户体验和可视效果。

以下是一些常见的网页设计规范尺寸：1. 页面宽度：大多数网页设计采用固定页面宽度，一般为960像素或1000像素。

这个宽度可以适应大多数用户的屏幕分辨率，确保网页内容在任何设备上都能良好地呈现。

2. 头部和导航栏高度：头部和导航栏是网页重要的组成部分，它们通常设置为固定高度，一般为80像素。

这个高度可以容纳Logo、导航链接和搜索框等元素，让用户方便地浏览和导航网页。

3. 内容区域宽度：内容区域是展示网页主要内容的地方，通常占据页面的大部分宽度。

内容区域的宽度一般为实际页面宽度减去头部和侧边栏的宽度。

在1000像素宽度的设计中，内容区域宽度可以设置为900像素左右。

4. 侧边栏宽度：侧边栏通常用于放置一些与主要内容相关的附加信息或小工具，比如相关链接、标签云、社交媒体图标等。

侧边栏的宽度一般为页面宽度减去内容区域宽度后的剩余宽度，通常在100像素左右。

5. 图片尺寸：在网页设计中，图片是非常重要的元素之一。

为了保持网页的加载速度和可视效果，设计师需要对图片进行适当的压缩和尺寸调整。

常见的图片尺寸包括：头部背景图（通常为全屏宽度）、产品图片（一般为正方形或3:2比例）、轮播图（一般为全屏宽度）等。

6. 字体大小：在网页设计中，文字的可读性非常重要。

适当选择合适的字体大小可以保证用户能够方便地阅读网页内容。

通常，正文字体大小可以设置为14像素，标题字体大小可以设置为16-20像素。

7. 按钮尺寸：按钮是常用的交互元素，在网页设计中具有重要的功能。

按钮的尺寸应该根据其重要性和所需的点击区域来确定。

一般而言，按钮的高度可以设置为30像素，宽度可以根据文本长度和设计布局来调整。

总结起来，网页设计规范尺寸涵盖了页面宽度、头部和导航栏高度、内容区域宽度、侧边栏宽度、图片尺寸、字体大小和按钮尺寸等。

网页设计规范标准

网页设计规范标准1. 页面布局- 使用响应式设计，确保网站在不同设备上的适配。

- 采用网格布局，并保持一致的栅格系统。

- 合理利用空白区域，使页面整洁有序。

- 页面元素排列有序，遵循阅读顺序和重要性原则。

2. 色彩搭配- 选择合适的配色方案，使页面达到良好的视觉效果。

- 在不同的页面部分使用一致的色彩搭配，保持整体风格的统一。

- 注意色彩的对比度，以确保文字和其他元素易于阅读和辨识。

3. 字体选择- 使用合适的字体组合，使页面文本易于阅读且与整体风格相匹配。

- 字号的大小要适合不同设备上的阅读体验。

- 控制使用的字体种类数量，避免出现混乱和不协调的情况。

4. 图片与图标- 使用高质量的图片和图标，以提升用户体验。

- 优化图片大小和格式，以减小页面加载时间。

- 图片和图标要与页面主题相关，并具有清晰的表达意义。

- 设计简单明了的导航菜单，使用户能够轻松找到所需的信息。

6. 响应交互- 界面元素的交互要及时响应，并反馈给用户。

- 保持一致的界面反馈和动画效果，提升用户体验。

- 控制页面加载时间，提高网站的整体性能。

7. 页面内容- 内容排版清晰明了，段落分明，信息分类清晰。

- 使用简明扼要的语言表达，避免冗长和复杂的句子。

- 注意语法和拼写错误，确保内容的准确性和可读性。

8. 辅助工具- 为用户提供可访问的页面，考虑视觉障碍和其他辅助工具的使用。

- 提供搜索功能，方便用户快速检索信息。

- 确保页面文字和背景的对比度适宜，以满足辅助工具的要求。

以上为网页设计规范标准的一些基本要求。

在设计网页时，应综合考虑用户体验、视觉效果、页面可访问性等方面的因素，以提供优秀的网页设计作品。

web网页设计规范

web网页设计规范网页设计规范是指在设计和制作网页时应遵循的一系列规则和标准，旨在提高网页的可用性和用户体验。

以下是一些常见的网页设计规范，以帮助您制作出优秀的网页：1. 布局规范：- 使用网格系统：网格系统能帮助您保持页面的一致性和平衡感，同时也能让内容更易于阅读和理解。

- 使用响应式设计：确保您的网页能够适应不同的屏幕尺寸和设备，以提供更好的用户体验。

- 保持简洁明了：避免使用过多的装饰和不必要的元素，使页面看起来干净和易于理解。

2. 导航规范：- 显眼的导航栏：将主要的导航链接放置在页面的顶部或左侧，让用户能够轻松地找到所需信息。

- 使用面包屑导航：面包屑导航能够告诉用户当前所处的页面位置，方便用户进行导航和返回。

3. 字体规范：- 使用易于阅读的字体：选择适合在线阅读的字体，确保字体大小和间距合适，不影响用户的浏览体验。

- 限制字体种类和大小：过多的字体样式和大小会给用户带来混乱和困惑，尽量限制使用。

4. 图像和多媒体规范：- 优化图像和视频：确保您的图像和视频都经过压缩和优化，以提高页面加载速度和用户体验。

- 提供替代文本：对于图片和视频，提供替代的文本描述，以便于辅助技术用户和搜索引擎理解内容。

5. 颜色规范：- 使用品牌颜色：网页的颜色应与品牌色调相一致，以增加品牌识别度。

- 考虑色盲用户：避免依赖过多颜色来传达信息，确保页面的可读性和可理解性，特别是对于色盲的用户。

6. 可访问性规范：- 使用语义化标签：使用正确的标签来描述页面内容，以提升可访问性和搜索引擎的理解。

- 提供键盘导航：确保用户可以使用键盘进行导航和操作，尤其是对于残障用户。

7. 页面加载速度规范：- 压缩和优化文件：确保所有的代码和媒体文件（如图片和视频）都经过压缩和优化，以提高页面的加载速度。

- 使用缓存机制：利用浏览器缓存来提高页面的加载速度，减少用户等待时间。

总结：以上是一些常见的网页设计规范，通过遵循这些规范，您可以制作出易于使用和高效的网页，提供良好的用户体验。

网页设计制作规范要求

网页设计制作规范要求由于互连网的日异普及，客户对网站设计、制作的要求有了很大的提高，因此，我们要把握好每一个细节,使网页设计制作的水平更上一层楼。

以下是网页制作的一些注意事项，希望大家能引起重视.一、网页制作中〈head></head>中必写信息：1、〈title〉**＊＊＊＊</title>＊＊*＊＊*为关键字—-公司名称，不要超20个汉字或100个字母，这一项一般问题不大，但英文公司标题切不可每个字母都大写，这一点一定要注意，中文网站写中文,英文网站写英文,每个页面均要写。

2、语言规范英文版<meta http—equiv=”content—type”content="text/html; charset=iso—8859—1"> 中文版〈meta http—equiv="Content—Type”content=”text/html；charset=gb2312"〉繁体中文<meta http-equiv=”Content—Type”content="text/html；charset=big5"〉3、〈META NAME=”Keywords" CONTENT=”＊**＊**">＊**＊*＊为关键字项，其字数中文控制在25—30单词/字内, 英文控制在3、4百个字符。

（在中文搜索引擎中，一个标点，一个阿拉伯数字，一个英文字母均算一个；在英文搜索引擎中，一个标点,一个阿拉伯数字,一个英文单词均算一个，要求是将重点关键词放在最前面；不要带有排他性描述文字，如最大，最好,第一等；也不要全部由产品简单的罗列堆砌而成；不要与Title，Description有重复描述，否则不仅降低描述质量,而且还无端浪费有限的“介绍文字”资源；故这些最好由业务员在与客户签约时，请厂家来确定，以免不必要的修改，最重要的是以后修改效果可能不太好)”4、<META NAME=”Description" CONTENT=”******” >*＊*＊*＊为网站描述项，其字数中文控制在25-30单词/字内，英文控制在3、4百个字符。

网站设计知识：网页尺寸设计规范,全靠这份最新指南

网站设计知识：网页尺寸设计规范，全靠这份最新指南近年来，随着互联网的普及与发展，网站已经成为人们获取信息、实现交流的重要平台。

而网站的设计尺寸则是网站设计过程中的重要环节之一。

网页尺寸设计规范的具体规定对于网站设计师来说是必不可少的指南。

本文将就网页尺寸设计的规范进行详细的解读和讲解。

一、规范原则在网页尺寸设计规范中需要遵循的原则包括以下几点：1.保持页面整洁。

页面元素不要过于复杂，应该简洁明了，避免出现模糊不清、混乱的页面。

2.优化图片大小。

过大的图片不但会影响页面速度，还会占用大量的带宽资源。

优化图片的大小可以减少页面加载时间，同时也能够提高用户的体验。

3.合理设置页面尺寸。

网页尺寸必须适应各种不同的设备，不同的屏幕分辨率，同时还需要兼顾用户体验。

4.确定页面宽度。

页面宽度和用户体验有着密切关系。

网页的宽度应该是合适的，既保证页面的内容丰富性，又保证了页面的美观和用户体验。

二、移动端网页设计尺寸在如今的移动端设备上，网页的尺寸设计变得都很关键。

而对于移动端网页设计，它的尺寸设计需要适应不同的移动设备，将网页呈现出来的同时还要保证呈现的效果。

因此，对于移动端网页设计的尺寸要求比较高，要适应不同的屏幕大小。

1. iPhone网页设计尺寸对于iPhone设备来说，网页的设计尺寸应该在320 - 480px之间。

这样能够适应iPhone和iTouch设备，保证了在iPhone上呈现的效果。

在iPhone上呈现的效果非常重要，在设计时需要考虑到这一点，保证网页在iPhone上的清晰显示。

2. iPad网页设计尺寸对于iPad这样的大屏幕设备来说，网页的尺寸需要更大。

在iPad 上呈现的效果要比在普通电脑上更重要。

在设计时需要保证网页设计的尺寸在1024 × 768像素左右，同时还要保证不失去网页的美感。

三、PC端网页设计尺寸对于PC端网页设计尺寸来说，其设计需要考虑到电脑的屏幕大小、屏幕分辨率、显示器性能等多个因素。

网页设计尺寸规范

网页设计尺寸规范网页设计尺寸规范是指在设计和开发网页时，应该遵循的一些规定和标准，以确保网页的适配性和可用性。

下面是关于网页设计尺寸规范的一些要点。

1. 响应式设计：随着移动设备的普及，响应式设计已成为设计师必备的技能。

响应式设计是指根据用户使用的设备不同，自动调整网页布局和尺寸的设计方法。

网页应该能够适应不同的屏幕尺寸和分辨率，包括手机、平板电脑和桌面电脑。

2. 流体网格：为了适应不同屏幕尺寸，网页布局应使用流体网格。

流体网格是指使用比固定像素单位更灵活的相对单位（如百分比和em），以确保网页布局的比例和比例在不同屏幕上保持一致。

这样可以使网页在不同的屏幕上看起来更统一和一致。

3. 最小宽度：为了确保网页在小屏幕上可用，应设置一个最小宽度。

最小宽度是指当屏幕宽度小于某个值时，网页布局将自动调整以适应屏幕。

通常，最小宽度应设置为移动设备的最小分辨率，以确保网页在所有设备上都能正常显示和使用。

4. 图片和媒体：在设计网页时，应根据不同设备的屏幕尺寸和带宽限制，选择合适的图片和媒体文件。

为了提高网页的加载速度，应该尽量减小图片和媒体文件的大小，并使用适当的压缩和格式转换技术，以确保在所有设备上都能快速加载。

5. 字体大小和行间距：为了确保网页在不同屏幕上都能正常阅读和理解，应选择合适的字体大小和行间距。

字体大小应不小于12像素，并在大屏幕上适当增大。

行间距应适当增加，以便在不同屏幕上的文字更清晰和易读。

6. 导航和按钮：导航和按钮是用户导航和交互网页的关键元素。

为了确保导航和按钮在不同屏幕上容易点击和使用，应选择合适的大小和间距。

导航和按钮的大小应不小于44像素，并在大屏幕上适当增大。

7. 色彩和对比度：色彩和对比度是网页设计中重要的视觉元素。

为了确保网页的可读性和可用性，应选择合适的颜色和对比度。

文本颜色和背景颜色应有足够的对比度，以便在不同屏幕上易于阅读。

总结起来，网页设计尺寸规范包括响应式设计、流体网格、最小宽度、图片和媒体、字体大小和行间距、导航和按钮、色彩和对比度等要点。

1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。

网页设计制作规范要求由于互连网的日异普及，客户对网站设计、制作的要求有了很大的提高，因此，我们要把握好每一个细节，使网页设计制作的水平更上一层楼。

以下是网页制作的一些注意事项，希望大家能引起重视。

一、网页制作中<head></head>中必写信息：1、<title>******</title>******为关键字--公司名称，不要超20个汉字或100个字母，这一项一般问题不大，但英文公司标题切不可每个字母都大写，这一点一定要注意，中文网站写中文，英文网站写英文，每个页面均要写。

2、语言规范英文版<meta http-equiv="content-type" content="text/html; charset=iso-8859-1">中文版<meta http-equiv="Content-Type" content="text/html; charset=gb2312">繁体中文<meta http-equiv="Content-Type" content="text/html; charset=big5">3、<META NAME="Keywords" CONTENT="******”>******为关键字项，其字数中文控制在25-30单词/字内, 英文控制在3、4百个字符。

（在中文搜索引擎中，一个标点，一个阿拉伯数字，一个英文字母均算一个；在英文搜索引擎中，一个标点，一个阿拉伯数字，一个英文单词均算一个，要求是将重点关键词放在最前面；不要带有排他性描述文字，如最大，最好，第一等；也不要全部由产品简单的罗列堆砌而成；不要与Title,Description有重复描述，否则不仅降低描述质量，而且还无端浪费有限的“介绍文字”资源；故这些最好由业务员在与客户签约时，请厂家来确定，以免不必要的修改，最重要的是以后修改效果可能不太好）"4、<META NAME="Description" CONTENT="******” >****** 为网站描述项，其字数中文控制在25-30单词/字内, 英文控制在3、4百个字符。

（在中文搜索引擎中，一个标点，一个阿拉伯数字，一个英文字母均算一个；在英文搜索引擎中，一个标点，一个阿拉伯数字，一个英文单词均算一个；不要带有排他性描述文字，如最大，最好，第一等；也不要全部由产品简单的罗列堆砌而成；不要与Title，Keywords有重复描述，否则不仅降低描述质量，而且还无端浪费有限的“介绍资源”；故这些最好由业务员在与客户签约时，请厂家来确定，以免不必要的修改，最重要的是以后修改效果可能不太好）5、<META NAME="Author" CONTENT="******">******为客户网站的email地址。

二、网站所有页面上的版权所有书写规范：1、化工网英文版源代码为： Copyright(C)2005,****** All Rights Reserved. Supported by   <a href="">ChemIndex</a>    <a href=""> <a href="">ChemNet</a>   <a href="">ChinaChemNet</a>2、化工网中文版源代码为：****** 版权所有(C)2005 网络支持 <ahref="">化工搜索</a> <a href="">中国化工网</a> <a href="">全球化工网</a> 1、纺织网英文版源代码为： Copyright(C)2005,****** All Rights Reserved. Supported by<a href="">ChinaTexNet</a>  <fontface="Arial, Helvetica, sans-serif" > <ahref="">TexWeb</a> 2、纺织网中文版源代码为：****** 版权所有(C)2005 网络支持<a href="">中国纺织网</a> <a href="">国际服装网</a> <a href="">纺织搜索</a> 三、联系电话书写格式：1、中文版可以为区号+电话号码，如82、英文版必须为：+86- 。

（手机：+86-13*********）3、电子邮件：若客户确实没有email的，在电子邮件一栏中，必须写为<a href = “mailto:***< >” > </a>其中：***为客户的域名或简易版的目录。

四、制作过程中需要注意的地方：1.在文字输入、设计或制作时特别要注意客户的单位名称、总经理姓名、电话、传真、Email等信息的正确无误。

2.英文版中不要出现中文字符及中文标点，如：“℃”、“≤”、“≥”等，必要时用图片处理3.制作中，要特别注意分子式的上下标是否正确。