没有合适的资源?快使用搜索试试~ 我知道了~
《网页设计与制作》讲义-专题1-网页设计基础知识.doc
1 下载量 137 浏览量
2022-12-23
08:53:29
上传
评论
收藏 393KB DOC 举报
温馨提示
试读
18页
《网页设计与制作》讲义-专题1-网页设计基础知识.doc
资源推荐
资源详情
资源评论
《网页设计与制作》讲义-专题 1-网页设计基础知识
专题 1 网页设计基础知识
1.1 认识网站、网页与主页
1.1.1 什么是网页
网页(Web 页)实际上就是 HTML 文件,是一种可以在 WWW 网上传输,并能被浏览器
认识和翻译成页面的文件。
HTML 是“HyperText Markup Language”的缩写,意为“超文本标记语言”,它是一种
规范,一种标准。它是纯文本格式的,用任何文本编辑器都可以打开编辑。
网页包括的主要元素有:文本、图像、动画、声音、视频、超链接、表格、表单等。
由于多数网页一般均有文字、图像、图形、动画、音频、视频等多媒体信息,具有超
链接、并可与网络链接,因此这就使人们登上站点以后,便可以看到五彩缤纷的界面。那
么,这些五彩缤纷和千姿百态的 Web 网页是如何制作出来的?制作好网页以后又如何将它
发布到 Internet 上?这些问题正是本课程所要阐述的主题。
1.1.2 什么是网站
多个相互之间具有一定联系的网页就构成了一个网站。
网站用于存储提供给用户浏览的网页文件。它也是一种文档的磁盘组织形式,由文档
和若干文件夹组成,文档经过组织分类分别放在不同的文件夹中。
网站存储在服务器或服务器的虚拟主机上,接受访问者通过 WWW 域名的访问。
网站是具有独立域名、独立存放空间的内容集合,这些内容可能是网页,也可能是程
序或其它文件,一个网站不一定要有很多网页,主要是有独立域名、独立存放空间,即使
只有一个页面,也叫网站。
网站按照其内容可以分为以下几类:
1、企业网站:围绕企业、产品及服务信息进行网络宣传,通过网站树立企业网络形
象。
2、个人网站:个人为了兴趣爱好或为了展示个人等目的而建的网站,具有较强的个
性化特色。
3、门户网站:提供综合性互联网资源的网站。国内著名三大门户网站:网易、搜狐、
新浪。
4、机构网站:政府机关、相关社团组织或事业单位建立的网站。以机构或社团形象
宣传和政府服务为主。
5、娱乐网站:提供娱乐信息、流行音乐、视频等娱乐内容为主的网站。
6、电子商务网站:依靠因特网来完成商业活动的各个环节的网站,如卓越、当当、
淘宝、易趣、拍拍等。
7、行业信息网站:随着因特网的发展,网民数量的增加,上网不同兴趣群体的形成,
门户网站已经明显不能满足不同上网群体的需要。行业信息网站应运而生,它是能够满足
某一特定领域上网人群及其特定需求的网站。如房地产行业网站。
8、专业网站:专门以某个主题为内容而建立的网。如某某课程的网络课程
不同类型网站具有不同的风格和作用,在设计网站时,页面元素的设计、构图、色彩
搭配、多媒体信息的使用、文本格式等的设计,要考虑网站的类型。
1.1.3 什么是主页
主页又叫首页,主页是网站的第一页,既是一个网站的封面,也是该网站的目录。
欣赏几个不同类型的网站主页:
《网页设计与制作》讲义-专题 1-网页设计基础知识
问题
问题
:
:主页、网页与网站的关系?先规划土地还是先建房?先建房还是先买家具?先
建网页还是先建网站?
1.1.4 网页基本构成要素
不同性质的网站具有不同的页面元素,但是,一般的网页都会具备以下一些元素:
1、标题
标题用来说明网站的形式、内容等信息。
2、站标 Logo
网站 Logo,也叫网站标志,它是一个站点的象征,也是一个站点是否正规的标志之
一。一个好的标志可以很好地树立公司形象。网站标志一般放在网站的左上角,访问者一
眼就能看到它。成功的网站标志有着独特的形象标识,在网站的推广和宣传中起到事半功
倍的效果。网站标志应体现该网站的特色、内容以及其内在的文化内涵和理念。
3、banner
Banner 是一种网络广告形式,Banner 广告一般是放在网页的顶部位置,在用户浏览
网页信息的同时,吸引用户对于广告信息的关注。
Banner 广告有多种规格和形式,其中最常用的是 486 × 60 像素的标准广告。这
种标志广告有多种不同的称呼,如横幅广告、全幅广告、条幅广告和旗帜广告等。通常是
以 GIF、JpG 等格式建立的图像文件或 Flash 文件。
4、导航栏—网站索引
导航栏既是网页设计中的重要部分,又是整个网站设计中的一个较独立的部分。一般
来说网站中的导航栏位置在各个页面中出现的位置是比较固定的,而且风格也较为一致。
导航栏的位置对网站的结构与各个页面的整体布局起到举足轻重的作用。
5、内容—网站的精神所在
文本一直是人类最重要的信息载体与交流工具,网页中的信息也以文本为主。与图像
相比,文字虽然不如图像那样易于吸引浏览者的注意,但却能准确地表达信息的内容和含
义。
图像在网页中具有提供信息、展示形象、美化网页、表达个人情趣和风格的作用。可
以在网页中使用 GIF、JpEG 和 pNG 等多种图像格式,其中使用最广泛的是 GIF 和 JpEG 两
种格式。
随着网络技术的发展,网页上出现了越来越多的 Flash 动画。Flash 动画已经成为当
今网站必不可缺少的部分,美观的动画能够为网页增色不少,从而吸引更多的浏览者。
Flash 动画不仅需要对动画制作软件非常熟悉,更重要的是设计者独特的创意。
6、页脚
页脚放置网页设计者的基本信息。
思考题:网页的设计需要考虑哪些因素?标题、Logo、页眉、页脚、导航的设计、版
面布局的设计、连接结构的设计、网页色彩的搭配设计、字体的设计、宣传标语的设计等。
1.1.5 网页的分类
我们通常看到的网页,大都是以 HTM 或 HTML 后缀结尾的文件。除此之外,网页文件
还有以 CGI、ASp、pHp 和 JSp 后缀结尾的。目前网页根据生成方式,大致可以分为静态网
页和动态网页两种。
1、静态网页
静态网页是网站建设初期经常采用的一种形式。网站建设者把内容设计成静态网页,
访问者只能被动地浏览网站建设者提供的网页内容。其特点如下:
网页内容不会发生变化,除非网页设计者修改了网页的内容。
不能实现和浏览网页的用户之间的交互。信息流向是单向的,即从服务器到浏览器。
服务器不能根据用户的选择调整返回给用户的内容。
静态网页的浏览过程如图 1 所示。
《网页设计与制作》讲义-专题 1-网页设计基础知识
我们使用 dreamweaver 和 html 制作的网页属于静态网页。
2、动态网页
网络技术日新月异,许多网页文件扩展名不
再只是.htm,还有.php、.asp 等,这些都是采用
动态网页技术制作出来的。动态网页其实就是建立
在 B/S 架构上的服务器端脚本程序。在浏览器端
显示的网页是服务器端程序运行的结果。动态网页
是经过人与服务器对话的结果。如图网页上的登
录、注册、网上购物等都属于此类网站。
静态网页与动态网页的区别在于 Web 服务器对它们的处理方式不同。当 Web 服务器接
收到对静态网页的请求时,服务器直接将该页发送给客户浏览器,不进行任何处理。如果
接收到对动态网页的请求,则从 Web 服务器中找到该文件,并将它传递给一个称为应用程
序服务器的特殊软件扩展,由它负责解释和执行网页,将执行后的结果传递给客户浏览器。
应用程序服务器的作用是读取动态网页上的代码,根据代码中的指令完成网页,然后
将代码从网页上去掉,所得的结果将是一个静态网页;应用程序服务器将该网页传送回网
页服务器,网页服务器将网页发送到浏览器,浏览器得到的仍然是一个纯 HTML 的静态网
页。
如图 2 所示为动态网页的工作原理图。
图 2 动态网页的工作原理图
动态网页的一般特点如下。
动态网页以数据库技术为基础,可以大大降低网站维护的工作量。
采用动态网页技术的网站可以实现更多的功能,如用户注册、用户登录、搜索查询、
用户管理、订单管理等。
动态网页并不是独立存在于服务器上的网页文件,只有当用户请求时服务器才返回
一个完整的网页。
搜索引擎一般不可能从一个网站的数据库中访问全部网页,因此采用动态网页的网
站在进行搜索引擎推广时需要做一定的技术处理才能适应搜索引擎的要求。
1.2 网站制作基本流程
创建网站是一个系统工程,有一定的工作流程,只有遵循一定的步骤,按部就班地来,
才能设计出满意的网站。
1.2.1 前期策划
建立网站第一步就应该确定网站的目标,包括 1、网站的整体定位:是商务网站、科
研网站、个人网站还是交流平台或者公司或企业的介绍性网站?2、网站要包含的主要内
图
1
静态网页的浏览过程
剩余17页未读,继续阅读
资源评论
是空空呀
- 粉丝: 173
- 资源: 3万+
上传资源 快速赚钱
- 我的内容管理 展开
- 我的资源 快来上传第一个资源
- 我的收益 登录查看自己的收益
- 我的积分 登录查看自己的积分
- 我的C币 登录后查看C币余额
- 我的收藏
- 我的下载
- 下载帮助
安全验证
文档复制为VIP权益,开通VIP直接复制
信息提交成功