网页制作实例教程

第1章 校园网网站制作实例 1

1.1 网站定位 1

1.1.1 定位网站的主题和名称 1

1.1.2 定位网站的CI形象 2

1.1.3 确定网站的栏目 3

1.1.4 确定网站的目录结构 4

1.1.5 确定网站的链接结构 4

1.2 制作主页 5

1.2.1 定义站点 5

1.2.2 主页布局 7

1.2.3 利用Photoshop制作Logo图片 11

1.2.4 制作首页特效图片 15

1.2.5 首页制作 21

1.3 学校概况页面的制作 47

1.3.1 框架表格的制作 48

1.3.2 页面内容制作 51

1.3.3 “学院简介”页面的制作 55

1.4 页面源代码 55

1.4.1 主页源代码 55

1.4.2 “学校概况”页面的源代码 61

小结 65

2.2.1 网站结构 66

2.2 总体设计及其网站的建立 66

2.1 个人网站设计原则 66

第2章 “清风明月”个人网站的建立实例 66

2.2.2 网站内容 67

2.2.3 网站目录 67

2.2.4 建立网站 68

2.3 引导页的制作 69

2.3.1 背景画的制作 69

2.3.2 静态“清风明月”图的制作 71

2.3.3 广告条的制作 73

2.3.4 完成引导页 74

2.4.1 Logo图的制作 78

2.4 素材的准备与制作 78

2.4.2 NEW图标的制作 81

2.4.3 变色小球的制作 83

2.4.4 淡入淡出广告条的制作 85

2.4.5 导航条的制作 87

2.5 模板的制作 90

2.5.1 建立框架结构 90

2.5.2 设置框架属性 91

2.5.3 保存框架文件 92

2.5.4 上框架（topFrame）的设计 92

2.5.5 左框架（leftFrame）的设计 93

2.5.6 右框架（rightFrame）的设计 96

2.5.7 中间框架（mainFrame）的设计 96

2.5.8 模板的完成 97

2.6 主页的制作 98

2.7 子网页的制作 99

2.7.1 花海泛舟网页的设计 99

2.7.2 “自我写真”网页的制作 102

2.8 全面检查与发布 106

2.8.1 全面检查网站 106

2.8.2 发布网站 107

2.9 宣传自己的网站 108

2.10 页面源代码 111

小结 114

3.1 预览主要网页画面 115

第3章 “列车订票查询系统”网站制作实例 115

3.2 定义站点 116

3.3 制作主页 118

3.3.1 主页布局 118

3.3.2 利用Photoshop制作标题图片 124

3.3.3 利用Fireworks制作导航条 132

3.3.4 利用Fireworks制作纵向导航按钮 139

3.3.5 制作主页 142

3.4 制作“新闻”页面 148

3.5 制作“用户注册”页面 152

3.5.1 创建网页 152

3.5.2 创建客户端JavaScript程序 159

3.5.3 创建服务器端ASP脚本文件 162

3.6 主页源代码 164

3.6.1 框架集网页的程序代码 164

3.6.2 leftFrame.htm的程序代码 165

3.6.3 topFrame.htm程序代码 169

3.6.4 mainframe.htm程序代码 173

小结 174

第4章 企业网站制作实例 175

4.1 预览主要网页画面 175

4.2 制作主页 177

4.2.1 前期准备 177

4.2.2 定义站点 178

4.2.3 主页布局 179

4.2.4 利用Fireworks制作导航按钮 185

4.2.5 利用Fireworks制作banner中的抽线图效果 190

4.2.6 用Fireworks输出带切片的图形 191

4.2.7 从Fireworks到Dreamweaver的交互 193

4.2.8 主页的制作 194

4.3 企业黄页技术支持页的制作 199

4.4 动态留言板制作 199

4.5 制作过程中用到的一些技巧 204

4.6 使用Dreamweaver提高工作效率 207

4.7 后期维护 213

4.8 主页源代码 218

小结 228