项目网站前期准备工作PPT课件.ppt

项目一 搭建网站前期准备工作 1 项目1 2 项目1 项目引入 小张刚到公司任职 公司老板要求小张为公司制作一个企业网站来展示企业产品和宣传企业形象 项目分析 小张接到任务后 立即进行分析企业需求 然后从互联网了解了一些网站制作的流程和关键技术 随即展开和网络公司沟通 任务分解 小张总结后认为 搭建网站前必须了解与网页设计相关的概念 明确网站建设的流程和网页设计原则和网页制作的主流工具 3 项目1 任务1了解网页相关概念 1 网页网页由又称Web页 它是网站文件的主要组成部分 是被浏览器解读并显示的HTML超文本文件 由文字 表格 图片 声音 视频 动画以及各种功能按钮等组成 一个网页上文字 图片 按钮又可以是指向别的页面的连接点 这些连接点叫超级链接 2 网站网站 WebSite 简而言之 就是一组具有共同主题的网页通过超链接的形式所组成的信息系统 网站的主要组成部分是网页 而网页是由文字 表格 图片 声音 视频 动画以及各种功能按钮等组成 网页中的图片 声音 视频 动画等又是一个个独立的文件 4 项目1 3 主页主页是网站的起始页和索引页 是用户开始浏览网站的 入口处 与一般网页一样可以存放各种信息 但它又是一个特殊的网页 主要由导航及各种超链接构成 用户通过主页提供的超级链接访问其它页面的信息和资源 主页一般可命名为index html index htm default html default htm等 4 静态网页和动态网页静态网页是标准的HTML文件 它的文件扩展名是 htm或 html 可以包含文本 图像 声音 Flash动画 客户端脚本和ActiveX控件及JavaApplet等 动态网页是由HTML 服务器端运行的脚本代码所编写的网页文件 网站的内容动态存储到服务器数据库中 当用户请求访问该页面时 通过执行服务器端的脚本代码 读取数据库信息来生成一个标准的HTML网页文件 发送到客户端的浏览器中进行显示 5 项目1 5 网页浏览机制 1 服务器与浏览器通常来说 提供服务的一方称为服务器 请求服务或接受服务的一方称为客户机 服务器是网络的核心设备 实际上是一种配置较高的计算机 安装有服务器软件 如WindowsXP下的IIS 其基本功能是提供网络共享资源 网络通信管理和网络通信服务 客户机是接受服务的计算机 配置可高可低 必须安装有浏览器软件以解读网页文档 2 URL介绍中文意思为 统一资源定位地址 通常叫网址 它是Internet上用来描述信息资源的字符串 URL的格式由下列三部分组成 第一部分是协议或称为服务方式 第二部分是该资源的主机域名 或IP地址 第三部分是资源的具体地址 由目录和文件名组成 6 项目1 3 网页浏览机制客户要访问服务器提供的网络资源是通过在浏览器的地址栏输入URL来发出请求的 该请求经过互联网上的网络设备 域名系统等功能的处理 连接到要访问的服务器 建立起服务器与客户机的点对点通信机制 服务器对客户的资源请求进行处理 发送回客户端标准的HTML文档 经浏览器解读显示给浏览者 7 项目1 任务2网站结构 1 构建网站的物理结构构建网站的物理结构就是根据网站主题的需要 分类保存网站中的不同的资源 目录结构清晰 便于网站的管理和维护 对于信息量小的网站可以将不同类型的文件存放在不同的文件夹中 对于文件数量众多 信息量大 文件类型复杂的网站 应根据不同的栏目建立目录 在不同栏目的目录下再将不同类型的文件分类存放 8 项目1 2 构建网站的逻辑结构 1 树状链接结构 一对一 类似Windows操作系统的文件目录结构 页面与页面之间是一对一关系 首页链接指向一级页面 一级页面链接指向二级页面 这样的链接结构浏览时 一级级进入 一级级退出 这种链接结构条理清晰 访问者明确知道自己在什么位置 不会 迷 路 但是浏览效率低 要从一个栏目下的子页面访问另一个栏目下的子页面 必须绕经首页 9 项目1 2 网状链接结构 一对多 类似网络服务器的链接 每个页面相互之间都建立有链接 这种链接结构方便用户浏览网页 随时可以到达自己喜欢的页面 但是链接太多 容易使浏览者迷路 搞不清自己在什么位置 10 项目1 3 明确网站的物理结构与网站的逻辑结构的关系网站的物理结构与网站的逻辑结构是密不可分的 逻辑结构是建立在目录结构基础之上 网站良好的逻辑结构方便了用户的浏览 而物理结构好坏对网站的管理与维护 逻辑结构的建立都具有重大影响 对浏览者来说最关心的是网站的逻辑结构即链接结构 而对网站设计人员来说 两种结构都必须合理策划和构建 既方便浏览 又易于网站的管理 更新和移植 11 项目1 任务3网页设计的原则 1 明确网页设计的内容原则 12 项目1 2 明确网页设计的用色原则 13 项目1 3 明确网页设计的布局原则 14 项目1 任务4网站建设流程 1 确定网站的主题 2 收集 制作和整理资料 3 规划网站结构 4 设计制作网页 5 测试与发布网站 6 维护和推广网站 15 项目1 任务5网页制作工具概述 1 认识标记型网页制作工具HTML是网页制作的基础 也是最基本的网页制作工具 HTML即超文本标记语言 它使用标记符对网页文档结构以及组成网页的文字 图形 动画 声音 表格 链接等元素进行描述 便于被浏览器显示 即使利用其他的任何工具制作的网页 最终都要以HTML文档方式显示在浏览器上 编辑HTML代码的工具 从原理上说任何文本编辑器均可 但最简单的是记事本 最方便的是专业的编辑工具 常用的HTML代码专业编辑工具有HotDog HomeSite EditPlus InterDev UltraEdit等 使用这类工具时 不需要记住标记名称手工输入 而是利用大量的可视化工具或代码提示功能实现输入编辑 而且代码结构和标记可设置成不同的格式及颜色 非常方便编辑和查看 16 项目1 任务5网页制作工具概述 2 认识 所见即所得 型网页制作工具 所见即所得 网页设计 也称为可视化 Visual 网页设计 是指网页文件在编辑过程中的显示与文件最终在浏览器中的显示是一样的 用户在这种设计工具的视图中直接编辑文本 图形 或其他网页元素 所有细节问题均有编辑器自动处理而生成Html代码 可视化网页制作工具 把 敲代码 变成了 画页面 屏幕上可直接看到页面的最终效果 需要时通过切换视图方式可查看Html代码 3 认识编程型网页制作工具编程型网页制作工具主要是针对动态网页制作而言 它是将HTML 脚本语言 CSS 服务器端代码 数据库等技术综合起来实现编程 通过在服务器端的执行而生成标准的HTML网页文件 17 项目1 任务5网页制作工具概述 本项工作任务介绍了网页设计的相关概念 包括网站 网页 主页 静态网页 动态网页 网页浏览机制等 网站结构的物理结构 目录结构 和逻辑结构 链接结构 网页设计的内容原则 用色原则和布局原则 网站建设的一般流程 包括确定网站的主题 素材的收