cs3网页设计与制作教程 第2版 教学课件 申莉莉教案 第2章本地站点的规划和创建

第1页 在线教务辅导网 教材其余课件及动画素材请查阅在线教务辅导网 QQ 349134187或者直接输入下面地址 第2章本地站点的规划和创建 第3页 本章内容 2 1规划站点 个人网站规划2 2创建本地站点2 3管理站点内容2 4制作个人网站首页2 5测试与发布2 6文件的上传和下载2 7习题 第4页 2 1规划站点 个人网站规划 2 1 1规划站点结构2 1 2构建站点的整体风格2 1 3主页和其他页面的设计 第5页 2 1 1规划站点结构 规划目录结构一般使用文件夹构建文挡的结构 首先创建一个根文件夹 根目录 然后创建多个文件夹 再将文档分门别类存储到相应的文件夹下 其次要按栏目内容建立子目次 对每个栏目都相应建立一个文件夹 目录名和文件名 尽量使用英文或汉语拼音 第6页 2 1 1规划站点结构 2 规划链接结构网站的链接结构 内部链接和外部链接 第7页 2 1 1规划站点结构 3 规划模板和库的使用设计时使用模板功能取得一致效果 同时 使用模板和库 可以在不同的文档中重用页面布局和页面元素 给网页的维护带来很大的方便 对于经常使用的对象 应该先设计好该元素 并把它存入到库中 第8页 2 1 2构建站点的整体风格 1 网站的标志 LOGO 标志是网站的特色和内涵的集中体现 标志的设计和创意应当来自网站的名称和内容 常用方式是用网站的英文名称作标志 采用不同的字体 字母的变形及图像组合而成 第9页 2 1 2构建站点的整体风格 2 设计网站色彩 标准色彩 是指能体现网站形象和延伸内涵的色彩 应用于网站的背景 主菜单和主色块 给人以整体统一的感觉 一般来说 一个网站的标准色彩不超过3种 其它色彩只是作为点缀和衬托 第10页 2 1 2构建站点的整体风格 3 设计网站字体标准字体是指用于标志 标题 主菜单的字体 一般网页默认的字体是宋体 为了体现站点的风格及网站所表达的内涵 可以选择其他更贴切的字体 第11页 2 1 2构建站点的整体风格 4 设计网站广告语网站广告语是网站的精神 主题与中心 用一句话或者一个词进行高度概括 富有气势的广告语 进行对外宣传 可以收到比较好的结果 第12页 2 1 3主页和其他页面的设计 1 T型布局T结构指页面顶部为横条网站标志或广告条 下方左面为主菜单 右下方显示具体的网页内容 因为菜单栏背景较深 整体效果类似英文字母T 所以称之为T结构布局 第13页 T型布局 第14页 2 1 3主页和其他页面的设计 2 口型布局口型布局常见的形式是页面上下各有一个广告条 左面是主菜单 右面是友情连接等 中间是主要内容 形状像一个 口 字 第15页 口型布局 第16页 2 1 3主页和其他页面的设计 3 三型布局这种布局特点是将页面整体分割为三部分 页面上横向采用两条色块 色块中有时放置广告条 第17页 三型布局 第18页 2 1 3主页和其他页面的设计 4 对称对比布局此布局结构采取左右或者上下对称的布局 一半深色 一半浅色 一般用于设计型站点 第19页 对称对比布局 第20页 2 1 3主页和其他页面的设计 5 POP布局POP引自广告术语 是指页面布局像一张宣传海报 以一张精美图像作为页面的设计中心 常用于时尚类站点 第21页 POP布局 第22页 2 2创建本地站点 2 2 1利用建站向导创建站点2 2 2利用增强方式创建站点 第23页 2 2 1利用建站向导创建站点 1 打开Dreamweaver 在网页编辑窗口中选择 站点 新建站点 命令 2 选择是否需要使用服务器 3 输入文件存储位置 4 选择想要连接的远程服务器类型 5 选择是否允许合作伙伴能够同时编辑文件 6 查看所创建站点的基本信息 7 选择 站点 管理站点 命令可见建立的站点 第24页 2 2 2利用增强方式创建站点 1 选择 站点 新建站点 命令 系统弹出定义站点的对话框 2 单击 高级 选项卡 设置本地信息 3 单击 完成 按钮 选择 站点 管理站点 命令可见建立的站点 第25页 2 3管理站点内容 2 3 1编辑站点属性2 3 2操作站点文件 第26页 2 3 1编辑站点属性 选择 站点 管理站点 命令 系统弹出 管理站点 面板 选择要进行编辑的站点名称 第27页 2 3 2操作站点文件 选择 窗口 文件 命令 弹出站点窗口 单击选择 本地视图 中所创建的站点 单击右键弹出快捷菜单 第28页 2 4制作个人网站首页 2 4 1页面属性2 4 2表格设计2 4 3内容填写2 4 4添加链接和交互 第29页 2 4 1页面属性 单击鼠标右键 从弹出的菜单中选择 页面属性 第30页 2 4 2表格设计 选择 插入记录 表格 命令 第31页 2 4 3内容填写 选择 插入记录 图像 命令 插入图像 并输入文本 在插入文本时可以适当地运用CSS 这样不仅可以减少网页的代码 也比较容易更新 第32页 2 4 4添加链接和交互 1 添加文本链接选中相关的文字 在属性面板的链接文本框中输入文件名 2 添加电子邮件链接选择 插入记录 插入电子邮件链接 命令 第33页 2 5测试与发布 2 5 1测试站点2 5 2申请域名和空间2 5 3发布站点 第34页 2 5 1测试站点 1 兼容性测试选择 文件 检查页 浏览器兼容性 BCC 命令来测试所制作的页面 以检查网页在不同版本 不同类型的浏览器中兼容性 第35页 2 5 1测试站点 2 链接测试选择 文件 检查页 检查链接 命令 检查当前文档中的链接 第36页 2 5 1测试站点 3 验证辅助功能选择 文件 检查页 辅助功能 命令 验证辅助功能 第37页 2 5 1测试站点 4 实地测试把网页上传到Internet服务器上 测试链接 下载速度等 预览成功的页面有可能在上传后有问题 第38页 2 5 2申请域名和空间 1 域名的类型依据域名的结构 域名分成两类 国际顶级域名 简称 国际域名 和国内域名 国际域名的最后一个后缀通常是 com net gov edu等国际通用域 第39页 2 5 2申请域名和空间 2 申请免费域名域名的申请分为免费和付费两种方式 个人网站通常申请免费域名 部分网站提供免费域名的注册 申请免费域名一般需要所注册的域名 Email地址和主页的URL地址 注册方法按照提示步骤进行即可 第40页 2 5 3发布站点 2 申请免费域名在 文件 面板中选择需发布的站点 单击右键 单击 上传 命令 第41页 2 6文件的上传和下载 2 6 1上传文件2 6 2下载文件 第42页 2 6 1上传文件 1 在本地站点的窗口中 选中要上传的文件 2 单击右键 弹出快捷菜单 单击 上传 命令 3 如果选中的文件中引用了其他位置的内容 出现提示对话框 选择是否要将这些内容也上传 4 单击 是 按钮 同时上传相关文件 第43页 2 6 2下载文件 1 在远程站点窗口中选择要下载的文件 单击右键 弹出快捷菜单 选择 获取 命令 2 如果选中的文件中引用了其他位置的内容 出现提示对话框 提示选择是否要将这些相关文件也下载 3 单击 是 按钮 将连接到相关网站并同时下载相关文件 第44页 2 7习题 一 填空题1 网站的链接结构包括