第四章-网站开发.pptVIP

网站的规划与设计 开发网站的基本过程： 网 站 的 规 划 网 站 的 设计 网 页 的 制 作 网 站 的 发布与管理 网 站 的 评价 网站的规划 1.网站主题的确定网站的规划从选择网站的主题开始。网站的选题，就是要根据网站的开发目标和访问网站的用户群，确定网站的主题，并给网站起一个简练响亮的名字。 注意：贴近学习和生活 2.网站运行环境的确定网站环境包括网站服务器情况、文件磁盘存储空间、网站域名管理等方面。 　　 3.网页制作工具的选择主要包括选择网页制作工具（Frontpage、Dreamweaver)、图像处理工具（Photoshop、Fireworks、paintshop）、动画制作软件（flash、Ulead gif animator）等。 网站结构的设计 网站的设计包括以下项目： 网页的版面设计 网页的交互设计 网页的版面设计 1、风格设计 包括网页布局的整体造型、色彩的搭配、字体图片的样式设置、网站的标志设计等 2、版面布局设计标题信息、栏目信息、内容信息、附加信息等，要进行合理的放置，让人看起来井井有条，主次分明。 常见网页布局类型 布局类型 布局方式 实例 “国”字型 上面是网站的标题及横幅广告，接下来是网站的主要内容，左右分别列一些小条，中间是主要内容，下面是一些网站的信息 人民网 拐角型 上面是标题广告，接下来在左侧是导航栏，右侧是正文，下面是网站的信息。 ? 标题正文型 上面是标题，下面是正文。 ? 左右框型 左边是导航栏，右边是正文。有时最上方会有一个小标题。 ? 上下框型 上面是导航栏，下面是正文。 /show/ 综合框架型 左右、上下两种框架结构的结合。 ? 封面型（Flash型） 精美的平面或动画作为首页。 http://www.matinee.co.uk/site2/fr_nmd.htm * 网络技术应用 * 一、准备网页素材 网页素材的准备工作主要包括网页素材的获取加工与管理 2、网页素材的管理 通常，我们对准备好的素材按网页进行分类，同一个网页的素材用一个文件夹来进行管理，如果需要的话还可以采用多级子文件夹详细分类。 文件夹的名字就是该页面的名称。 用最能反映文件内容或特征的英文或拼音字母作为文件名。 * 网络技术应用 * 二、新建站点 1、启动FrontPage 2000 开始 → 程序 → Microsoft Office → Microsoft Office FrontPage 2000 2、建立空白站点： （1）单击“文件”菜单——“新建”——“站点”——“空站点” （2）改变保存站点路径：在“指定新站点的位置”提示框中，输入“D:\mysite+14XXX”创建一个基于磁盘的网站。 * 网络技术应用 * 二、新建站点 * 网络技术应用 * 三、新建网页 1、建立网页： 单击“文件”菜单——“新建”—— “空白网页” 2、导入素材： 导入个人主题网站的图片素材： 选定站点的Images文件夹，单击“文件”菜单——“导入”—— “添加文件” * 网络技术应用 * 三、新建网页 3、设置网页的背景： 单击“文件”菜单——“属性”—— “格式”，单击“浏览”——选择marble.gif文件???? （或：单击“格式”菜单——“背景”—— “格式”） * 网络技术应用 * 三、新建网页 4、设置网页的标题： 单击“文件”菜单——“属性”—— “常规”，在标题栏输入个人主题网站的名称。???? （或：单击“格式”菜单——“背景”—— “常规”） * 网络技术应用 * 三、新建网页 5、使用表格进行页面布局 ?? 单击“表格”菜单——“插入”—— “表格”，弹出表格属性对话框： * 网络技术应用 * * 网络技术应用 * 三、新建网页 大家可以参考《虎门销烟启思录》网站的主页的结构来进行设计，它的表格布局为： * 网络技术应用 * 三、新建网页 调整表格结构： （1）合并单元格：选定需要合并的单元格→鼠标右击→选择“合并单元格” （2）拆分单元格：指定需要拆分的单元格→鼠标右击→选择“拆分单元格”→拆分成行（或列） * 网络技术应用 * 在网页中插入基本元素 1.向网页中添加文字 “格式”菜单|字体” 在输入文字时，一般情况下让系统自动换行，若强制换行，可按回车键（会空出一行）或按Shift +