勤学思培训网RRHQXD
  • 终于明白网页设计知识点总结

    网页设计知识点总结

    网页设计中的绝对路径包括服务器在内的完全路径。优点是:与链接的源端点无关;缺点是:测试时必须在Internet服务器端进行,不利于站点的移植。下面是网页设计知识点总结,希望对您有所帮助。

    [图片0]

    一、超链接

    URL:Uniform Resource Locator,统一资源标识符。

    绝对路径:包括服务器在内的完全路径。优点:与链接的源端点无关;缺点:测试时必须在Internet服务器端进行,不利于站点的移植。

    相对路径:与原端点的位置相关,即源端点与目标端点之间的相对位置。目标文件在同一目录下:文件名称;在当前目录的子级目录下:子级路径+文件名称;在当前位置的父级目录下:用“..”符号表示当前的父级目录,该符号可以使用多次来表示更高的父级目录。

    链接分为内部链接、外部链接、锚点链接。

    目标窗口:设置链接的打开方式。target一共有四个值,分别为在当前页面打开链接(-self)、在全新的空白窗口打开连接(-blank)、在顶层框架中打开链接(-top)、在当前框架的上一层打开链接(-parent)

    内部链接:指向同一个网站中的资源。用法:触发对象。

    锚点链接:指向网页中的锚点。用法:创建锚点;链接锚点。也可以链接到其他文件中的锚点,用法:。

    锚点常用于内容庞大繁杂的网页,便于查找定位某些资源的位置。

    外部链接:指向外部网站或者其他网络下。通常分为:HTTP协议链接、E-mail链接、FTP链接、Telnet链接、文件下载连接等。用法分别为href="http://······"、href="mailto:邮件地址"、href="ftp://ftp地址"、href="telnet://telnet地址"、href="下载文件地址"。

    二、使用图像

    插入图像标记img,相关属性:源文件src、提示文字alt、宽度和高度width和height、边框border、垂直间距vspace、水平间距hspace、对齐align、设定avi文件的播放dynsrc、设定avi文件的循环播放次数loop、设定avi文件循环播放延迟loopdelay、设定avi文件播放方式start、设定低分辨率图片lowsrc、映像地图usemap。

    src用于指定图像源文件的路径;alt有两个作用,一是正常显示图像时,鼠标指针置于其上会出现提示文字,二是未成功加载图像时,图像的位置会显示提示文字;width、height用于指定图像在网页中的宽度和高度。

    三、使用列表

    列表是一种数据排列工具,它可以清晰直观的形式显示数据。HTML中一共有3种列表:有序列表、无序列表、定义列表。

    有序列表,在列表中将每个元素用数字或字母标号。可以设置序号类型type和起始数值start。type共有五种类型值,分别为:数字1,小写英文字母a,大学英文字母A,小写罗马数字i,大写罗马数字I;有序列表默认从1开始,start可以用来设置有序列表的起始数值,对英文字母与罗马数字同样起作用,但start的设定值只能是数字。

    四、添加多媒体

    多媒体包括动画、声音、视频等媒体元素。

    滚动标记marquee可以用来移动文字、网页、表格等元素。marquee可以设置的属性有:滚动方向direction、滚动方式behavior、滚动速度scrollamount、滚动延迟scrolldelay、滚动循环loop、滚动范围width和height、滚动背景颜色bgcolor、空白空间hspace和vspace。

    滚动方向direction默认情况下是从右向左,取值可以为:向上up、向下down、向左left、向右right。

    滚动方式behavior默认效果是循环滚动,取值可以为:循环滚动scroll、仅循环一次slide、来回交替滚动alternate。

    滚动速度scrollamount单位是像素,用来设置每次滚动时移动的长度。

    滚动延迟scrolldelay单位是毫秒,用来设置相邻两次移动之间的停留时间。

    滚动循环loop用来设置滚动的次数,默认情况下为无限循环。

    滚动范围width、height默认效果是文字背景与文字同高与浏览器同宽,单位为像素

    滚动背景颜色bgcolor设置滚动范围的背景颜色。

    空白空间hspace和vspace设置滚动对象到滚动范围上下边框的距离,默认是0。

    优秀网页设计的特征

    1、主题信息传达明确

    单纯、简练、清晰和精确

    符合视觉习惯和逻辑规律、文本条理化、样式化处理

    形式美法则,图片色彩版式条理化(空间层次,主从关系,视觉秩序)

    整齐排列

    切割

    整体性和多边性

    2、网站内容与视觉形式统一

    内容:功能主题文本、图片、视频

    形式:版式风格、设计语言

    形式美:对比与调和、对称与平衡、节奏与韵脚、留白、美感

    将内容元素归类组合是显示内容的一种方式

    结构统一、和谐、关系清晰、突出主次、对称/对齐

    采用倒金字塔的形式:结论在开头,具体分层次

    3、鲜明的整体设计风格

    以网页的设计为标准,可以评测基于网站性质和功能的使用性、构建策略、构建方法等,并观察其效果。

    细节要素:结构、板式布局、形态、图形、色彩、动态效果

    设计独创性、多样性、实验性:设计策略、网页主题、网页要素

    网页设计中的布局

    1、链接方式

    树状链接结构

    位置明确

    不易相互跳转

    [图片1]

    适合小型

    星状链接结构

    枢纽连接

    随时跳转

    例如:门户网站

    二者结合为宜

    2、排版

    信息分出主次

    首页应具备的信息:页头、页尾、Email地址、联系信息、版权信息

    借助工具

    grid(网格类工具)

    frame(框架结构)- 分类

    Layer层 - 布局设计

    Table表格定位 - 分辨率问题

    字体

    一般最小12像素 微软雅黑 特别情况可以到10像素

    16*16点阵的仿宋字体 一行排列不超过35个字

    行距合理 字体风格不要太多种(不超过3种)

    网页设计中的几何图形

    1、点

    无序/规律 → 形成线

    定向排列 → 韵律感

    分散定向排列的点 → 面

    大小不一,沿着相对方向聚合 → 动态效果

    大小相同位置整齐 → 均衡

    发射状 → 活泼轻松

    网页中任何单独而细小的部件,文件/按钮/图形都可以视为点,不仅仅限于图形

    注重情感:

    水平对称并置 → 严谨和理性

    曲线散点 → 自由轻松浪漫

    2、线

    线的联想——平稳、不稳定、条理、圆润

    线的种类:直线、折线、抛物线、自由曲线、复合线、垂直、水平、倾斜、几何、自由线

    线的疏密变化:

    等距等粗

    粗细不同,距离不同 → 空间感

    粗细相同,距离不同 → 纵深感

    密集排列 → 形成面

    线的作用:

    串联

    分割版面

    文字也是线

    活用斜线是一个活跃页面,丰富版式的技能

    注重情感:

    锐角 → 动荡 速度

    平行 → 规律 平稳

    垂直 → 庄严挺拔向上

    曲线 → 流畅柔美

    3、面

    注重情感:

    几何面 → 规则、平稳、理性

    自然型 → 生动、厚实(例如水果、蔬菜、人,与矢量的单薄产生强烈的反差)

    偶然型 → 自由、活泼、哲理性(例如水、火、手撕状,联想;偶然型还可以破边)

    人造型 → 富含哲理(与几何形形成反差)