网页设计与制作概述.ppt
第一章 网页设计与制作概述 学习目标学习目标:n n了解有关网页的一些基本概念n n了解网站的基本结构特性和网页的布局n n了解网页制作的基本工具和开发语言n n了解站点规划的基本流程1.1 互联网与网站基本概念基本概念:n n网页：网页：网页：网页：在网站中，供用户阅读的一个个页面，在网站中，供用户阅读的一个个页面，就称之为就称之为“网页网页”，又称为，又称为WebWeb页。页。n n万维网万维网万维网万维网（World Wide WebWorld Wide Web）：万维网简称）：万维网简称WWWWWW或或3W3W，是目前，是目前InternetInternet（因特网）上最（因特网）上最流行的一种基于超文本形式的资源组织形式。流行的一种基于超文本形式的资源组织形式。n n浏览器浏览器浏览器浏览器：要想访问网络中的各种资源，还需要：要想访问网络中的各种资源，还需要一个工具，那就是浏览器，否则无法访问到网一个工具，那就是浏览器，否则无法访问到网络中丰富的资源。络中丰富的资源。目前常用的浏览器有目前常用的浏览器有目前常用的浏览器有目前常用的浏览器有:IE:IE、netscapenetscape和和腾训腾训腾训腾训TT TT n n统一资源定位器（统一资源定位器（Universal Resource Locator，简称，简称URL）：是用来指出某项）：是用来指出某项信息的位置及存取方式，以取得各种服信息的位置及存取方式，以取得各种服务信息的一种标准方法。务信息的一种标准方法。n n通信协议：也就是上面举例中的通信协议：也就是上面举例中的“http”部分，它包括部分，它包括HTTP（超文本传（超文本传输协议）、输协议）、FTP（文件传输协议）、（文件传输协议）、Gopher（Gopher协议）和协议）和News（新闻（新闻组）等。组）等。n n主机名主机名主机名主机名：指要访问服务器的：指要访问服务器的InternetInternet名称。名称。n n所要访问的文件路径及文件名所要访问的文件路径及文件名所要访问的文件路径及文件名所要访问的文件路径及文件名：它指要访问资：它指要访问资源的具体位置。源的具体位置。n n文件传输协议（文件传输协议（文件传输协议（文件传输协议（File Transfer ProtocolFile Transfer Protocol，简称简称FTPFTP）：）：）：）：是一种快速、高效和可靠的信息传输是一种快速、高效和可靠的信息传输方法。方法。n n超文本标记语言超文本标记语言超文本标记语言超文本标记语言（Hyper Text Markup Hyper Text Markup LanguageLanguage，简称，简称HTMLHTML）：它是）：它是WWWWWW创建超创建超媒体文本的语言，它也是网页创建中最基本的媒体文本的语言，它也是网页创建中最基本的语言，制作的任何一个网页都是基于语言，制作的任何一个网页都是基于HTMLHTML文文本标识的。本标识的。n nIPIP地址：地址：地址：地址：IPIP地址是一组地址是一组3232位的数字号码，如位的数字号码，如“218.30.12.184”“218.30.12.184”，这就是上网主机的地址。，这就是上网主机的地址。n n域名：域名：域名：域名：IP IP地址是一长串的数字号码，这些数字地址是一长串的数字号码，这些数字难记又难以理解。为了方便大家理解、记忆，难记又难以理解。为了方便大家理解、记忆，便有了域名的概念。便有了域名的概念。n n表单表单表单表单:表单是用于填写申请或提交信息的交互表单是用于填写申请或提交信息的交互页面。如电子邮箱、主页空间、页面。如电子邮箱、主页空间、QQQQ号码等的号码等的申请页面，以及论坛、聊天室、留言簿等。申请页面，以及论坛、聊天室、留言簿等。n n超级链接超级链接:这是网页制作中经常要用到的概念，指的是页面对象之间的连接关系。n n导航条：导航条：导航条能十分有效地实现超级链接功能。n n发布：发布：将制作好的网页上传到服务器的过程即是发布，也称为上传或上载。网站分类n n门户网站 如：新浪n n职能网站 如：阿里巴巴 n n专业网站 如：CCTV（）n n个人网站 如：吴山明教授个人网站http:/1.2网站结构与网页布局1.2.1 1.2.1 网站结构网站结构n n1 1归类站点内容归类站点内容n n2 2项目放置的位置项目放置的位置n n3 3导航草图设计导航草图设计n n4 4创建设计草图创建设计草图1.2.2 1.2.2 网页页面布局网页页面布局n n1 1网页设计和布局原则网页设计和布局原则n n2 2网站命名和标志网站命名和标志 网站命名应遵循以下的原则：网站命名应遵循以下的原则：（1 1）体现网站的主题，凝练，概括性强。）体现网站的主题，凝练，概括性强。（2 2）合法、合情并合理。）合法、合情并合理。（3 3）字数不要太多，一般控制在）字数不要太多，一般控制在6 6个字以内。个字以内。（4 4）有个性，体现一定的内涵，可给浏览者更）有个性，体现一定的内涵，可给浏览者更多的视觉冲击力和空间想像力多的视觉冲击力和空间想像力 n n3 3网页的色彩网页的色彩 网页的色彩是树立网站形象的关键因素之一。在搭配网网页的色彩是树立网站形象的关键因素之一。在搭配网页色彩时，要注意色彩的鲜明性、独特性、合适性和联想页色彩时，要注意色彩的鲜明性、独特性、合适性和联想性。性。n n4 4网页的文字网页的文字 注意以下基本原则注意以下基本原则:（1 1）不要使用超过）不要使用超过3 3种字体类型，否则网页看起来将显得杂种字体类型，否则网页看起来将显得杂乱，没有主题。乱，没有主题。（2 2）不要用太大的字，因为版面空间非常宝贵和有限，粗陋）不要用太大的字，因为版面空间非常宝贵和有限，粗陋的大字体不能带给浏览者更多的信息的大字体不能带给浏览者更多的信息 （3 3）最好不要使用不停闪烁的文字。）最好不要使用不停闪烁的文字。（4 4）标题的字体比正文要稍大一些，颜色也应有所区别。）标题的字体比正文要稍大一些，颜色也应有所区别。n n5网页版面和布局 网页布局主要有以下3种结构。型结构 T型结构 三型结构1.3网页制作工具1.3.1 1.3.1 网页布局工具网页布局工具n n1 1DreamweaverDreamweavern n2 2FrontpageFrontpage网页美化工具网页美化工具n n1 1图像处理软件图像处理软件:Photoshop,Fireworks:Photoshop,Fireworksn n2 2动画制作软件动画制作软件:FLASH,Swish:FLASH,Swish、Ulead GIF Ulead GIF Animator,Ulead Cool 3DAnimator,Ulead Cool 3D、3D Flash Animator3D Flash Animator、Xara3D Xara3D 1.4 网页开发语言 1.4.1 HTML语言1.4.2 动态网站开发语言n n1ASP n n2JSP n n3PHP1.5网站规划1.5.1 网站制作流程网站制作流程n n1确定网站主题n n2搜集资料n n3规划网站n n4选择合适的制作工具n n5制作网页n n6上传测试n n7推广宣传n n1.5.2 网站策划书n n1网站建设目的及功能定位n n2网站内容模块规划n n3网站语言n n4网站设计风格n n5网站架设描述n n6网站信息布局图n n7网站发布与推广n n8技术支持n n9网站服务费用n n10有效期153站点评测 n n1美工设计 n n2栏目内容 n n3浏览速度n n4技术含量 n n5用户兴趣 本章小结n n本章介绍了网页设计与制作的基本概念和基本知识、常用的网页制作工具、网站的基本结构和网页布局等内容。通过本章的学习使读者对网页的设计与制作过程有一个概貌性的了解。
