本科网页设计与制作实例教程978 7 307 10379 5 教学全套课件资源包03 教学课件第1章 网页制作基础知识.ppt

《本科网页设计与制作实例教程978 7 307 10379 5 教学全套课件资源包03 教学课件第1章 网页制作基础知识.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、网页设计与制作实例教程主讲教师1.1认识网页和网站1.2了解网页的设计技术及工具1.3了解网站的开发流程第1章网页制作基础知识本章主要介绍了网站、网页的概念和构成元素、网页的设计方法及工具、网站开发的流程等相关内容。通过本章的学习，同学们对网页制作有了初步认识，了解了网页的版式设计以及网站制作流程等内容。学习重点第1章网页制作基础知识1.什么是网页网页其实就是一个文件，它可以承载网页制作者留下的各种信息，然后通过互联网传输并使用浏览器显示成页面，让不同的用户浏览。1.1.1什么是网页和网站1.1认

2、识网页和网站2.什么是网站门户网站：通常指涉及领域非常广的综合性网站，如搜狐、网易、新浪网站等。职能网站：通常指一些公司为其产品做售后服务或是介绍公司产品而建立的网站，如金山毒霸、瑞星反病毒网站等。个人网站：指一些由个人设计创建的网站，这种网站在内容和形式上具有较强的个性化，通常是以宣传自己或展示个人兴趣爱好为主。专业网站：指以某个专项作为网站的核心，通常以某个单一的题材作为网站的内容，如以游戏为主题的游戏网站，以文学为主题的文学网站等。1.1.1什么是网页和网站1.1认识网页和网站1.文本大多数

3、的网页中都有大量的文字信息。文本的体积小，传输速度快，用户在浏览包含大量文本信息的网页时，可以快速地下载并显示出来。2.图像网页中的图像可以生动直观地传递和表达各种信息。图像可以用最直观的方式表现网页的主题，并以强烈的视觉冲击给予浏览者深刻的印象。1.1.2网页的构成元素1.1认识网页和网站3.动画在网页中添加动画，可以让浏览者更乐意浏览该网页。特别是一些制作优美的动画，更能为网页增色不少，吸引浏览者的目光。4.表格一个网页除了要有精彩的内容与协调的色彩外，还需要进行合理的排版布局。表格的主要作用

4、就是对网页进行排版和布局。1.1.2网页的构成元素1.1认识网页和网站常用的网页设计技术主要有以下几种，这里仅介绍名称，在后续章节将陆续介绍具体的使用方法。HTML：超文本标记语言。CSS：层叠样式表。JavaScript：客户端脚本语言。Flash：Flash动画。Web标准：高级网站重构技术。1.2.1常用网页设计技术1.2了解网页的设计技术及工具要想高效率的设计网页，常常用到下列几种工具软件。Dreamweaver：用于网页的设计与制作，使用所见即所得的接口。Fireworks：是一款网页作

5、图软件，可以加速Web设计与开发。Flash：用于2维Flash动画制作，是由美国Macromedia公司推出的交互式矢量图和Web动画的标准。上述3种软件均是美国Macromedia公司推出的产品，俗称“网页三剑客”，在公司被Adobe公司合并后，加入CS3。网页三剑客的最新版本分别为AdobeDreamweaverCS6、FireworksCS6、FlashCS6。1.2.2常用网页设计工具1.2了解网页的设计技术及工具1.市场调查对目前Internet上同类网站的数量以及此类网站的浏览量进行

6、数据统计分析，了解目前最流行什么风格的网站；如果是营利型网站，则需要了解目前同类网站的经营情况，对消费市场进行详细调查，确定自己的网站应当针对什么样的用户群体。2.网站规模一般来讲，可以把网站划分为小型、中型和大型3种。一般的网站都是先从小规模开始建站，然后逐步扩大网站规模。1.3.1网站需求分析1.3了解网站的开发流程3.网站主题(1)门户网站所涉及的内容非常广泛，综合性较强，这类网站就需要有大量的信息更新。(2)以售后服务为主题的职能网站则应当注重其功能性，这类网站大多用来树立公司形象或为客户

7、提供相关的售后服务。(3)以个人兴趣爱好为主题的个人网站则注重个性化，相对比较自由，可根据个人特长自由发挥。(4)以某个行业为主题的专业网站在设计上要考虑其单一性和专业性，不宜太花哨，应注重信息内容的重点突出部分。1.3.1网站需求分析1.3了解网站的开发流程4.网站目标群体网站的类别不同，所针对的用户群体也不同。比如说时尚类网站主要是给追求时尚的年轻人看的，门户网站则是针对大部分普通人群，还有一些网站是针对儿童、妇女或老年人的。1.3.1网站需求分析1.3了解网站的开发流程一个网站会给浏览者留下

8、某个特定的印象，这是由网站的风格决定的。不同的网页布局加上不同的色彩与文字搭配就形成了不同风格的网站。网站中所有网页的风格要统一，才会使整个网站变得更好看。1.3.2网站风格定位1.3了解网站的开发流程1.上左中右型该版式在网站的上面显示Banner与导航条，左侧显示会员注册信息及友情链接等，中间显示正文内容，右侧显示广告信息等。2.上左右型该版式同上左中右型类似，只是将右边的广告信息与正文内容合并在一起。1.3.3网页版式类型1.3了解网站的开发流程3.左中右型该版式是在网页的左