实训项目二 Photoshop 制作网站首页 第1 讲 制作首页的主体部分 课程总览 在本课程中,朋友们将学习到以下内容: •• 如 何 通 过Photoshop CS3 进 行 网站首页的版 面 设 计 •• 各 种 网页版 面 元 素 的设 计 技 巧 和 方 法 •• 如 何 进 行 网页的切 图 以及 切 片 的属 性 设 置 •• 如 何 创 建 与Flash 整 合 的FLV 视 频 •• 在Dreamweaver CS3 中使用“Spry 选项卡”构件 •• Photoshop、Flash、Dreamweaver 的协同工作 第 1 讲 制作首页的主体部分 本文以“石桥花园”的网站首页为例,来演示页面创作的整个过程。其实“石桥花园”是不存在的,笔者虚构出来也并非只为完成本例,我一直向往生活在幽静、闲雅之所,虽然“石桥花园”离我的初衷有很多差异,但也多少能表达我的一些想法吧。 书归正传,早先的网页页面设计一般是以 Dreamweaver 为中心,由Photoshop 或 Flash 等软件来提供各种素材,如图片、动画、文字等。自从Photoshop 出现了“切图”等专为网页设计所定制的功能后,设计的中心已慢慢转向了 Photoshop。因为 Photoshop 本身以图像为基础的特性,决定了他能对版面施以更精确的控制,使网页的页面能够更加灵活和生动的布局,这几乎完全解放 了网页设计师 的创作灵感 ,不再 受 方 方 正正的网页表格 所约 束 。现在我们 要 制作的是“石桥花园”首页的主体部分,主体部分包 括 标 题 、主展 示图片和导 航 条 。 网页教 学 网 1. 打 开 Photoshop CS3, 执 行 菜 单 “文件> 新 建 ”。在新 建 对话 框 中设置名 称 为“石桥花园”,宽 度 为“777”、高 度 为“800”,这个数 字并不“官 方 ”,只是我在平 时 工作当 中测 试 出来的而 已。对于 网页来说 ,一般只用于 屏 幕 显 示,所以分辨 率 为“72”、颜 色 模 式 为“RGB 颜 色 ”,其它 参 数 保 持 默 认 。 2. 按 下 Ctrl+A 全选页面,执 行 菜 单 “编 辑 > 填 充 ”将 页面填 为纯 黑 色 。在工具 箱 中选择 矢 量 的“矩 形 工具 ”,绘 制一个如图 1-1-1 所示长 方 形 A。然后使用白 色 的“直接 选择 工具 ”将 该 矢 量 形 状 扭 曲 成如图 1-1-1 中B 所示外 观 ,该 形 状 的十 六 进 制颜 色 值 为“#246b34”,一种...