一、设计前的策划和准备

　　在制作之前我们需要考虑网站的内容和风格，因为是为情人节准备的，所以网站的风格肯定是温馨浪漫的带点粉红的色彩。

　　网站内容包括情人之间的情书、相片册、属于两个人的音乐和恋爱历程的记载四个部分。

　　制作这个网站我们所需要的工具软件和程序包括：Dreamweaver、Fireworks、Sound插件，一段Maquee代码。

　　需要的素材资源包括：网页模板（网上下载）、音乐“最浪漫的事”、相片集。

　　二、模板下载

　　如何设计网站的结构和页面呢？这里我给大家推荐一个取巧的办法——到网站上去找免费模板。如今可以下载的免费网页模板很多，类型也很丰富，我们可以从中选择结构设计比较浪漫的模板，然后再将它们改造成为具有自己风格的网页，这样操作起来比较省时省力。在这里中可以找不少精美的网页模板，我们选择其中的一个粉色的模板下载到本地计算机上（如图1）。

图1

　　整个下载的模板压缩包中包括：原始的网页PSD图片文件，已经转换的Html网页和所使用的字体文件。

　　因为我们是将模板改成自己所要的风格，所以模板中提供的已经生成好的Html用处不大。直接使用Fireworks打开原始的网页PSD图片文件，在它的基础上修改页面视觉效果，自己切图转换成Html，再在Dreamweaver中编辑。

　　我们要将这个网页最终设计成为如图2的效果，网站里面装满了关于爱情的各种主题，我们将网页取名为“爱的纪念页”。

图2

　　除此之外我们还将“爱的音乐”（图2）和“电子相册”（图3）两个主题页面作为范例学习制作。当你打开音乐页面的时候可以直观地看到歌曲的歌词和MP3下载链接，同时还会响起这首“最浪漫的事”歌曲的网页背景音乐。电子相册制作成为Flash动画，打开页面后将不用动手就可以欣赏你们所有的相片了。

图3

图4