《电子商务网站设计与制作》教案1

巡山小妖精
769次浏览
2020年12月02日 01:16
最佳经验
本文由作者推荐

班级群名-初中生话题作文

2020年12月2日发(作者:朱彝)




本次课基本信息
授课时间
授课方式
(请打√)
月 日 第 1 周星期 第 节
理论课 实验课□ 理实一体

讨论课□
习题课□ 其它□
授课
顺序
课时
安排
1
2
授课题目(教学章节或项目模块主题):
1.1认识网页与网站 1.2网页设计知识

前次课

内容提要
本次课教学目的、要求(分掌握、熟悉、了解三个层次):
1.了解网页、网站的概念、网页与网站的关系
2.熟悉静态网页与动态网页的区别,主页与网页的区别
3.掌握网页设计元素有哪些
4.掌握网页的结构与色彩
教学重点及难点:

重点:网页设计元素
难点:网页的结构与色彩
作业和思考题:


分析一张网页的结构、布局



课后小结:







教 学 设 计 页
对本次课的教学目标、教学重难点、教学方法、教学步骤与时间分配等环节进行设计

教学环节


本课的内容、考试方式、要求
网页、网站的概念、网页与网站
的关系
静态网页与动态网页的区别

分析电子商务网站首页有哪些元

素组成

网页设计元素有哪些(重点)
网页的结构与布局(难点)
网页的色彩

分析一张网页的结构、布局














时间

15min
10min
15min
5min
20min
20min
5min
教师活动 学生活动
讲授
讲授、案

讲授
引导
讲授、案

讲授、案

讲授、案




讨论






教 学 内 容 页


1.1

一、网页
网页是一种可以在互联网上传输、能被浏览器识别和翻译成页面并显示出来
的文件,网页是网站 的基本构成元素。
认识网页与网站

二、网站

网站 是提供各种信息和服务的平台,如用户熟悉的新浪、搜狐、京东网、当当
网等都是典型网站。网站由许多 网页组成,也可以通俗地理解成网站是存储在某个
服务器上的,包含了网页、图片、数据库和多媒体信息 等资源的一个文件夹。
三、网页与网站的关系
一个完整的网站是由多个网页构成 的,这些网页是分别独立的,这些独立的网
页通过超链接联系起来。网页是网站的基本信息单位,一个网 站通常由众多的网页
有机地组织起来,用来为网站用户提供各种各样的信息和服务,好比一栋大楼里的< br>一个个房间。
四、静态网页与动态网页的区别
在网站设计中,使用纯HTML格式的 网页通常称为静态网页,它运行于客户端。
早期的网站一般都是由静态网页组成的,它们是以.htm、 .html等为扩展名。

采用了动态网页技术,在服务器端运行的网页和程序被称为动 态网页,它们会
根据编写的程序访问数据库,并动态地生成页面。





教 学 内 容 页

1.2网页设计知识
一、网页设计元素

二、网页的结构与布局(案例)
结构: 2.导航 3.内容主体 4.版权信息
布局原理:对称与均衡;重点与主次;变化与统一
页面的布局
1. 结构布局
常用的结构布局方式包括“国”字型、拐角型、上下框架和左右框架等类型。
国字型 “国”字型结构一般这样来布局:最上端是网站logo、banner和导航栏,中间是当前
网页 的主要内容(通常被分为大小不等的三列,而中间的一列用来放置主体内容),最
下面是网站版权声明等 。
通常用于主页的设计,其主要优点是页面容纳内容很多,信息量大。







教 学 内 容 页


图1-3 国字型布局
拐角型
拐角型结构与“国”字型结构最上端和最 下端结构布局是一样的。唯一区别体现在中
间样式,拐角型中间通常被分为大小不等的两列,其中较宽的 一列用来放置主体内
容。
优点是页面结构清晰,主次分明,是初学者最容易上手的布局方法。 缺点是规矩呆
板,如果不注意细节色彩,很容易让人”看之无味“

















教 学 内 容 页


图1-4 拐角型布局
上下框架型
上下框架型结构与左右框架性类似,区别仅仅在于是一种上下分为两页的框架。
优点是视觉冲击力强,缺点是很难将两部分有机地结合起来

图1-5 上下框架型布局
左右框架型
左右框架型结构,一般导航链接放左边,有时最上面会有一个小 的标题或标致,右
面是正文。多数大型论坛都是这种结构的,部分企业也喜欢采用。
优点是视觉冲击力强,缺点是很难将两部分有机地结合起来






教 学 内 容 页


图1-6 左右框架型布局
2. 艺术布局
常用的平面艺术设计原则有分割、对称和平衡等。
POP布局
POP引自广告术语,就是指页面布局像一张宣传海报,POP布局是一种颇具 艺术感
和时尚感的网页布局方式。页面设计通常以一张精美的海报画面为布局的主体。
优点显而易见:漂亮吸引人。缺点就是速度慢。作为版面布局,还是值得借鉴的。



图1-7 POP布局

交换机配置-雨花茶


留守儿童心理健康-重庆市二手房


吉林省旅游景点大全-gerenjianli


国内旅游好去处-南京动力高等专科学校


适应作文-戏命师天赋


感动的句子-我爱我的家歌曲


黄山学院是几本-茉莉花茶的功效


全国独立院校排名-湖南景点大全