网页设计制作教程

2022-07-19

第一篇:网页设计制作教程

网页设计与制作教程

第1章 网页设计与制作概述

1.1网络的基础知识

1.1.1 TCP/IP协议

1.1.2 IP地址 1.1.3域名地址 1.1.4统一资源定位器 1.2图形图像的基础知识

1.2.1位图与矢量图 1.2.2常用的图像格式 1.2.3常用的图形格式 1.3网页的布局知识

1.3.1网页的基本结构 1.3.2页面的布局原则和模式 1.4网页的色彩应用

1.4.1色彩属性与象征意义 1.4.2网页色彩的规划 1.5 HTML基础

1.5.1 HTML语言的基本结构 1.5.2 HTML语言的基本单位 1.5.3 HTML标记符基础 1.5.4文本格式标记符 1.5.5超链接标记符 1.5.6图像标记符 1.5.7表格标记符 1.5.7框架标记符 1.5.8表单标记符 1.5.9滚动条 1.6 CSS技术

1.6.1 什么是 CSS 1.6.2 在网页中使用 CSS 1.6.3 CSS 样式定义 1.6.4 CSS 属性 1.6.5 CSS 过滤器简介 1.7 JavaScript技术

1.7.1 JavaScript脚本嵌入HTML文档的方法 1.7.2使用客户端脚本 习题一

第2章 DreamweaverCS6网页设计基础

2.1 Dreamweaver的工作环境

2.2构建Dreamweaver站点

2.2.1创建本地站点 2.2.2管理本地站点 2.2.3创建和管理本地站点中文件 2.3网页文本编辑

2.3.1正文文本的添加 2.3.2文本格式的设置 2.3.3页面属性的设置

2.3.4插入特殊字符 2.3.5插入空格 2.4 CSS样式设置

2.4.1创建CSS规则

2.4.2链接样式表 2.5制作一个简单网页

2.6 Dreamweaver工作环境的设置 习题二

第3章 图像与多媒体

3.1图像的应用

3.1.1在网页中插入图像 3.1.2设置图像属性 3.2创建鼠标经过图像

3.3图像占位符及属性的设置 3.4插入flash动画 3.5音频的应用

3.5.1音频文件格式 3.5.2网页中添加音频 3.6视频的应用 习题三

第4章 超级链接及其应用

4.1超链接概述

4.2创建文本超链接 4.3创建图像超链接 4.4创建电子邮件链接 4.5空链接 习题四 第5章 网页的布局

5.1表格的应用

5.1.1插入表格 5.1.2表格的嵌套 5.2表格编辑及属性设置

5.2.1文档中的设置表格格式优先顺序 5.2.2选择表格及其它元素 5.2.3设置表格属性

5.2.4设置单元格、行或列属性 5.2.5编辑单元格、行或列 5.3应用APDiv布局页面 5.4APDiv与表格的相互转换 5.4.1将APDiv转换为表格 5.4.2表格转换为APDiv 5.5框架的应用

5.5.1创建框架集

5.5.2查看和设置框架集属性

5.5.3查看和设置框架属性 5.5.4设置框架中显示的网页 5.5.5嵌套的框架集 5.5.6框架的编辑 习题五 第6章 表单的应用

6.1创建表单 6.2添加表单对象

6.2.1插入文本域

6.2.2插入单选按钮/单选按钮组 6.2.3插入复选框/复选框组 6.2.4插入选择框(列表/菜单) 6.2.5插入文件域 6.2.6插入按钮 6.3表单的提交

6.4应用表格布局表单实例

习题六

第7章 行为与脚本语言及模板和库的应用

7.1行为在网页中的应用

7.1.1行为、事件、动作

7.1.2添加行为

7.1.3Dreamweaver内置事件 7.2 JavaScript脚本

7.2.1 JavaScript脚本概述

7.2.2 JavaScript脚本语言特效 7.3创建与应用模板

7.3.1创建模板

7.3.2使用模板创建新网页 7.3.3修改模板

7.3.4文档从模板中分离 7.3.5设置模板的首选参数 7.4创建与应用库项目

7.4.1创建库

7.4.2在网页中应用库项目 7.4.3编辑并更新库页面

7.4.4将库项目从源文件中分离

习题七

第8章 站点的测试

8.1站点的测试 8.1.1检查浏览器兼容性 8.1.2.链接的检查与修正 8.1.3不同分辨率下的测试 8.1.4运行站点报告 8.1.5网站内容的编辑 8.2创建远程站点

8.2.1设置远程服务器 8.2.2连接远程站点 8.3文件的上传和下载

8.3.1文件的上传 8.3.2下载文件

8.3.3文件的取出与存回

习题八

第9章 FireworksCS6基础及其在网页制作中的应用

9.1 FireworksCS6基础

9.1.1认识FireworksCS6工作区

9.1.2文档管理

9.1.3使用布局工具 9.1.4各种面板 9.1.5常用工具

9.2绘制并编辑矢量图形

9.2.1绘制与编辑基本形状 9.2.2绘制与编辑自动形状 9.2.3自由变形形状 9.2.4复合形状 9.3创建并修饰位图图像

9.3.1创建位图图像 9.3.2编辑位图图像 9.3.3修饰位图 9.4创建并编辑文本

9.4.1创建文本 9.4.2选择文本 9.4.3编辑文本 9.5应用笔触和填充

9.5.1应用颜色工具 9.5.2应用和更改笔触 9.5.3应用和更改填充

9.5.4在笔触和填充中添加纹理 9.5.5应用样式 9.6应用动态滤镜

9.6.1应用动态滤镜 9.6.2调整动态滤镜 9.7使用切片和热点

9.7.1使用切片

9.7.2使用热点

习题九

第10章FlashCS6基本操作及在网页制作中的应用

10.1 FlashCS6的基本操作

10.1.1 FlashCS6的工作界面

10.1.2 Flash文档的创建、打开、保存 10.1.3面板组的使用 10.2时间轴的使用

10.2.1图层

10.2.2帧 10.2.3播放头 10.2.4场景

10.3元件、实例和库资源

10.3.1元件的创建

10.3.2实例

10.3.3库面板以及元件与实例的关系 10.4创建各种动画

10.4.1遮罩层动画 10.4.2引导层动画

10.4.3形状补间动画 10.4.4逐帧动画

10.5在动画中添加声音 10.6文本的使用

10.6.1传统文本字段

10.6.2使用文本布局框架(TLF)文本 10.7动作面板的使用

10.7.1动作面板的介绍 10.7.2动作脚本的基本元素 10.8 ActionScript基本语句

10.8.1时间轴控制命令 10.8.2浏览器/网络命令 10.9动作的应用

10.10测试发布Flash动画

10.10.1制作过程中的测试

10.10.2测试方法

10.10.3下载模拟测试 10.10.4发布影片 10.10.5优化Flash文档 习题十

第11章 PhotoshopCS6基本操作及在网页设计中的应用

11.1 PhotoshopCS6基本操作

11.1.1 PhotoshopCS6的工作界面 11.1.2文件操作 11.1.3环境设置 11.1.4基本概念

11.1.5选区的创建与编辑

11.1.6利用画笔类工具绘制图像 11.1.7利用形状绘制工具绘制图像 11.1.8图像修饰工具的应用 11.1.9调色命令的高级应用 11.1.10图层样式 11.1.11文字图层 11.1.12滤镜 11.2页面设计与制作

11.2.1整体页面的制作 11.2.2制作导航栏 11.2.3制作网页内容板块 11.2.4制作网页页脚

习题十一

第12章网页制作工具集成及网页制作综合实训

12.1 Fireworks与Dreamweaver的集成 12.2使用Photoshop和Dreamweaver 12.2.1 Dreamweaver中处理Photoshop文件的工作流程

12.2.2创建智能对象 12.2.3更新智能对象 12.3 Dreamweaver与Flash的集成 12.4网页制作综合实训 习题十二

第二篇: 网页设计教程-ASP入门教程静态网页和动态网页

静态网页与动态网页的区别在于Web服务器对它处理方式不同。了解这种区别对于ASP概念的理解至关重要。

1、静态网页

静态网页是标准的HTML文件,其文件扩展名是。htm或。html。它可以包含HTML标记、文本、Jave小程序、客户端脚本以及客户端ActiveX控件,但这种网页不包含任何服务器端脚本,该页中的每一行HTML代码都是在放置到Web服务器前由网页设计人员编写的,在放置到Web服务器后便不再发生任何更改,所以称之为静态网页。

步骤1:Web浏览器请求静态网页。

步骤2:Web服务器查找静态网页。

步骤3:Web服务器将静态网页发送到请示浏览器。

当用户单击Web页上的某个链接、或在浏览器中选择一个书签、或在浏览器的“地址”框中输入一个URL地址并单击“转到”时,浏览器向Web服务器发送一个页请求。

Web服务器收到该请求,通过文件扩展名(。htm或html)判断出是HTML文件请求,并从磁盘或存储器中获取适当的HTML文件。

Web服务器将HTML文件发送到浏览器,由浏览器对该HTML文件进行解释,并将结果显示在浏览器窗口中。

2、动态网页

动态网页与静态网页之间的区别在于:动态网页中的某些脚本只能在Web服务器上运行,而静态网页中的任何脚本都不能在Web服务上运行。当Web服务器接收到对静态网页的请求时,服务器将该页发送到请求浏览器,而不进一步的处理。当Web服务器接收到对动态网页的请求时,它将做出不同的反映:它将该页传递给一个称为应用程序服务器的特殊软件扩展,然后由这个软件负责完成页。应用服务软件与Web服务器软件一并安装、运行在同一台计算机上。

步骤1:Web浏览器请求动态网页。

步骤2:Web服务器查找该页并将其传递给应用程序服务器。

步骤3:应用程序服务器查找该页中的脚本命令并完成页。

步骤4:应用程序服务器将完成的页传递回Web服务器。

步骤5:Web服务器将完成的页发送到请求浏览器。

当用户单击Web页上的某个链接、在浏览器中选择一个书签、或在浏览器的“地址”框中输入一个URL地址并单击“转到”时,浏览器向Web服务器发送一个页面请求。

Web服务器收到该请求,通过文件扩展名(。asp)判断出是动态网页文件请求,并从磁盘或存储器中获取适当页然后将该页传递给相应的应用程序服务器。

应用程序服务器查找该页中的脚本命令,并通过在服务器上执行这些脚本命令最终完成页,然后将脚本程序代码从页上删除,由此得到的结果是一个静态网页。

应用程序服务器将所生成的页传递回Web服务器。

Web服务器将该页发送到浏览器,当该页到达客户端计算机时,所包含的全部内容都是纯HTML代码,由Web浏览器对这些HTML代码进行解释,并将结果显示在浏览器窗口中。

第三篇:《网页设计与制作项目化教程》习题参考答案

项目一 网页设计概述

1.填空题

(1)需求分析、规划站点结构、收集素材、设计制作网站网页、开发动态网站功能模块、申请域名和服务器空间、发布与维护网站和推广网站

(2)页面标题、网站标志、页眉、导航栏、主内容区和页脚

(3)“国”字型、“厂”字型、“框架”型、“封面”型和Flash型 (4)搜索功能、留言板、新闻信息发布系统和在线购物 2.略

项目二 Dreamweaver CS3简介

1.填空题

(1)Adobe公司

(2)设计者、代码编写者

(3)标题栏、菜单栏、工具栏、文档窗口、状态栏、属性面板和控制面板 (4)代码视图、拆分视图、设计视图 (5)Ctrl+S、Ctrl+W 2. 略

项目三 创建与管理网站

1.填空题 (1)index.html (2)本地站点和远程站点 (3)本地站点 (4)上传,下载 2.略

项目四 利用表格布局网站首页

任务一

利用表格规划页面

1.填空题

(1)“国”字型、拐角型、标题正文型、封面型、混合型。 (2)表格布局、DIV+CSS布局、框架布局

DIV+CSS布局 (3)0、0、0 (4)3 (5)固定的像素值、百分比

2.问答题

表格布局注意事项有:

(1)不要把整个网页当成一个大表格,尽量使用分块。

(2)可以使用嵌套,但一般嵌套不宜超过三层,否则会影响浏览速度,而且在修改表

第 4 页 共 11 页 面中插入相应的媒体对象或插件,选中插入的媒体对象或插件,通过【属性】面板设置对象的属性后即可。

任务四

制作超链接

1.单项选择题

(1)A

(2)D

(3)C 2.填空题

(1)4

(2)_blank

(3)锚链接

创建锚记

链接锚记 3.问答题

(1)绝对路径是包含服务器协议的完全路径,是一种与源地址文件无关的路径形式。 文档相对的路径是指与当前文档所在的文件夹相对的路径,它使用源地址文件和目标地址文件之间的 位置来表示路径,只要整个站点的结构和文件的位置不变,改变站点的路径不会影响路径的正确性。 根目录相对路径是指从站点根文件夹到被链接文档经由的路径。一个根相对路径以前斜杠开头,它代表站点根文件夹。 (2)在为锚记命名时,必须遵循以下3条规则:

 锚记名称的第1个字符最好是英文字母,一般不要以数字作为开头;  锚记名称区别英文字母的大小写;

 锚记名称间不能含有空格也不能含有特殊字符。

(3)目前JAVA在网页中的应用越来越广泛,有一些JavaScript事件是有链接的,但并不是针对文本、图像或其他某一个对象的,而且也不需要关闭当前页面,这时需要通过空链接来实现。如设为首页或添加收藏特效的实现。

任务五

页面元素源代码

1. 单项选择题

(1)B

(2)C

(3)B

(4)C

(5)C

(6)A

(7)B 2.填空题

(1)文字 (2)boder (3)embed (4)颜色代码

项目六 利用表单获取用户反馈

任务一

设计表单

1.单项选择题

(1)A

(2)C

(3)D 2.填空题 (1)提交按钮

(2)单行文本域

多行文本域

密码文本域 (3)表单对象和应用程序 (4)高度

3.问答题

(1)有区别。区别在于:列表所占空间比较大,可以一次显示多个选项;而菜单一次只能显示一个选项,想要查看其他选项,则需要展开下拉菜单。 (2)通过文件域使用户将其计算机上的文件上传到服务器,前提是要求使用post方法将文

第 5 页 共 11 页 件从浏览器传输到服务器。

(3)【提交】按钮:单击【插入】工具栏【表单】类别的【按钮】按钮,或者选择【插入】|【表单】|【按钮】命令,弹出【输入标签辅助功能属性】对话框,单击【确定】按钮。

【重置】按钮:先创建一个【提交】按钮,然后选择此按钮,在属性检查器中单击【动作】选项组中【重设表单】单选按钮。

【普通】按钮:先创建一个【提交】按钮,然后选择此按钮,在属性检查器中选择【无】单先按钮,并在【标签】文本框中输入按钮。

任务二

表单处理

1.问答题

(1)单选按钮与复选按钮在表单中是两种不同的表单对象。单选的选项,无论有多少个选择,访问者都只能选择其中一项;复选的选项,访问者可以选择多个选项,甚至可以全部选定。

(2)由菜单框变成列表框,并且具有垂直滚动条。

(3)Action属性功能是指定处理表单信息的服务器端应用程序。该程序可以是ASP程序,也可以是CGI、PHP等脚本。还可以是用C、VB等编写的动态链接库等程序。

项目七 利用CSS美化网站

任务一

创建及应用CSS

1.填空题

(1)Cascading Style Sheets (2)标签选择器、类选择器、高级选择器 (3).css 2.简答题

(1)直接引用式:这种方法是将CSS样式直接作用于HTML标签。

内部文档引用式:这种方法是CSS样式定义于页面文档的之间,作用的范围是当前的HTML文档。

外部文档引用式:这种方式CSS样式定义于CSS样式表文件,要使用其中定义的规则,首先应将CSS样式表附加到页面文档。

直接引用式主要用于对具体的标签设置样式,其作用的范围只限于本标签;使用内部文档引用式可以统一设置相同的页面元素的样式,便于设计及修改;外部文档引用式可以重复用于多个不同的页面。

(2)标签选择器:网页文档的标签选择器是最基本的选择器。在CSS中,可以对某一具体标签的样式进行重新定义。

类选择器:要应用样式而无需考虑具体涉及的元素,最常用的方法就是使用类选择器。在 CSS 中,类选择器以类名前有一个点号显示。

ID选择器:ID选择器可以为标有特定 id 的 HTML 元素指定特定的样式,以id前一个#号显示。

任务二

CSS设计页面文本样式

1.填空题

(1);link、:visited、:hover、:active (2)color (3)text-decoration:none;

第 6 页 共 11 页 2.选择题

(1)B (2)B (3)B

任务三

CSS样式设计页面背景

1.填空题

(1)background-color (2)重复、不重复、横向重复、纵向重复 (3)background-position 2.选择题

(1)B (2)D

任务四

利用CSS样式控制页面元素位置

1.填空题

(1)margin、padding (2)浮动的元素框可以向左或向右移动,直到它的外边缘碰到包含框或另一个浮动框的边框为止。 2.选择题

(1)C (2)A

任务五

CSS样式设计页面元素边框

1.填空题 (1)border (2)线条样式、颜色、粗细 2.选择题

(1)C (2)A 项目八 利用库和模板制作网站二级页面

任务一 利用库制作网站页首和页脚

1.单项选择题

(1)C (2)A (3)C (4)A 2.填空题

(1)文本 图像 表格 (2)Library (3)不能。 (4)更新 3.问答题

(1)什么是库?怎样创建库项目?

答:库可以用来存放Web站点中经常重复使用的网页元素,如图像、文本和其他对象等。

创建库项目的方法有两种:直接新建库项目和把已有页面元素转换为库项目。

(2)如何向页面中添加库项目?

答:插入库项目的方法有两种,一种是直接将要使用的库项目拖到文档中需要插入的地方,另一种方法是将光标放置在文档中需要插入库项目的地方,然后选择需要的库项目并单击库面板底部的“插入”按钮。

第 7 页 共 11 页

任务二

制作网站二级页面模板

1.单项选择题

(1)B (2)C (3)B (4)C (5)C 2.填空题

(1)可编辑区域和锁定区域 可编辑区域

锁定区域 (2)可编辑区域 (3)资源

(4)不可编辑区域 可编辑区域 (5)Templates

3.问答题

(1)怎样创建模板和编辑模板?

答:创建模板的方法有四种。  创建模板方法一

(1)单击菜单【文件】/【新建】, “新建文档”对话框。 (2)新建类型中选择“空模板”,选择合适的模板类型和布局。单击“创建”按钮。  创建模板方法二

单击资源面板中模板面板右下方的新建按钮,新的模板显示在面板中, 在“Untitled”处输入模板名称后,双击可进行编辑。

 创建模板方法三

单击菜单【插入记录】/【模板对象】/【创建模板】。  创建模板方法四

编辑一个普通页面,然后单击菜单【文件】/【另存为】,将保存类型选为“模板文件”,单击“保存”。

编辑模板的方法在模板面板中选定模板、单击编辑按钮或双击模板名称或使用快捷菜单的Edit、编辑完成后保存。

(2)什么是模板?使用模板有哪些好处?

答:模板是作为创建其它文档的样板的文档。创建模板时,可以说明哪些网页元素不可编辑,哪些元素可以编辑。其扩展名为.dwt。

使用模板有利于保持网页风格的一致;提高工作效率。

(3)如何应用模板?

答:将模板应用于已有网页的方法有:

方法一:打开要应用模板的网页,打开模板面板,右击要应用的模板,在弹出菜单中选择“应用”。

方法二:打开要应用模板的网页,选择菜单【修改】/【模板】/【应用模板到页】。

项目九 使用Dreamweaver实现网页特效

任务 应用Dreamweaver内置行为

第 8 页 共 11 页 1.单项选择题

(1)D (2)D (3)A (4)D (5)C 2.填空题

(1)Javascript代码

(2)事件 动作

(3)动作 动作

(4)Shift+F4 (5)onMouseDown (6)打开浏览器窗口

3.问答题

(1)什么是行为?行为面板提供了哪些功能?

答:行为就是某个事件和由该事件触发的动作的组合。 行为面板主要包含以下功能:

1是显示设置事件:显示添加到当前网页的行为事件。

2是显示所有事件:显示所有可能的行为事件,按照字母降序排列。详见表9-1。 3是添加行为:通过点击“+”,可以为选定的页面元素添加行为。Dreamweaver提供的行为有多种,详见表9-2。

4是删除行为:通过点击“-”,可以删除选定的行为。 5是向上移动行为。 6是向下移动行为。

(2)举例说明怎么给网页对象添加行为? 答:添加行为的步骤:

1) 在页面上选择一个元素,可以使一个图像,也可以是一个表格。 2) 选择菜单【窗口】/【行为】命令,打开行为面板。

3) 单击加号 (+) 按钮并从“动作”菜单中选择一个动作。 其中菜单中呈灰色的动作是不可选择。

4) 在出现的对话框中为该动作输入参数,然后单击“确定”。

5) 触发该动作的默认事件显示在“事件”列中。如果这不是所需的触发事件,可以从“事件”弹出菜单中选择其它事件。

项目十 网站的发布与管理

任务一 网站的发布

1.单项选择题

(1)A (2)C (3)B (4)D (5)D 2.填空题

(1)测试站点兼容性 (2)链接 验证标记 (3)站点遮盖。 3.问答题

(1)什么是远程站点?

答:远程站点就是存储于Internet服务器上的站点和相关文档

(2)发布网站前要进行哪些测试?怎么测试?

答:对一个已经完成制作的站点进行测试,主要需要做以下几项工作: 1) 测试站点的兼容性 2) 检查站点的链接 3) 测试站点的下载速度

第 9 页 共 11 页 4) 创建站点报告

测试浏览器兼容性的步骤:1打开站点,打开站点中的主页2单击菜单【文件】/【检查页】/【浏览器兼容性】3显示“浏览器兼容性检查”面板

检查站点链接的步骤:1打开站点,打开站点主页2单击菜单【站点】/【检查站点范围的链接】,或者按“Ctrl+F8”组合键3显示“链接检查器”面板。默认显示“断掉的链接”,可以看出本站点没有链接错误

测试下载速度的步骤:1设置连接速度,一般有7个选项:14.4、28.

8、33.6、

56、6

4、1

28、1500(kb/s),其中14.4最慢,1500最快,用户一般可设置为56。点击【编辑】/【首选参数】,在“首选参数”对话框中选择“状态栏”分类,将连接速度设置为56;2在网页状态栏中查看网页下载时间。

生成站点报告的步骤:1点击菜单【站点】/【报告】,打开“报告”对话框2根据需要进行选择3点击“运行”按钮,在浏览器中打开一个新窗口,显示报告内容。

(3)怎样申请网站空间和域名?它们的功能是什么? 答:申请网站空间和域名的方法略

网站空间是用来存放网站内容的空间。

域名是与网络上的数字型IP地址相对应的字符型地址,用来对网站进行访问。

(4)利用Dreamweaver怎样上传网站? 答:步骤如下:

1) 打开站点,在“文件”面板中选择“连接到远端主机”。

2) 连接到远端主机后,选择“文件”面板中的“展开以显示本地和远端站点”。 3) 在本地和远端站点展开图中,把远端站点中的文件全部删除,然后选中本地文件中要上传的网站文件,点击上传按钮,进行上传。

4) 完成发布后,在浏览器中输入域名,即可对网站进行访问了。

任务二

网站的管理

1.单项选择题

(1)B (2)D (3)A

2.填空题

(1)图形 结构

链接 (2)备注 _notes

3.问答题

(1)怎么设置站点同步?

答:设置站点文件同步的步骤如下:

1) 打开站点,在“文件”面板下单击同步按钮,打开“同步文件”对话框。进行适当设置,在“同步”下拉列表中选择“整个站点”选项,在“方向”下拉列表中选择“放置较新的文件到远程”选项,单击“预览”按钮。

2) Dreamweaver检查站点中每个文件将要执行的操作。打开Synchronize对话框(同步对话框),单击“确定”按钮,完成文件同步。

(2)什么是站点地图?作用是什么? 答:站点地图是一个非常理想的站点结构管理工具。站点地图从站点主页开始显示站点结构,

第 10 页 共 11 页 它将站点中的页面显示为图标,并按出现的顺序来显示链接。

通过站点地图,用户可以选择网页、打开网页进行编辑,也可以向站点中添加新网页、创建文件间的链接以及更改网页标题。

(3)设计备注的作用是什么? 答:利用设计备注就可以对站点和站点中的文件进行备注,这样用户就可以很快了解文件的内容了。

第 11 页 共 11 页

第四篇:网页制作基础教程

第一章 网页制作基础

1、 什么是网页

一般浏览器中打开的都是网页,这些文档是通过超文本标记语言HTML表示出来的;

主页:在网站中默认打开的页面称为主页,也叫首页,主页是进入网站的门户,

网页中包括的内容:

文本,图像,超级链接,表格,表单,多媒体及一些特殊的效果

2、 网站及运作原理

网站是在互联网上一个固定的面向全世界发布消息的地方,它由网站地址和网站空间构成;

网站开发者常常将网站称作为站点,在网站的开发者来说,网站就是在计算机上创建的一个多级的文件夹,并在各文件夹中保存着相关网页文件。

根据站点文件夹所在的位置分为:本地站点和远程站点; 根据服务技术分:静态网站和动态网站

3、 了解HTML语言

HTML是网上用于编写网页的主要语言,使用HTML语言编写的网页文件也是一个标准的纯文本文件,可以使用文本编辑器将它打开,但是该纯文本文件如果使用浏览器打开就会看到排版整齐的网页;

4、 HTML语言标签

HTML标签用来标记网页元素,以形成文本布局,文字的格式及五彩缤纷的画面,HTML的标签分单标签和成对标签两种

基础标签:

第五篇:网页设计与制作

实训报告

班级:多媒体152

姓名:张莉钧

学号:201501032118

指导老师:薛杨 王淑惠

实训时间:6.20——6.24

一、实训目的:

1、进一步熟悉和掌握网站建设的基本流程和技术规范;

2、巩固运用Dreamweaver网页制作软件制作网页、特别是制作复杂网页的知识;

3、巩固运用PS图像处理软件进行网页中图形制作和运用flash动画制作软件设计网页中动画的知识;

4、巩固综合运用Dreamweaver、PS、flash三个软件完成网站建设任务的方法,能独立设计一个内容完整、图文并茂、技术运用得当的网站;

5、具备独立撰写实训报告基本能力;

6、在网页设计的实践中培养分析问题、解决问题的能力,培养协作、交流的能力,培养创新能力和团队意识;

7、紧紧围绕网页制作的流程:规划、设计、开发、发布、维护来进行网站的开发,制作出具有较高水准的静态网页。以此作为学生学习这门课程的阶段性总结,使学生复习、巩固所学过的理论,并予

以适当的深化,进一步训练学生的基本技能(如:搜集资料、整理数据、发现与分析问题、寻求解决问题的方案等),为今后从事网站开 发、维护和管理奠定基础

二、实训项目——特色美食餐厅网站设计

1、网站主题

我的网站的主旨在于从各个方面全面的介绍特色美食餐厅,包括它的菜品、餐厅的环境以及促销活动。另外,网站里还包括餐厅资料和联系方式,网站里的每一个网页都有统一的风格,每一个网页的主题色彩都是橙色和白色搭配,用以展示餐厅特色的效果。其实最重要的是要做出自己的风格,给浏览者好的欣赏感受。

2、网站材料

主要在网站上搜集所要的网页信息,包括图片、文字。同时,查

询相关的书籍、百度等方式收集所需的文字资料,图象资料,flash动画和网页特效等,用以得来更加具有说服力的页面。要想做好自己的网站,能够给浏览者好的欣感受,就要尽量搜集材料,搜集得材料越多,以后制作网站就越容易。精选自己收集的材料,作为自己制作网页的素材,这样就可以做好一个好的网站。

3、网站规划

我的网站共有7个主页面:首页、美食介绍、优惠活动、商品促销、宴会定制、会员中心和关于我们。每一个页面用统一的模块,以保证网站统一的页面风格。网页布局主要用框架和表格,用框架定位内容的大体结构,再用表格具体定位。位子的设计也是重要的一个部分,根据具体内容决定字体风格,相同的风格多次调用是CSS设计一个样式,以保证随时、准确的调用。

三、 网页设计工具使用

1、Dreamweaver——我们使用它做网页的主要布局。

2、Photoshop——我们使用它做网页图片的处理以及logo的制作。

3、Flash——我们使用它制作动画

四、网站设计流程

1、主页设计

2、色彩搭配

五、网站测评

网站建成后为了出现不必要的错误,需对它进行测评,测评的主要内容为

1、链接有效性,静态网页只要保证每一个网页正常浏览保证页面信息不缺失就可以了。

2、网页语言的正确性,检查网页中英文拼写与html语言是否正确,在静态网页中语言都是自动生成的所以语言的正确性一般不会有太大的问题。

3、网站便用性,检查网站的整体结构是否清晰以及网站页面的导航是否清晰。

最终效果图

总结:

通过学习一学期的网页设计,我们收获了不少,我们这次实训虽然只做了一个网站,但这个里面包括的内容很多,主要包括网站主页的布局设计,建立站点,网页与网页之间的连接,以及模板和css样式表的应用。

收获:通过一个星期的网页设计实训,从中学到了不少的网页设计知识,之前都是老师讲得比较多,总以为很难实现,但自己做起来其实也并不是想象中那么苦难。虽然代码看起来复杂,但是慢慢学会分析就会懂。

不足:当然这次实训我也有不足,比如css样式表不能灵活应用,网页布局也不够完美,不过多亏了王老师和薛老师的细心指导,我才能完成这次实训。

Flash实训总结

班级:多媒体152

姓名:张莉钧

学号:201501032118

指导老师:薛杨

实训时间:2.

flash培训实训总结提要:

这次实训过后,对flash有了基础的了解,想在这方面学习的话有了初步的基础,主要是学习了flash中各种工具的使用,

1、确定动画剧本及分镜头;

2、设计出不同字母间的完美转换。、

一、实训目地:让我们更熟练的应用flash制作动图

二、实训项目——不同字母间的形状变换

1、先要确定使用的字母w o r l d

2、再给每个字母使用不同的颜色以及给它们变形

3、最后再给每个字母做不同的变换方式

三、总结 实训收获: 通过这次实训我更加巩固了对flash的应用,虽然这中间有很多失误和很多不必要犯的错误,但更多的是收获,这次实训过后,对flash有了基础的了解,想在这方面学习的话有了初步的基础,主要是学习了flash中各种工具的使用,

1、确定动画剧本及分镜头;

2、设计出字母形状;

3、导入到flash进行制作;

4、剪辑配音。在分镜头画面脚本绘制过程中,应养成填表的好习惯,在表格中注明画面的景别,画面景别使用的专业术语有:大特写、特写、近景、中景、全景、远景、全远景、纵深景等。画面镜头号景别秒数内容摘要对白效果音乐。 存在的问题及解决思路: 这几个星期我学习的flash大多是比较基础的,Flash中字母刻画不够完善,很多动作,变形都需要有一定的美术功底及Flash基础,对于初学的我很困难,所以在此只做了一些简单的变形。在Flash中的一些脚本语言初学时无从下手,只好从大量的视频、书籍里寻找答案。 4.结束语

为了对Flash的现况有更好的了解,主要是对于网上一些MV做了参考。现在的FlashMV已经逐渐成熟了。MV的制作从开始的大量使用位图,转换为矢量后让它们移动来制造动画效果,或者是一些简单的闪入、闪出来丰富画面,发展到现在的广泛使用矢量图甚至手工作图,一些费心思的逐帧动画让我看到了Flash的日渐成熟;从以前的生硬呆板,发展到今天的生动、逼真。Flash动画说到底就是“遮罩+补间动画+逐帧动画”与元件(主要是影片剪辑)的混合物,通过这些元素的不同组合,从而可以创建千变万化的效果。我不仅复习熟练了相关的课程、专业,还学习掌握了很多知识,同时也认识到还有很多基础知识要去学习,去巩固。在以后的时间里,我将花费大量的时间用于学习Flash及相关知识,在Flash之路上我会走的更远。

上一篇:物业工程移交清单下一篇:物业管理学习心得