网页设计与制作基础知识

《网页设计与制作基础知识》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、主讲人：物理与电子工程学院　张亮《网页设计与制作》概述教学内容概述HTMLDreamweaverFireworkCMS考核平时作业（40%）期末考试（个人网页）（60%）主要教学环节五、知识讲解与操作示范一、课程引导二、明确知识技能目标三、展示网页浏览效果四、分析操作任务六、课堂模仿实践七、疑难解析八、归纳总结九、布置习题网络计算机网络在信息时代中的作用21世纪的一些重要特征就是数字化、网络化和信息化，它是一个以网络为核心的信息时代。因特网是自印刷术以来人类通信方面最大的变革。现在人们的生活、工作、学习和交往都已离不开因特

2、网。Internet的历史20世纪60年代美苏冷战时期的产物。第一阶段是从单个网络ARPANET向互联网发展的过程。第二阶段的特点是建成了三级结构的因特网。第三阶段的特点是逐渐形成了多层次ISP结构的因特网。用户因特网ISP1ISP2因特网服务提供者根据提供服务的覆盖面积大小以及所拥有的IP地址数目的不同，ISP也分成为不同的层次。Internet提供的主要服务WWW服务（网上冲浪）电子邮件服务（Email）网上传呼（OICQ）文件传输（FTP）网络游戏网络协议网络复杂性、异构性为计算机网络中进行数据交换而建立的规则、标准

3、或约定的集合。TCP/IPHTTP（HyperTextTransferProtocol——超文本传输协议）FTPWWWWorldWideWeb（世界宽边网络）的缩写，也可以简称为Web，中文名字为“万维网”。能够处理文字、图像、声音、视频等多媒体信息，是一个多媒体信息系统。WEB简介一、网页设计相关概念2.WEB服务器及客户机一、网页设计相关概念客户端浏览器：通过在地址栏中输入Web服务器地址从而访问Web服务器的软件；目前主要是InternetExplorer（IE）和Netscape：一、网页设计相关概念浏览网页的工作

4、过程用户通过浏览器发出请求WEB服务器接到请求后选择相应的网页发给用户的浏览器浏览器接收到网页文件（HTML文件）后，根据HTML标记符解释和显示各种内容。浏览网页的工作过程一、网页设计相关概念用URL发出请求送出网页http://www.scitc.com.cn客户机统一资源定位器（URL）URL的全文为UniformResourceLocator，译为统一资源定位器用于指定要取得的Internet上资源的位置与方式超链接（HyperLink）超链接是特殊的文字标记，它指向了万维网中的其他资源，如另外一个网页、一个声

5、音文件，或者是网页的另一个段落等，而且这些资源均可以存放在任何一个服务器上。在浏览网页时，如果你用鼠标单击超链接，那么就会跳转到超链接所指向的资源二、网页、网页设计、网站和主页以目前的网页技术来说，大致可分为三个方面来加以说明静态网页（HTML、CSS）：仅展示信息静态网页是用HTML编写，扩展名为.htm或.html。静态网页只能单纯地在网页中展示文字与图片，它是所有网页的基础技术。网页美工（Flash、Fireworks）动态网页（JavaScript/VBScript、ASP））：可实现互交功能一个网站的制作流程

6、类似与一个电视节目的制作过程，包括:四、网站建设的基本步骤及应注意的问题策划制作宣传更新1.网页设计基本步骤（1）设计网页栏目及组织结构（2）准备素材（3）界面设计（4）网页排版（页面实现）（6）网页测试与发布（7）网页推广与维护层状线性网状2.制作网页时要注意的问题网页的标题要简洁，明确。对重点内容要强调显示。网页中插入的图片要尽量的小。图形要附加文字说明，以便关闭图像时查看。网页中引用的资料及商标（或图标），不能侵犯版权。四、网站建设的基本步骤及应注意的问题8/26/202119设计并制作网页图“网上书苑”网站主页的页

7、面设计8/26/202120设计并制作网页图“网上书苑”网站“文学作品”网页的页面设计8/26/202121“T”结构布局8/26/202122“口”型布局8/26/202123对称对比布局8/26/202124POP布局（自由布局）版式设计的构成类型在网页设计中较常见的网页版式构成类型主要有：水平分割式、垂直分割式、水平与垂直分割交叉式、斜线式、“S”曲线式、重复式等。水平分割的页面具有较强的视觉稳定性，给人平静、安定的感觉返回垂直分割强调的是垂线的视觉冲击力，体现坚强、理智与秩序的感觉返回曲线、弧线、曲线形状的应用能够

8、产生运动、韵律的动感，形成富有活力的视觉效果。返回曲形与直形的综合应用是将以上两种线条和形状结合起来运用，不仅能够丰富网页的表现力，还能使网页更富于变化，艺术效果更丰富多彩。返回页面中的点、线、面及留白的处理点的作用www2.coca-cola.com线与面的作用版面的大面积的空白给人以无限的想象空间留