网页元素和布局教案.doc

网页元素和布局教案.doc

ID:58702547

大小:2.31 MB

页数:8页

时间:2020-10-03

网页元素和布局教案.doc_第1页
网页元素和布局教案.doc_第2页
网页元素和布局教案.doc_第3页
网页元素和布局教案.doc_第4页
网页元素和布局教案.doc_第5页
资源描述:

《网页元素和布局教案.doc》由会员上传分享,免费在线阅读,更多相关内容在教育资源-天天文库

1、长沙职业技术学院教案(课次)第9--12时授课题目:第二单元网页元素与布局教学目的、要求:掌握网页元素的构成掌握几个常见网页元素的制作方法;了解点、线、面概念;掌握网页基本元素的制作;掌握网页布局分类;掌握网页布局方法(表格布局、CSS布局)。教学重点、难点:掌握网页的配色方法;掌握网页布局方法。一、新课导入1,教师展示优秀网页并让学生分析其共同元素2,根据学生回答,引出网页的基本元素。二、网页元素1,网页元素的组成l图标与按钮网页图标就是用图案的方式来标志一个栏目,功能或者命令等,类似取名字的方式来表示某人一样,见名知人,而图标就是见图知意。l

2、LogoLOGO是指网站的标志。就如同商标一样,LOGO是你站点特色和内涵的集中体现,看见LOGO就让大家联想起你的站点。l页眉(页头)指的是页面顶端的部分,是设计的重点。页眉的风格一般和整体页面风格一致,富有个性特色的页眉有着和网站LOGO一样的标识作用。l主体内容主体内容是最重要的元素。主体内容并不完整,往往由下一级内容的标题、内容提要、内容摘编的超链接构成。l页脚网页的最底端部分被称为页脚,页脚部分通常被用来介绍网站所有者的具体信息和联络方式,如名称、地址、联系方式、版权信息等。l功能区功能区是网站主要功能的集中表现。一般位于网页的右上方或

3、右侧边栏。功能区包括:电子邮件、用户名注册、登陆网站等内容。l导航区如果说主体内容部分重要的话,导航区的重要性与其不相上下,甚至导航区的设计可以成为一种独立的设计,与网页布局设计分庭抗礼。之所以说导航区重要,是因为其所在位置左右着整个网页布局的设计。l广告区广告区是网站实现赢利或自我展示的区域。一般位于网页的页眉、右侧和底部。广告区内容以文字、图像、Flash动画为主。2,网页设计构成要素l点构成点是造型的基本要素,也是构成中最简洁的形态。点在线、面中相对来说是最小的单位,无数的点形成线、面。l线构成线,分为直线和曲线。直线:给人以速度,明确而锐

4、利的感觉,具有男性感。曲线,则优美轻快,富于旋律。l面构成点的密集、线的运动排列产生了面。与点、线相比,面具有更强的视觉效果和表现力。面可分为几何形和自由形两类。方形、圆形、三角形都是几何形,而多边形、不规则形是自由形。三、网页元素制作1,案例一(导航图标制作)本案例主要制作网页导航的图标,通过本案例的制作,了解一般导航图标的制作方法和技巧,导航图标所在的网页效果如下图所示。课堂作业一:根据教师的案例演示,独立完成案例一的制作(学生动手实践)注意:1,渐变叠加径向样式的中心点偏移2,拷贝、粘贴图层样式3,钢笔使用(巧用ctrl、alt键)图标最终

5、的制作效果如图四、网页布局网站设计不是把所有内容放到网页中就行了,还需要我们把网页内容进行合理的排版布局,以给浏览者赏心悦目的感觉,增强网站的吸引力。1,“国”字形结构“国”字形结构也可以称为“同”字形或三分栏,是一些大型网站所采用的布局类型。如图所示,网页网址:2,正文标题型结构正文标题型结构的页面布局,即最上面为标题或类似标题的一些内容,中间是正文,最下方是网站的一些版权信息等,如下图所示3,左右型结构整个页面在垂直方向分为两列,一般左面是导航链接,有时最上面会有一个小的标题或标志,右面是主要内容,网站的内容按栏目分布在这两列中,最大限度地突

6、出主页的索引功能,一般适用在栏目较多的网站里,如大型的论坛、部分企业网站等喜欢采用这种布局。左右型结构清晰、简单,如图所示,网页网址:。4,上下型型结构这种布局结构去掉了“国”字形布局的右边的边框部分,给主内容区释放了更多空间,内容虽看起来比较多,但布局整齐又不过于拥挤,适合一些下载类和贺卡类站点使用。如图所示,网页网址:。4,封面型结构封面型结构的页面基本上出现在一些网站的首页,通常为一些精美的平面设计结合一些精彩动画,一般有欢迎“进入”链接或几个简单的链接,有时甚至使用图片作超级链接。5,Flash型结构Flash型结构网站与封面型结构网站类

7、似,只是这种类型结构的网站首页采用目前流行的Flash技术来制作首页封面。如图所示,网址:。五、表格布局课后总结:

当前文档最多预览五页,下载文档查看全文

此文档下载收益归作者所有

当前文档最多预览五页,下载文档查看全文
温馨提示:
1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。
2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。
3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。
4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。