网页设计基础2.
- 格式:pdf
- 大小:7.99 MB
- 文档页数:73


《网页设计基础》教案
总学时:32
教师:贺苗苗
第一章 第一节 网站界面设计的认识
一、网站的主题定位
1、网站的主题选择
企业的性质决定网站的风格,企业的内容决定网站的主题。
2、网站题材选择的原则
①主题要小而精 ②题材最好是自己擅长或者喜爱的内容
③题材不要太滥或者目标太高
3、题材类别
题材类别 代表网站
产品展示类 TCL王牌
新闻类网站 中华新闻网
下载类网站 华军软件园
BBS聊天论坛 心的家园
二、页面的功能模块设计
1、网站名称(Logo) 2、广告条(banner) 3、主菜单(menu)
4、新闻(news) 5、搜索(search) 6、友情链接(links)
7、邮件和地址(mailand address) 8、版权(copyright)
首页的设计步骤:①确定首页的风格和功能模块
②设计首页的版面布局
③处理技术上的细节
三、 网页界面设计(web interface design)------美观、用户便利、网站流程顺畅!
界面:字典上解释为两者间的界限、接点、共有连接的领域。例子:人与车直接接触的空间,方向盘(即界面);再如:人和门,门把手(即界面)。过大过小都不好。
界面设计最重要的两点:①使用的便利性 ②美学的层面
四、 界面设计相关用语
1、UI ( User Interface, 用户界面 )
即使用者界面的意思。实现互动是用户界面最主要的目的。
2、HCI ( Human-computer Interaction,人与计算机的交互作用 )
即,以人怎样做能更容易的掌握计算机的使用技术为目标,结果可以使界面技术得到飞跃和发展。
3、GUI ( Graphical User Interface,图形用户界面 )
一、单选题
1、目前在Internet上应用最为广泛的服务是 (B)。
A、FTP服务 B、WWW服务 C、Telnet服务 D、Gopher服务
2、域名系统DNS的含义是 ( B)。
A、Direct Network System B、Domain Name Service C、Dynamic Network System D、Distributed
Network Service
3、主机域名center. nbu. edu. cn由四个子域组成,其中( D)子域代表国别代码。
A、center B、nbu C、edu D、cn
4、当标记的TYPE属性值为( D)时,代表一个可选多项的复选框。
A、TEXT B、PASSWORD C、RADIO D、CHECKBOX
5、为了标识一个HTML文件开始应该使用的HTML标记是 (C )。
A、
6、在客户端网页脚本语言中最为通用的是(A )。
A、javascript B、VB C、Perl D、ASP
7、在HTML中,单元格的标记是(A )。
A、 B、 C、 D、
8、在DHTML中把整个文档的各个元素作为对象处理的技术是(C )。
A、HTML B、CSS C、DOM D、Script(脚本语言)
9、下面不属于CSS插入形式的是( A)。
A、索引式 B、内联式 C、嵌入式 D、外部式
10、在网页中最为常用的两种图像格式是(A )。
A、JPEG和GIF B、JPEG和PSD C、GIF和BMP D、BMP和PSD
12、在HTML中,要定义一个空链接使用的标记是( A).
A、 B、 C、 D、
13、对远程服务器上的文件进行维护时,通常采用的手段是( B)
A、 POP3 B、FTP C、SMTP D、Gopher
14、Internet上使用的最重要的两个协议是(B )
VBA的WEB应用系列教程——HTML文档篇
上节课,我们说了HTTP通讯,HTTP通讯一般情况返回的是啥呢?是页面的源代码。例如,我们访问百度,返回了,“…”一大堆东西。就是,我们在页面点击右键,“查看页面源文件”,如图:
我们的浏览器,正是把这堆源代码,翻译成我们可视的生动地页面的。就像VBA一样,这堆代码是什么语言呢,就是通常所说的,超文本标记语言。
为啥叫标记语言,因为它只能用于展示,展示我们所看到的网页页面。不是编程语言哦。
为啥叫超文本呢,大家仔细看,这堆源代码有什么特征呢,就是有很多<…>这样的文本,一般而言,我们把<…>叫做标签,细心的同学可以发现,标签都是成对出现的,例如“百度一下,你就知道 ”。第一个叫做开始标签,第二个多带了个/叫结束标签。标签之间就是网页的文本,例如这个例子,就是我们网页标题的文本“百度一下,你就知道”。所以,标签的作用就是,给文本打上标记,告诉浏览器,怎么显示这个文本。例如本例,要求浏览器把“百度一下,你就知道”显示成网页的标题。HTML文档=文本+标签,所以就超文本啦。
总之,HTML就是用来描述网页的语言,像上面所说的这样的标签,是有一整套的,呵呵。
我们的教程,并不是为了教大家,怎么去做网页,设计网页,因此,大家仅仅需要,大致的了解一些HTML系列的文本标记语言的基础即可,知道常用的几个标签,有什么用即可。
一、网页数据提取常见的HTML标签/元素
上面说了,标签是用来描述网页的。浏览器读取HTML文档,识别标签,并按标签要求以网页进行显示文本。大部分标签都是成队出现的。
起始标签和结束标签之间的所有文本,都叫做元素。也就是这个格式就是:
<起始标签:也叫元素名>元素的内容<结束标签:/+元素名>
标签是可以拥有属性的,因此起始标签,有时候格式如下:
<元素名 属性名称=”属性值”>
属性提供了元素的一些附加信息啦,后面我们讲具体标签,大家就会见到属性怎么用。
另外,注意,元素是可以拥有元素的,即某个元素的内容有时候是一个子元素。
元素这东西,比较抽象,我们可以把它且当作一个对象来理解,例如工作簿对象,每个工作簿的名称都不一样(属性),每个工作簿里面都有工作表(子元素),每个表都有名称(属性),里面填写的内容也不一样(元素的内容)。
下面讲讲常见的和我们网页数据提取要常见的元素/标签。
(一) 整体框架结构:
每个网页文档,都是有个大致的框架,框架如下:
网页标题
习题
1. 以下标记符中,用于设置页面标题的是( A )。
A B
2. 以下标记符中,没有对应的结束标记的是( B )。
A
B3. 文件头标记也就是通常所见到的____
…_____标记。4. 创建一个HTML文档的开始标记符是_________,结束标记符是_________。
5. 标记是HTML中的主要语法,分____单_____标记和____双_____标记两种。大多数标记是____成对_____出现的,由____开始_____标记和_____结束____标记组成。
6. 把HTML文档分为__头部_______和______主体___两部分。___主体______部分就是在Web浏览器窗口的用户区内看到的内容,而__头部_______部分用来设置该文档的标题(出现在Web 浏览器窗口的标题栏中)和文档的一些属性。
7. HTML4或XHTML1.0的三种文档风格是__严格型、过渡型____、框架型_____。
8. 简述一个HTML文档的基本结构。
一个完整的HTML文件包含头部和主体两个部分的内容,在头部内容里,可定义标题、样式等,文档的主体内容就是要显示的信息。标记通常会作为HTML文档的开始代码,出现在文档的第一句,而标记通常作为HTML文档的结束代码,出现在文档的尾部,其他的所有的HTML代码都位于这两个标记之间,该标记用于告知浏览器或其他程序,这是一个Web文档,应该按照HTML语言规则对文档内容的标记进行解释;
…是HTML文档的头部标记;标记之间的文本是在浏览器中要显示的页面内容。
实验
用HTML语言编写符合以下要求的文档:标题为“班级主页”,在浏览器窗口用户区内显示“欢迎来到我们的班级主页”,完成后的效果如图2-3所示。