网站设计案例

《网站设计案例》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、目录第1章网站规划与网页设计3第2章DIV+CSS布局18第3章网页内容排版36第4章表格布局57第5章模板68第6章布局表格布局78第7章框架布局84第8章浮动框架91第9章图像制作与处理98第10章JAVASCRIPT应用111第11章行为应用127第12章层和时间轴动画139第13章ASP环境配置与表单创建152209第14章注册登录167第15章网上留言和信息显示181第16章后台管理系统架设和使用190第17章网站测试完善及发布维护196209第1章网站规划与网页设计【知识能力目标】1.了解网站开发流程、规划的要求、网页设计的原则2.了解常见网页制作软件特

2、点和用处以及Dreamweaver的操作环境3.会规划网站、建立站点4.会操作Dreamweaver环境5.能制作简单网页并保存、打开、预览网页6.会进行本地站点的基本管理【任务描述】1．规划网站从网站的需求分析、主题和内容、名称、整体风格、结构等方面对电子系网站项目进行整体规划，同时设计出主要网页的版式和网站Logo。2．熟悉网站开发环境启动Dreamweaver后熟悉编辑界面上的标题栏、菜单栏、文档工具、文档窗口、功能面板及状态栏及其功能。3．站点管理创建电子系网站站点，并对本地站点进行管理和操作。图1-1本地站点效果图4．制作站长简介网页根据自身具体情况制作站

3、长简介网页。209图1-2站长简介网页效果图【预备知识】1．1网站和网页概述1．与网站和网页有关的基本术语WWW是WorldWideWeb的简称，常称为3W或“TheWeb”或“万维网”。它是一种建立在Internet上的全球性的、交互的、动态、多平台、分布式的图形信息系统，遵循HTTP协议（HyperTextTransferProtocol），主要以“超文本”（Hypertext）或“超媒体”（Hypermedia）的形式提供信息。浏览网页是WWW操作之一。URL：即UniformResourceLocator，它是Internet上信息资源的定位方法。Serve

4、r与Browser：即服务器与浏览器。用户必须通过浏览器连接到Web服务器上，才能阅读Web服务器上的文件。网站（即站点）：是Internet上提供Internet服务的一个位置，该位置由独一无二的IP地址或域名描述。网页：是指站点中由文本、图像、超链接、动画、声音、视频等内容组成的文档。Hypertext209（超文本）：是一种可以指向其它文件的文字或图像，这种功能称为超级链接（HyperLink）。HTML语言：是用来描述组成网页的各个元素的语言。HTTP（HypertextTransferProtocol）：是一种网络上传输数据的协议，专门用于传输万维网中的信

5、息资源。ASP页面：包含程序的网页。ASP现已发展成一门技术，该技术提供一个服务器端的脚本执行环境，可以执行包含程序（由ASP内置对象和编程语言编写）的页面。CSS（CascadingStyleSheet）：用于控制表格、图片、文本等元素的效果。2．网站建立方式建立网站时可使用自己的Web服务器，也可采用托管服务器。因接入互连网要租用国际信道和电话线，并需建立中转站、购置一系列计算机设备，费用昂贵，故它们由ISP代劳。然后，ISP再向本地用户提供接入服务，ISP是提供接入服务的中介。托管服务器只是其中的一项服务，如某单位将服务器放在ISP机房由ISP维护，单位则通过

6、低速线路（64KB—155MB/S）进行网站的远程管理与维护，然后单位向ISP交纳计算机机架的空间租用费和分摊的接入费用。还可采用虚拟主机，即租用ISP硬盘空间，有独立的域名和共享或独立的IP地址。按空间大小和网络宽带资源收费。优点是费用低，缺点是不支持高访问量。它适用于小型网站，如企业网站。个人网站也采用虚拟主机或虚拟目录存放到收费或免费的空间中，也可以拥有独立的域名。3．中小型网站开发的一般流程中小型网站开发通常包括3个阶段：（1）网站规划与网页设计阶段l网站需求分析l确定网站主题和内容l规划网站的整体风格l规划网站结构l设计页面版式（2）网页制作阶段l页面布局

7、l页面内容排版处理（根据需要实现动态功能）l各个网页相链接（3）测试发布与管理维护阶段l网站测试与完善l网站空间申请、发布、推广l网站维护、更新2091．2Dreamweaver概述1．常用工具简介常用的网页制作软件工具有：Frontpage、Homesite、Hotdog、HomePage（常用于制作包含多个分栏的页面）、Dreamweaver系列、Golive等，各有特点。常用的网页素材处理工具有：Photoshop、Fireworks、Flash、LiveMotion、FreeHand、CorelDraw、Illustrator、GIFAnimator、C