第一讲 网页设计基础

23

description

第一讲 网页设计基础. 教学重、难点. 网页设计中的若干术语 ( web 服务器及客户机、 URl 、常用协议、 IP 地址及域名、网页、网站、主页、超级链接) 网站建设的基本步骤. 重点. 网站建设的基本步骤. 难点. WWW. W orld W ide W eb ( 世界宽边网络)的缩写,也可以简称为 Web , 中文名字为“万维网”。. 一、网页设计相关概念. WEB 简介. 一、网页设计相关概念. 2.WEB 服务器及客户机. 用 URL 发出请求. http://www.scitc.com.cn. 客户机. 服务器. 送出网页. - PowerPoint PPT Presentation

Transcript of 第一讲 网页设计基础

Page 1: 第一讲 网页设计基础
Page 2: 第一讲 网页设计基础

网页设计中的若干术语 ( web 服务器及客户机、 URl 、常用协议、 IP 地址及域名、网页、网站、主页、超级链接)网站建设的基本步骤

网页设计中的若干术语 ( web 服务器及客户机、 URl 、常用协议、 IP 地址及域名、网页、网站、主页、超级链接)网站建设的基本步骤

难点

难点 网站建设的基本步骤网站建设的基本步骤

Page 3: 第一讲 网页设计基础

WWWWWW

World Wide Web (世界宽边网络)的缩写,也可以简称为 Web ,中文名字为“万维网”。

WEB 简介

Page 4: 第一讲 网页设计基础

2.WEB 服务器及客户机

Page 5: 第一讲 网页设计基础

客户端浏览器:通过在地址栏中输入 Web 服务器地址从而访问 Web 服务器的软件;

目前主要是 Internet Explorer ( IE )和Netscape :

Page 6: 第一讲 网页设计基础

3.URl3.URl 、、常用协议、常用协议、 IPIP 地址及域名地址及域名

URL

HTTP• 定义• 一般格式

• 定义• 作用• 优点

Page 7: 第一讲 网页设计基础

3.URl3.URl 、、常用协议、常用协议、 IPIP 地址及域名地址及域名

FTP

• 定义• 作用

IP

• 定义• 作用• 组成域名

Page 8: 第一讲 网页设计基础

1.1. 什么是网页什么是网页• 究竟什么是网页?• 网页使用来干什么?• 他有什么作用?

腾讯网站 学院主站

Page 9: 第一讲 网页设计基础

联想网站主页 163 免费邮件主页

淘宝主页 搜狐主页

Page 10: 第一讲 网页设计基础

• 总结:网页就是包含了文字文字、图片图片、动画动画、声声

音音等内容的可以在网上传输的界面。他可以用来共享信息共享信息、宣传自己宣传自己、服务用户服务用户等。

• 问题:– 为什么同样是网页给我们的视觉效果是不一样的?

– 为什么同样是网页给我们提供的信息也是不尽相同的?

Page 11: 第一讲 网页设计基础

• 问题:– 久久音乐网、一听音乐网等,同样是音乐,给我们的感

觉是否完全相同哪?

网页是丰富多彩的

Page 12: 第一讲 网页设计基础

2.2. 什么是网页设计什么是网页设计

一个成功的网页设计– 首先,在观念上要确立活跃的思维方式

– 其次,要有效地将图形引入网页设计之中,增加人们浏览网页的兴趣

在崇尚鲜明个性风格的今天,网页设计应增加个性化因素。

定义 特点

Page 13: 第一讲 网页设计基础

• 网页设计设计与网页制作制作的区别• UI(UUser IInterface, 用户界面 )

• UE 或者 UX (UUser ExExperience, 用户体验 )

网页设计要注意一下几个方面: 内容及框架结构 (Frame Sets)图象区块 (Image Maps) 与 flash特效等

网页设计要注意一下几个方面: 内容及框架结构 (Frame Sets)图象区块 (Image Maps) 与 flash特效等

Page 14: 第一讲 网页设计基础

3.3. 超级链接、网站和主页超级链接、网站和主页• 举例说明什么叫超级链接。

网站

• 定义• 作用

主页

• 定义• 作用• 命名规范

Page 15: 第一讲 网页设计基础

• 网页美化工具(图像):

photoshopphotoshop 和 fireWorkfireWork 等• 网页美化工具(动画):

flashflash 和 swishswish 等• 网页排版工具:

DreamWeaverDreamWeaver 和 FrontPageFrontPage 等

Page 16: 第一讲 网页设计基础

• 一个网站的制作流程类似与一个电视节目的制作过程,包括 :

策划 制作

宣传 更新

Page 17: 第一讲 网页设计基础

1.1. 网页设计基本步骤网页设计基本步骤 ( 1 )设计网页栏目及组织结构

( 2 )准备素材 ( 3 )界面设计 ( 4 )网页排版(页面实现) ( 6 )网页测试与发布 ( 7 )网页推广与维护

Page 18: 第一讲 网页设计基础

2. 制作网页时要注意的问题① 网页的标题要简洁,明确。② 对重点内容要强调显示。③ 网页中插入的图片要尽量的小。④ 图形要附加文字说明,以便关闭图像时查看。⑤ 网页中引用的资料及商标(或图标),不能

侵犯版权。

Page 19: 第一讲 网页设计基础

序号 观测点 分值

1 需求分析充分、栏目设置合理、功能完善 15

2 主题鲜明,能体现网站功能 15

3 页面布局(排版)美观大方,有个性 15

4 色彩搭配合理,能表现主题,特色鲜明 15

5 多媒体元素运用得当,适合网络传输,运行速度快。 10

6 操作方便、自然清新,适应不同人群 10

7 方便后期开发与维护 8

8 内容健康、正确、合法,链接准确 12

合计 100

Page 20: 第一讲 网页设计基础

• 通过对 web 相关概念的讲解,使学生了解web服务器及客户机、 URl 、常用协议、 IP 地址及域名等基础知识。

• 通过典型网站案例分析和讨论使同学们明白了网页、网站、主页的区别,了解了网页设计及超级链接的概念。

• 本节课还简单地介绍了网页设计常用工具、网站建设的基本步骤及应注意的问题等知识。

Page 21: 第一讲 网页设计基础

填空题:1. Internet 是在 __________经过不断发展变

化而形成的。2.WWW是 __________ 的缩写,也可以简称为

W eb ,中文名字为“万维网”。3.为了区别各个站点,必须为每个站点分配一

个唯一的地址,这个地址即称为 __________

4.c类地址的表示范围为 __________ ,默认网络掩码为 __________ 。

Page 22: 第一讲 网页设计基础

选择题:1 .下列不属于Macromedia公司产品的是

()A . Dreamweaver

B. Firewoks

C. Flash

D . Frontpage

Page 23: 第一讲 网页设计基础

问答题:1 . 常见的网页元素有哪些?2. 上网浏览一些著名网站(如搜狐、网易、新浪

、腾讯 (QQ) 等)的主页,并这些网页和我们学院的主页在结构和版面等方面有什么区别?

3.请浏览我院主页,至少说出两种网页中包含的主要网页元素。

4. 常见的网页制作工具有哪些?5.列举你所了解的美化网页工具。6. 总结建立网站的基本流程。