网页设计基本规范

网站建设知识 phpacg 3年前 (2018-04-24) 134次浏览 0个评论

1 文档规范

一个网站由各类网页文档组成。网站制造进程中首先要掌握的是文档规范, 它包括结构规范和命名规范。规范的文档结构会使网页功用明白、文件分类合理。而规范的命名可以让网页编辑起来更方便, 查找文件更容易, 而且可以增加非技术缘由形成的网页或内容不能正常显示。所以遵照基本的文档规范是十分必要的, 可以说它是优秀网页设计的基础。

2. 结构规范

合理的文档结构便于网站的维护, 方便内容的更新和移动, 在树立文档结构时应遵照以下规范。

首先, 要树立网站根目录文件夹, 寄存一切的网页文档。

其次, 要在根目录下树立公用子目录。如 Images、Function 等, 其中 Images 用于寄存网站设计制造的一切公用图片, Function 普通用于寄存一些公用特效顺序、样式表等。如有需求还可以树立多媒体文件夹 Multimedia,寄存 Flash、视频、音频等媒体文件。

然后, 在根目录下树立各栏目文件夹。依据需求可以在每一个栏目中新建 images 等子目录, 用来寄存该栏目公用图片。假设这个栏目的内容特别多, 又分出很多子栏目, 可以相应的再树立其他目录。

3. 命名规范

网页设计中各类文档命名普通应遵照以下规范:尽量将一切目录、文件的称号用小写英文字母、数字、下划线的组合, 其中不得包括汉字、空格和特殊字符; 普通目录称号所用的英文具有一定的实践意思, 便于日后修正。如有必要, 建议用文本文件(Read.txt) , 将一切的目录、网页文件加以注解。

对网页命名, 网站首页普通取名 index 或 Default, 旧事类页可以用 news 等。

图片的命名准绳普通如下:放置在页面的广告图案等取名为 banner, 标志性的图片取名为 logo, 在页面上带有链接的小图片取名为 button, 主栏目和子栏目的图片取名 menu, 修饰用的照片取名 pic, 静态网页中的图片可以用时间数字组合命名, 如 2008210101201.gif 等.2.2 设计规范2.2.1 规划规范一张美丽的网页, 除了内容丰厚、图片美丽以外, 还需求合理的页面规划。合理的规划会使你的网页中心突出、页面平衡、更让阅读者爽心顺眼。

常用的网页规划方式有表格, 框架和层。作为网页设计初学者普通建议采用表格规划。

表格规划时普通应留意以下几点:一个页面要尽量防止运用整张大表格。假设一张网页是嵌套在一个大表格之内, 当用户输入网址后, 将等候较长时间才同时显示网页内容。这是由于阅读器在解释页面的元素时, 是以表格为单位逐一显示。

规划表格普通设置边框为虚线, 间距和填充都为 0, 表格的高度普通不作设置。

表格嵌套尽量不要超越 3 层。

表格尽量少的运用兼并或拆分单元格。假设有过多的拆分兼并会不方便日后的网页更新。

4. 内容规范网页的基本组成局部包括文本、图片、多媒体、脚本、样式和超级链接等元素。合理规范的运用这些元素, 会使主题鲜明、作风分歧, 更能不时地吸引阅读者停止访问。

1)文字和图片规范: 文字是网页的主体, 传达各类信息。而图片常用来装饰、美化, 增添信息的视觉效果。

网页文字普通分注释、标题等, 这些内容通常采用不同的字号、样式和颜色来改善文字效果。为了保证在不同阅读器上字号坚持分歧, 字号建议用点数 pt 来定义, 普通注释宋体运用 9pt 和 11pt。标题字号可依照详细状况设置。

网页中图片的运用增添了生机, 丰厚了内容, 但图片运用的时分也要考究规范。图片在网页中最好不要运用“Width、height”两属性来设置宽度、高度, 即不要改动图片的原始大小。如改动了, 会使图片失真。图片普通要加上替代文字, 作用一是当图片无法显示时, 可以显示替代文字, 二是鼠标停在图片上后出现替代文字, 相当于图片的说明。

2)超链接设置规范: 超链接是一个网站的灵魂, 经过它用户可以在网站上的各个页面之间停止跳转。为了保证网页之间的正常链接, 方便网站移植, 通常将站内各网页间的超链接途径采用相对途径, 不能写成如<a href=”file://c:/news/view.htm”>这样的方式。一

般链接到某一目录下的缺省文件的链接途径不用写全名。

普通在旧事类的链接会加上标题, 显示旧事主题、作者、时间等。

如: <a href=”news/view1.htm” title=”标题: xxxxx,作者: xxx,时间: xxx”>站外链接都采用相对途径, 如友谊链接等。

3)CSS规范:为了保证某些内容的作风分歧, 可以运用层叠样式表(CSS)来区分定制样式。样式表普通分三种方式, 即外链式、内联式和内嵌式。

普通将公用的样式全部保管在一个样式表文件(*.css) 中, 然后在需求用样式的网页中经过<link>标志链接此文件。假设只在某张网页中运用样式, 可以运用内联式方式; 假设只在某个标志内用, 可以采用内嵌式方式。

喜欢 (0)
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址