当前位置:文档之家› 网页设计基础备课笔记

网页设计基础备课笔记

网页设计基础备课笔记
网页设计基础备课笔记

级链接组成。

5.动画

动画是网页中最活跃的元素,创意出众、制作精致的动画是吸引浏览者眼球的最有效方法之一。但是如果网页动画太多,也会物极必反,使人眼花缭乱,进而产生视觉疲劳。

6.表格

表格是HTML语言中的一种元素,主要用于网页内容的布局,组织整个网页的外观,通过表格可以精确地控制各网页元素在网页中的位置。

7.框架

框架是网页的一种组织形式,将相互关联的多个网页的内容组织在一个浏览器窗口中显示。例如在一个框架内放置导航栏,另一个框架中的内容可以随单击导航栏中的链接而改变。

8.表单

表单是用来收集访问者信息或实现一些交互作用的网页,浏览者填写表单的方式是输入文本、选中单选按钮或复选框、从下拉菜单中选择选项等。

网页中除了上述这些最基本的构成元素外,还包括横幅广告、字幕、悬停按钮、日戳、计算器、音频、视频、Java Applet 等元素。

三、超文本标记语言基础

一个网页对应于一个HTML文件,HTML文件以.htm或.html为扩展名。可以使用任何能够生成TXT类型源文件的文本编辑来产生HTML文件。标准的HTML文件都具有一个基本的整体结构,即HTML文件的开头与结尾标志和HTML的头部与实体2大部分。有3个双标记符用于页面整体结构的确认。

四、网页设计的基本流程

一个网站的建设是需要吧很多细节结合在一起,只有把各步骤有序的完成,才能建成一个完整的网站,虽然建站的步骤很多,而且都是分开的部分,但是这些步骤会形成一个基本的流程,按照这个流程去做,就能完成建站,下面就给大家介绍一下,网站建设的基本流程是什么?

1、域名空间一个网站的建设首先当然是选择一个好的域名,后缀一般都是选择.com和.cn 的较多,.com是国际域名后缀,.cn是中国的域名,域名的主体一般和你的网站主题,或者企业的名称全拼来做域名的主体,如今互联网当中网站繁多,很多域名已经被注册,可以是全拼,可以是首字母,可以加地域或者数字,但是一定要有意义,让人容易记住。当域名购买完了之后,还要有个域名可以访问到的地方,这时候就要租一个虚拟主机的空间了,把域名与主机绑定,当访问域名时,就直接进入放在虚拟主机空间里的网站了。

2、规划设计这时候就要着手规划想要的网站了,个人网站或者是企业站或是门户站,要

5

的交互性、提高下载速度、使页面更美观更易于设计且富有动感。Dreamweaver 对DHTML

完全支持,并提供了与之相关联的四大功能。而其它的可视化网页编辑工具几乎不提供或只小部分提供动态HTML的制作。

7、重复元素库

在Dreamweaver中定义的一个站点内,设计者可以将重复使用的内容(例如Header、Footer 等)独立定义。这样设计者在需要这些内容的地方只需做一个简单的插入就可以了。而且当元素库中定义的内容被修改后,整个站点中设计同样内容的地方将统一发生变化而无需再逐一修改。

8、基于目标浏览器的检测

目前浏览器更新换代很快,从2.0到4.0层出不穷。同时又有IE和Netscape两大阵营竞争。设计者制作出的网页必须面向功能不同的浏览器并保持其正确性。这是一项比较困难的工作。而Dreamweaver不仅在设计时可以基于不同的目标浏览器进行不同的设计,而且在页面制作完毕后,Dreamweaver可以基于目标浏览器对页面进行检测并给出报告。在报告中将显示出被检测页面的兼容性以及在不同浏览器中页面的区别,同时还将指出页面中HTML的句法错误。

9、FTP

在Dreamweaver中包含了一个界面极为友好的FTP工具。通过它,设计者可以非常方便的将设计的单一页面或者一个站点上传至服务器。同时,设计者还可以非常方便的将已经上传至服务器的文件下载以供参考和修改。在文件传输的过程中,Dreamweaver将记录下整个过程以供错误分析。

10、文件锁定

这是一种专为合作开发环境设置的档案机制。可以通过标记和取出机制设置只读或可编写属性来进行文档的保护。通过这种方法可以防止不必要的数据丢失,增强了安全性。

二、Dreamweaver工作区域

使用Dreamweaver CS5的工作区,可以查看文档和对象的属性,使用工作区内的工具栏,还可以快速地更新和修改文档。在集成的工作区中,全部窗口和面板都被集成到一个更大的应用程序窗口中。

查看完整的应用程序窗口——工作区布局

A:文档工具栏 B:应用程序栏 C:“文档”窗口 D:工作区切换器 E:面板组 F:标签选择器 G:属性检查器 H:文件面板

工作区元素概述

?欢迎屏幕:用于打开最近使用过的文档或者创建新文档。还可以通过产品介绍或教程了解有关Dreamweaver的更多信息。

?文档工具栏:包含一些按钮,用于提供“文档”窗口各种视图的选项、各种查看选项和一些常用操作。

?应用程序栏:Dreamweaver窗口顶部包含菜单(只限于Windows)、工作区切换器以及其他应用程序控件。

?标准工具栏:点击“查看”菜单,选择“工具栏”命令,在弹出的子菜单中选择“标准”项,即可显示标准工具栏。标准工具栏包括从“文件”和“编辑”菜单中执行的常见的操作按钮:新建、打开、在Bridge中浏览、保存、全部保存、打印代码、剪切、拷贝、粘贴、还原和重做等按钮。

?编码工具栏:包含可用于执行多项标准编码操作的按钮。仅在“代码”视图中显示。?“样式呈现”工具栏:可以查看设计在不同媒体类型中的外观(如果使用依赖于媒体的样式表)。它还包含一个允许您启用或禁用层叠式样式表 (CSS) 样式的按钮。?“文档”窗口:显示当前正在创建和编辑的文档。

?“属性”检查器:用于查看和更改所选对象或文本的各种属性。每个对象具有不同的属性。默认情况下,在“编码器”工作区布局中,属性检查器是不展开的。

?标签选择器:位于“文档”窗口底部的状态栏中。显示环绕当前选定内容的标签的层次结构。单击该层次结构中的任何标签可以选择该标签及其全部内容。

称为HTML5开发

二、使用表格设计网页

表格、图象及超链接

在网页中使用表格(表格的用途;插入表格;表格的基本操作、设置表格属性;编辑表格)(理解,核心)

在网页中插入图像(插入图像;图文混排)(理解,核心)

超接链接(超链接的基本概念;超链接的创建目标和方法;)(理解,核心)

三、使用框架设计网页

1.框架、样式表

2.表单、行为、多媒体和HTML代码编辑

四、使用模板和库设计网页

模板的创建有三种方式。

1、直接创建模板

选择“窗口/资源”命令,打开“资源”面板,切换到模板子面板,

单击模板面板上的“扩展”按钮,在弹出菜单中选择“新建模板”这是在浏览窗口出现一个未命名的模板文件,给模板命名。然后单击“编辑”按钮,打开模板进行编辑。

编辑完成后,保存模板,完成模板建立。

2、将普通网页另存为模板

打开一个已经制作完成的网页,删除网页中不需要的部分,保留几个网页共同需要的区域。选择“文件/另存为模板”命令将网页另存为模板。

在弹出的“另存模板”对话框中,“站点”下拉列表框用来设置模板保存的站点,课选择一个选项。“现存的模板”选框显示了当前站点的所有模板。“另存为”文本框用来设置模板的命名。单击“另存模板”对话框中的“保存”按钮,就把当前网页转换为了模板,同时将模板另存到选择的站点。

单击“保存”按钮,保存模板。系统将自动在根目录下创建Template文件夹,并将创建的模板文件保存在该文件夹中。

在保存模板时,如果模板中没有定义任何可编辑区域,系统将显示警告信息。我们可以先单击“确定”,以后再定义可编辑区域。

3、从文件菜单新建模板

选择“文件/新建”命令,打开“新建文档”对话框,然后再类别中选择“模板页”,并选取相关的模板类型,直接单击“创建”按钮即可。”

发布网站到服务器方法/步骤

1.先下载一个flashftp,下载完成打开看到的是下面第一张图——点击左上角的会话

菜单选择快速链接——然后输入你的服务器登录名和地址——勾选或者输入21端口

2.登录之后选择你的网站的本地文件

3.选择好后单击右键选择传送或者把选中的文件直接拖到下面的那框里

4.最后点击下菜单栏下面的传输图标,等传好之后就看到你的网站了巩固

与练习小结网站的查错问题的解决

了解Fireworks基础

相关主题
文本预览
相关文档 最新文档