当前位置导航:炫浪网>>网络学院>>网页制作>>Dreamweaver教程

情人节打造爱的纪念页


  难得今年的情人节正好是周末,恋爱中的男女们正好趁这个时间好好的划一下如何度过这个开心甜蜜的日子。有心的朋友还可以趁这几天想想送一份什么特别的礼物给心爱的人。

  如果做一个mini网站,记录两个人从相识到相知、相爱的整个过程,回忆一下恋爱中的点点故事。这个主意很浪漫吧?下面我们就一起来打造一个情人节的小网站。文章末尾提供压缩好的素材文件和制作完成的页面供大家下载参考。

  一、设计前的策划和准备

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

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

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

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

  二、模板下载

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

图1

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

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

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

图2

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

图3

图4

[1] [2] [3] [4] 下一页  

相关内容
赞助商链接