网页设计与美工

项目一

DreamweaverCS5基础>>2023/6/182023/6/18项目导入

周扬了解到要成为一位成功的网页设计师，要具备许多网页制作的专业知识和专业技能。例如:要会熟练地运用Dreamweaver等软件对网页进行总体设计；要会运用Photoshop等软件制作和编辑网页中的图像；为了增强动态效果，还要会用Flash去增加网页的动画效果……。项目导入2023/6/18任务分析1

首先，周扬想要了解一下Photoshop、Flash和Dreamweaver等软件的相关知识，然后，周扬打算利用PhotoshopCS5制作一张图片，如图1-1-1所示。在这个过程中，周扬将会学到：

（1）Dreamweaver、Photoshop及Flash的相关知识；

（2）PhotoshopCS5文字工具组中“横向文字工具”的使用；

（3）利用PhotoshopCS5制作图像文件。任务分析图1-1-1周扬想要制作的图片任务分析2023/6/182023/6/18相关知识11．Adobe公司和它的软件Adobe创建于1982年，是世界领先的数字媒体和在线营销解决方案供应商。它的软件产品几乎涵盖了所有多媒体音视频编辑，出版书刊排版，平面和三维动画和美术设计等各行各业的创意领域。

Dreamweaver、Photoshop和Flash是Adobe公司的拳头产品。相关知识Dreamweaver，简称DW。LOGO如图1-1-2所示。相关知识2023/6/18图1-1-2DreamweaverLOGOPhotoshop简称PS。LOGO如图1-1-3所示。Flash软件，简称FL，LOGO如图1-1-4所示。图1-1-4FlashLOGO图1-1-3PhotoshopLOGO2023/6/18任务实施1Step1.启动Photoshop，打开“新建”对话框Step2.单击文字工具组中的“横向文字工具”，输入文字“我的第一个网页”。Step3.保存图像文件任务实施2023/6/18学习评价1学习评价序号评价指标自我评价1对Photoshop、Flash和

Dreamweaver等软件的基本功能和使用方法有基本的了解，能够正确打开和关闭这三个软件。（40分）

2能够利用Photoshop的文字工具输入“我的第一个网页”。（20分）

3能够独立完成图片的制作。（20分）

4学有余力，对小组内其他同学进行过辅导。（20分）

2023/6/18任务分析2

周扬了解了与网页设计相关的几种软件：Adobe公司的网页制作工具Dreamweaver，图像处理工具Photoshop，还有矢量动画制作工具Flash。在安装了DreamweaverCS5之后，周扬制作了自己的第一个网页，如图1-2-1所示。在这个过程中，周扬将会学到：（1）DreamweaverCS5的安装；（2）新建网页文件；（3）在网页中插入图像。任务分析图1-2-1周扬制作的第一个网页任务分析2023/6/182023/6/18相关知识2DreamweaverCS5的安装双击安装程序的“Set-up.exe”文件进入安装状态。1.在初始化窗体后出现，出现如图1-2-2所示。安装的欢迎窗体，点击“接受”按钮进入下一步。2.输入正确的软件序列号，并且选择软件显示的语言为“简体中文”。单击“下一步”。如图1-2-3所示。相关知识图1-2-2安装时的欢迎窗体图1-2-3输入序列号相关知识2023/6/183.跳过不输入AdobeID进入下一步，在安装选项窗体保持默认选项，选择安装的组件。如图1-2-4所示。单击“下一步”进入安装过程。4.正在安装Dreamweaver程序直到最后完成安装。程序安装界面如图1-2-5所示。5.安装程序完成后，单击“完成”按钮完成安装。图1-2-4选择安装的组件图1-2-5软件安装过程2023/6/18任务实施2Step1.双击桌面上的DreamweaverCS5快捷方式图标，打开DreamweaverCS5。Step2.选择“新建”→“HTML”选项进入程序主界面，单击“设计”按钮，可显示设计界面；单击“代码”按钮，可显示代码窗口；单击“拆分”按钮，可同时显示设计窗口和代码窗口。任务实施Step3.

单击“设计”按钮，切换到设计视图，在菜单栏中单击“插入”→“图像”命令，插入图像。Step4.保存网页、预览网页。2023/6/18学习评价2学习评价序号评价指标自我评价1了解DreamweaverCS5的安装方法和步骤。（10分）

2对DreamweaverCS5界面中的“设计”窗口、“代码”窗口和“拆分”窗口的功能和作用有所了解。（10分）

3能够在DreamweaverCS5中新建并保存网页。（20分）

4能够在新建的网页中插入图片。（10分）

5能够在浏览器中预览网页。（20分）

6能够独立完成网页的制作。（20分）

7学有余力，对小组内其他同学进行过辅导。（10分）

2023/6/18项目总结

周扬终于完成了第一个网页的制作，保存了文件，关闭了自己心爱的电脑。今天是周扬进行网页设计学习的第一天，以前，周扬对网页设计方面的知识了解不多，今天，周扬对Photoshop、Flash和Dreamweaver等软件进行了学习，了解了这三个软件的相关知识、基本功能和这三个软件在网页制作中的作用，用Photoshop制作了一张图片，然后用Dreamweaver制作了一个简单的网页，并把自己用Photoshop制作的图片插入到网页当中。俗话说，万丈高楼平地起，周扬已经在网页设计的道路上迈出了坚实的一步，在今后的学习中，周扬将不断地对Photoshop、Flash和Dreamweaver等软件进行更加深入的学习。项目总结

通过学习项目一中周扬制作网页的方法，3-5人组成一个项目小组，共同学习Photoshop、Flash和Dreamweaver的相关知识，深入了解这三个软件在网页设计中的综合运用，然后制作一个网页。具体要求：1．项目组内要选出一名组长负责组织、协调，通过小组讨论，制定出评价量规，对小组成员进行评价，小组内各成员要有具体明确的分工。2．模仿周扬的操作方法，利用Photoshop制作一张图片。3．利用DreamweaverCS