网页浏览教案（13篇）
1.网页浏览教案 篇一
课程：
课时：
教学对象：教师：
公 开 课 教 案
课题：
时间：
地点：多媒体教室五
教学目标：
严格把握信息产业部关于“网页设计师”职业技能鉴定大纲，使学生能够最大程度满足企业对网页设计人员的需求，掌握网页设计软件的高级应用。
掌握CSS的基本语法与功能。
熟悉“CSS样式”面板与“相关CSS” 面板的使用。 学会创建、插入样式表。 学会套用CSS样式。教学对象分析：
由于讲授对象为高职院校大专生，所讲内容以实际操作为主，注重训练学生动手能力，所以本课程以案例教学的方式讲解。教学重点：
CSS样式的创建、编辑、导出及应用 教学难点：
应用类样式，设置CSS样式属性 教学方法和教具准备：
在带有大屏幕投影仪和计算机相连接的多媒体教室，采用教师讲解与学生实践相结合的授课方式。教学过程：
一、导入课题
复习上一章表单知识，简要回顾前面几章的学习：设置文本和网页属性、使用图像、插入表格等，但是仅仅利用以上所学知识做出来的网页比较枯燥，页面并不完美。在网络上形形色色的网站中，怎么才能让自己的页面独树一帜？
1、CSS样式功能：能够使你的页面保持统一的风格，它可以调整文字间距、行间距、删除链接下划线、固定背景图像、制作特殊的边框、改变鼠标指针形状等，并能够简化网站的制作过程。
2、拿css样式做出来的页面效果和没有使用css样式的页面做比较，演示css样式的特效
二、新课讲解
1、CSS概述
⑴ 什么是CSS？
CSS（Cascading Style sheets，层叠样式表）是一种制作网页的新技术，现在已经为大多数的浏览器所支持，成为网页设计必不可少的工具之一。CSS定义了控制元素外观的样式属性。
⑵ CSS由来
CSS样式由全球广域网协会制定，分别是CSS1、CSS2
2、实例讲解
实例
1、利用css样式“类型”选项改变文本属性
分析：Dreamweaver的文本控制功能不足，无论是字体大小，排列方式，还是行间距，等等，它所提供的选择并不多，为了让我们的网页更加美观，更加规范，有必要使用CSS。
步骤：
1.单击“CSS面板”右下角“新建CSS样式”按钮，弹出“新建CSS样式”对话框。设置完毕后点击“确定”按钮。2.在对话框 “类型”选项中，“字体”下拉列表框中选择“华文新魏”，“大小”选择“18”，“颜色”中选择“#003300”，加粗，单击“确定”按钮。3.在文档窗口中选择文字，从“样式”下拉列表框中选择该样式即可。
小结：本例中用到css样式列表中的“类型”属性。它可以帮助我们轻松地实现对文本格式的各种设置。
扩展：
1.引入外部样式表
2.利用“区块”选项组设置字母间距、縮进等属性
实例
2、作出单张图像的背景
分析：默认状态下在“页面属性”中选择图像，则在网页文档的整体背景上重复出现，在css中可以使背景图像在指定位置上只显示一次。
步骤： 1.单击按钮，选择“新建”
2.在“背景图像”中选择合适的背景图像，在“重复”列表中选择“不重复”，在“水平位置”中选择“右对齐”，在“垂直位置”中选择“居中”，在“附件”中选择“固定”，单击“确定”按钮。
3.选中
标签，在属性栏的“样式”中选择该样式。小结：本例中用到css样式列表中的“背景”属性。它可以帮助我们随意设置背景图像。
实例
3、利用css样式给表格设置特殊边框，用图像作列表、改变鼠标指针。
分析：利用css样式为表格设置不同颜色、样式的边框，用漂亮的图标作列表也可将鼠标指针改成动画。
步骤：如实例2，但使用不同的新建及应用方式。
扩展：为标签加双线边框、利用“定位”列表项将表格像“层”一样任意移动。
实例
4、特效文字
说明：在photoshop等图像制作软件中经常会听到滤镜的概念，滤镜能作出很多神奇的特效，然而在dreamweaver mx2004中我们可以利用样式表设定各种滤镜效果。
实例
5、图像特效
说明：利用“滤镜”项为图像设置不同样式。
思考题：改变网页超级链接样式
作业：
p204页，课后习题
上机练习：
1.对已经编辑的文档使用新的文本样式（包括超级链接时样式改变）2.将单张图像作背景并且不滚动、水平:右对齐，垂直:底部 3.改变鼠标指针样式 4.光晕字
5.对图像使用滤镜功能
三、教学后记
2.网页浏览教案 篇二
个性化服务是指针对不同用户提供不同服务策略和服务内容的服务模式, 为了提供高质量的个性化服务, 需要构建准确的用户兴趣模型, 这就需要了解用户对内容的感兴趣程度[1]。一种获得用户兴趣度的方法是让用户自己标注感兴趣的内容。但是用户自己标注的方法固然能够获得较为准确的用户模型, 但大多数用户并不愿意参与标注。另外一种获得用户兴趣度的方法是根据用户浏览网页行为来计算用户兴趣度。所以如何准确的估计用户的兴趣度是作为个性化服务研究的重要内容, 也是决定个性化服务质量的关键因素。
1 用户浏览行为分析
浏览行为大致可以分为以下几类[2,3,4]。
(1) 标记行为:增加书签、删除书签、保存页面、打印页面等。
(2) 操作行为:复制、粘贴、剪切、拉动滚动条、点击链接等。
(3) 重复行为:重复访问同一个页面等。
由于用户对网页的处理动作属于心理强烈的反应动作, 能更明显地反映用户兴趣, 用户如果对此页面非常感兴趣, 一般都会采取保存页面和收藏页面这些操作, 而打印页面操作并不一定会发生, 而拉动滚动条, 点击链接等操作行为在浏览网页的时候一般都使用的比较频繁, 并不能很准确的反映用户是否对网页感兴趣。此外, 由于用户浏览网页时, 浏览网页的时间取决于网页内容的大小, 所以不能单纯分析用户的浏览时间长短去获取用户感兴趣网页。综合考虑, 本文分析保存页面、收藏页面和网页浏览速度这三种最能体现用户兴趣的浏览行为, 基于这三种行为计算用户兴趣度。
用户兴趣度[5]是指用户对一个网页内容的感兴趣程度, 采用0-1间的实数示, 0表示无兴趣, 1表示最大兴趣。
当前, 计算用户兴趣度的方法主要分两类, 一是基于浏览内容的方式[6,7], 二是基于用户行为的方式。前者计算的对象完全来自于Web页面本身的内容, 一般采用关键词频率和权重计算[8]。通过这种方法, 可以得到对用户浏览内容的概括, 但它没有考虑用户浏览页面时能反馈心理的动作信息。所以本文分析浏览网页行为进行用户兴趣度计算。设定初始用户兴趣度为Interest×[0, 1]。对每个网页l采用三种浏览行为来计算用户兴趣度。这三种浏览行为表示为:保存页面save (li) 、收藏页面bookmark (li) 和在页面上的驻留时间time (li) , 由于考虑网页大小会对驻留网页的时间有影响[9], 故采用保存页面save (li) 、收藏页面bookmark (li) 和网页浏览速度speed (li) 来重新作为这新的三种浏览行为[10]。其中l表示页面, i表示网页数, li表示访问的第i个网页。本文在计算用户对页面的兴趣度时做了如下规定。
(1) 保存和收藏页面这两个行为比较特殊, 只要其中一个发生了, 就表明用户对这个页面的兴趣度很高, 此时浏览网页速度也不再作为计算因子。此时收藏和保存页面与用户兴趣度的关系为一个二值函数[11]。
此时, 用户兴趣度与式h (li) 存在如下关系:
(2) 当保存和收藏页面这两个行为均未发生时, 只计算浏览网页速度产生的兴趣度。
由于计算用户浏览网页速度speed (li) 取决于网页大小size (li) 和页面驻留时间time (li) , 然而当用户在页面的驻留时间太短少于5s, 则认为用户对此网页不感兴趣;当用户在页面的停留时间太长大于3min, 可能造成页面驻留时间异常。所以为避免这两种情况, 在5s<time (li) <3min时才考虑页面驻留时间[12]。而页面浏览速度speed (li) 是依据页面驻留时间time (li) 和网页大小size (li) 产生的兴趣度函数定义为:
由于浏览网页速度越快, 表明用户对此网页越不感兴趣, 为了避免值过度偏离1, 则用户兴趣度与浏览网页速度存在如下关系:
由以上理论, 可以得到每个网页的用户兴趣度计算公式如下:
2 用户兴趣的衰减
时间对用户兴趣有着深入而广泛的影响。用户兴趣是会随着时间而变化的。基于此, 一些国内学者就假设人对某一事物的兴趣如果在没有外界刺激去加强它的情况下会随时间而衰减, 如同艾宾浩斯提出的人在学习过程中存在遗忘规律一样, 他描述了人类大脑对新事物遗忘的规律。基于这个规律, 艾宾浩斯提出了这种记忆保存量与时间关系的函数[13] (即兴趣衰减因子) :
其中, K (x) 表示记忆保存量, T=cur-per (cur表示当前时间, per表示第一次浏览该网页的时间) 单位为分钟, c=1.25、k=1.84时公式 (6) 所代表的遗忘函数与人的遗忘规律比较匹配。那么, 如果要准确预测用户现在的兴趣, 就应该关注用户最近的行为, 但是, 考虑用户最近的兴趣只能针对渐变的用户兴趣, 而对突变的用户兴趣是很难起作用。根据以上的理论, 得到了随着时间的流逝用户兴趣变化的计算公式:
其中, Interest (li) 为用户原来对每个网页的兴趣度, Interest* (li) 为衰减后的兴趣度。
根据以上公式, 得出用户对每个网页的兴趣度公式如下:
其中, new Interest (li) 为用户浏览一个新的页面后对该页面对应的兴趣度的变化值, 也可当做用户对该文档的兴趣度。为了避免单一的方法所造成的局限性, 本文决定通过用户的浏览动作即收藏页面和保存页面、浏览速度两者来对它进行计算, 得到公式如下:
其中, ω1为收藏和保存页面对应的权重, ω2为浏览网页速度对应的权重。
最后利用K-means算法依据网页内容聚类成主题, 每个主题随机选取10篇用户感兴趣网页进行实验, 所以根据式 (7) 得到主题的的兴趣度函数:
其中, p表示主题, m表示主题数目, j表示第m个主题的总共网页数目。由于兴趣度的值的维持在0和1之间, 为了避免页面兴趣度值偏大, 所以的归一化处理, 得到归一化的主题兴趣度函数:
3 实验分析
本文选取浏览一周的新浪用户感兴趣网页作为处理数据, 利用K-means算法最终聚类成为5个主题并且包含其文本内容, 并随机选取每个主题10篇文章作为实验数据。然后采用dyna Trace AJAX Edition软件来得到用户的浏览行为和操作, 然后通过用户浏览行为采用前面介绍的方法获取用户对每个网页兴趣度, 从而得到每个主题兴趣度。一周后再通过对浏览这些网页的用户群进行统计调查, 让用户自己评价对每个主题的兴趣度, 将用户主观的评价结果与根据计算得到的网页兴趣度进行比较。
实验步骤: (1) 采用dyna Trace AJAX Edition软件获取用户浏览行为, 该软件是一个前端性能测试工具, 能够捕捉用户在某一站点下的浏览行为, 包括浏览的页面地址、鼠标的点击事件以及页面的驻留时间等。在本文中, 获取的是用户访问的网页链接、浏览时间、网页大小、保存和收藏页面操作。用户浏览行为的获取数据如图1所示。经整理后的用户浏览行为如图2所示。 (2) 利用Java程序计算用户兴趣度, 随机选取其中部分网页兴趣度经整理如表1所示。
图2包括本文前面提到所需的的浏览行为, 即用户浏览网页的字节数, 用户浏览网页的停留时间, 经计算得到的用户浏览网页的速度和用户浏览网页时保存和收藏页面的操作动作。
从表1可以看出, 根据前面提到的兴趣度计算方法计算得到的用户兴趣度与用户自评的兴趣度值用绝对误差值来验证其合理和有效性, 绝对误差值控制在11%以内, 由此可以验证本文的用户兴趣度的计算方法是合理和有效的。
4 结束语
本文主要对用户的浏览行为进行了分析, 并在此基础上, 提出了一种基于网页浏览行为的用户兴趣度计算方法, 并结合了兴趣会随时间衰减的规律更新这个计算方法, 然后通过K-means算法将所浏览的网页内容聚类成主题, 然后获取主题兴趣度为后续的用户兴趣模型的构建提供了更好的基础。通过实验验证了这种计算方法的有效性。然而计算用户兴趣度只是建立用户兴趣模型的第一步, 如何使用合适的数据结构来存储用户兴趣, 并建立和更新兴趣模型将是下一步的研究内容。
摘要：用户兴趣度的计算是个性化服务的核心, 而用户浏览网页时的行为能反映用户的兴趣。文中着重分析保存页面、收藏页面以及网页浏览速度这三种网页浏览行为, 且在此基础上结合用户兴趣衰减因子, 提出一种新的基于网页浏览行为的用户兴趣的计算方法, 并利用K-means算法将浏览的网页内容聚类成不同主题, 最后基于这三种网页浏览行为和用户兴趣衰减因子计算用户主题兴趣度。实验结果表明, 提出的用户兴趣度计算方法是有效的。
3.网页教案设计5 篇三
框
架
教学目标：
1．了解使用框架的优缺点；
2．掌握框架网页在创建、选择、设置、存储方面的特点； 3．掌握框架和框架集的创建； 4．掌握框架结构网页的制作； 5．掌握嵌入式框架的使用； 教学重点：
1．框架结构网页的制作； 2．框架与框架集的创建； 教学难点：
嵌入式框架 教学时间
4课时（2节理论课，2节实验课）教学过程
§5.1 创建框架网页
一、框架和框架集
1．框架的概念
框架是浏览器窗口中的一个区域，用于显示独立的HTML文档。两个或两个以上的框架组合成一个见面。框架经常用于导航，一个框架显示包含导航栏目的文档，另一个框架显示含有内容的文档。
2．框架集的概念
在网页上定义的一个区域就是单个框架，而框架集则记录了同一个网页中多个框架的布局、超链接和属性信息。利用框架可以把浏览器窗口划分为若干个区域，每个区域可以添加任意网页元素，也可分别显示不同的网页。
注意：
框架集也是HTML文件，但它本身并不包含要显示的HTML内容，它只是向浏览器提供应如何显示一组框架及在这些框架中应显示哪些文档。
3．框架与框架集的关系
框架集与框架之间的关系其实就是包含与被包含的关系，框架集相当于一个容器，框架则是放在容器中的东西，框架集记录了框架的位置，以及框架中包含的网页的链接地址。
二、创建框架
Dreamweaver中给出了框架的预定格式，一般采用预定格式即可创建框架页。
七、设置框架集属性
选取框架集后，其【属性】面板如下图所示。
（1）边框：是否在浏览器中显示边框。（2）边框宽度：设置边框的宽度。（3）边框颜色：设置边框颜色。
（4）列：用于设置框架的列宽，默认单位为像素。
§5.2嵌入式框架
一、嵌入式框架
通过在HTML代码窗口中插入 各项含义如下：
border=0表示边框为0；
marginwidth=0 marginheight=0 表示嵌入式框架的宽和高的边距均为0； src=”images/main.html”表示框架中调用的网页文件是main.html； frameborder=no 表示框架没有边框；
width=580 height=400表示框架的宽度为580像素，高度为400像素。本章小结
本章介绍了另外一个布局网页的方式-----框架，讲述了它的创建，编辑及属性设置，框架与框架集的关系。同时讲解了嵌入式框架的应用及代码的含义。本章作业
4.网页制作教案8. 篇四
课前准备: 第三章第三节素材和实例,视频教程:快速建站技术-模板的应用.WMV ,快速建站技 术-模板的应用(快速更新.WMV。
教学过程设计:(一 导入设计: 我们制作一个网站时,会发现许多网页的版面和元素都是相同的,在设计一个新页面 时, 我们还可以用复制原来做过页面来减轻工作量。但是如果一个网站有几
十、上百张页面 都基本相同, 这时修改或更新网页的共同元素如网站标志时, 会发现工作量实在太大!而使 用 Dreamweaver 8.0软件中的模板功能来创建新网页, 可以大大提高更新和修改的工作效率, 网站的维护工作会轻松很多。本节主要内容如下。
(二新课讲解设计:(1请学生带着以下问题阅读 P110~115知识预读,问题如下: A、模板的定义? B、模板创建的三种方式?了解资源面板的使用方式。C、学会模板的可编辑区域的定义、建立和取消;D、学会模板的应用和取消;E、学会如何将模板从网页中分离出来;(2教师提问,请学生一一回答以上问题。期间对回答问题的同学要多多表扬,如“你真 棒”。增强学生对教师的亲和力。
(3教师在学生回答问题的同时,总结评价并补充相关要点。
(4教师展示完成后的模板网站作品,与学生共同讨论分析该网站制作过程。(5教师演示建立模板 , 创建可编辑区域 , 应用模板等部分操作(详见教材任务一。
(6请一位学生上台操作,其他学生完成相同操作。可以参考视频快速建站技术-模板的 应用.wmv。教师巡视指导。
(7教师总结评价学生完成情况。
(8课堂比一比:将学生分组,根据已学知识,美化已完成的网站 , 学习使用模板快速更新 网站的技术。可以参考视频快速建站技术-模板的应用(快速更新.wmv。将作品提交后由学 生评比。(增强学生学习积极性。
(9教师评价各组提交的作品。
(9学生完成任务一对照练习第1、2两题。个别点名回答,检验教学成果。(三小结和作业: 小结:(1 什么是模板?(2 如何创建模板(三种方式
(3 模板的可编辑区域的定义、建立和取消(4 如何应用和取消模板(5 如何将模板从网页中分离出来 作业:(1 填写《任务评价表》并上交
5.框架网页制作教案分析 篇五
教学目标：
1．知识与技能：
（1）理解框架的概念及基本用途。
（2）掌握框架网页的新建、制作、编辑与保存，了解框架的拆分方法。
（3）初步掌握将框架结构与表格布局结合使用来制作网页。
2．过程与方法：
（1）通过对表格网页的分析，体验新知识（框架结构网页）的优点，从而促进更好的学习新知识。
（2）通过理解框架的概念与组成，学会分析框架网站的结构。（3）通过动手操作来深入了解框架的使用方法及用途，提高在网页制作方面的知识水平，培养自主学习的能力。3．情感态度与价值观：
（1）通过以“人与动物”为主题的框架结构网页的制作活动，开拓知识面，激发学习兴趣与热情，体会框架网页在展现主题内容中的作用。（2）能够将表格与框架结构网页结合使用，在创作中体验乐趣。
（3）形成积极主动的学习和使用多媒体技术的习惯，通过参与信息活动，参与社会实践，树立团队意识，形成积极合作的态度。
教学要点：
1．重点：
（1）框架的概念、用途。（2）创建、编辑与保存框架网页的方法，框架的嵌套使用。2．难点：（1）框架的拆分。（2）制作框架网页。
教学对象分析：
本节内容是针对高一学生，而初上高中的他们对一切新知识都很好奇，同时存在着一定的懵懂，因此在教授他们本节课知识之前，要事先充分激发他们对本节课内容的兴趣，因此课前老师先展示一组利用表格制作的框架网页，要求学生仔细观察，找出它们的一个共同特点，并提问如何快捷地制作这种网页？从而引出本节课内容，并且在讲授内容的过程中，要耐心的进行演示教学，不能一味的口述使学生感到一片茫然。
教材分析：
6.网页浏览器内核的比较研究 篇六
网页浏览器的主要工作是发送用户请求, 接收服务器端响应, 将返回的HTML页面展现给用户。随着Web 2.0的推进, 以及作为核心支撑技术的Ajax的普及, 对JavaScript的处理也成为决定WEB页面特效及用户操作体验的重要因素, 这主要取决于浏览器内核中JavaScript引擎的表现。另外, 随着用户的浏览内容的多样化, 页面的渲染速度成为了评价浏览器好坏的重要因素, 这是由浏览器内核中的排版引擎决定的。本文通过对主流浏览器的JavaScript引擎及排版引擎的比较研究, 得出不同JavaScript引擎和排版引擎的特点, 并使用测试工具对引擎的性能进行了评测。
1 JavaScript引擎
JavaScript引擎的功能是解释JavaScript源代码并执行。目前流行的JavaScript引擎如表1所示。
1.1 SpiderMonkey和TraceMonkey
(1) SpiderMonkey。SpiderMonkey是历史上第一个JavaScript引擎, 以C语言实现, 由Netscape通信公司的BrendanEich编写, 目前作为开源项目由Mozilla基金会维护。
SpiderMonkey包括编译器/反编译器、解释器、垃圾收集器, 以及标准类 (standard
class) 几个部分。首先由jsparse.c中的parser将源代码解析为语法树, 然后调用jsemit.c中的js EmitTree函数生成字节码, 最后由jsinterp.c中的js Interpret函数将字节码解释执行。
*注:SSubench是WebKit用于测试SquirrelFish的测试工具, image项使用的是Mozilla发布的用于测试图像处理能力的demo, matrix项使用的是Sylvester的矩阵运算库。
SpiderMonkey采用generational、mark-and-sweep的垃圾收集器, 对新产生的对象优先收集。该收集器仅在垃圾收集对象所占空间达到上限且有新的存储空间分配请求时才收集。
(2) TraceMonkey。TraceMonkey引擎是SpiderMonkey的升级版本, 增加了JIT编译器。该JIT编译器在Tamarin引擎 (ActionScript引擎, 用于AdobeFlash) 的nanojit编译器基础上开发, 提高了处理JavaScript的效率, 使其更接近直接编译的效率。与常见的JIT编译器不同, 它并不编译整个方法, 而是追踪[1] (tracing) 内部频繁执行的操作 (主要是循环操作) , 然后对必要部分 (如循环体内的操作) 进行编译, 追踪过程所需的信息由追踪树提供。目前该JIT所生成的机器码只支持x86和arm系列CPU。
在多项测试中, 使用了追踪JIT的TraceMonkey性能相比SpiderMonkey有相当的提升, 如图1所示。
1.2 JavaScriptCore、SquirrelFish和SquirrelFishExtreme
(1) JavaScriptCore。JavaScriptCore由KJS (KDE'sJavaScriptengine) 及PCRE正则表达式库发展而来, 在WebKit3.1版本中使用它采用基于语法树的解释器, 以及generational的垃圾收集器。
JavaScriptCore的解释器工作时需要对语法树进行遍历, 该过程需要频繁访问语法树上并不产生作用的结点, 如语句块两端的”{”、”}”等, 而且遍历过程中需要频繁传递数据, 另外, 对树上的结点每次访问都需要一次虚函数调用和返回, 这些操作相当费时。
(2) SquirrelFish。SquirrelFish引擎是JavaScriptCore引擎的升级版本, 在WebKit3.1以上版本中使用。为了消除JavaScript语法树遍历的缺点, 它使用字节码解释器 (bytecodeinterpreter) 代替了原来的基于语法树的解释器, 即将源代码转换为字节码, 再对字节码解释执行。它还使用了直接链接代码 (directthreadedcode) 技术来优化解释器的性能, 即在解释执行字节码之前把字节码数组转换为直接包含字节码对应解释程序入口地址的数组[2], 提高了解释执行的效率。
图2是WebKit官方公布的性能数据, 可以看出, 使用SquirrelFish引擎的WEBKIT相比使用JavaScriptCore引擎的WEBKIT3.1速度提高了约60%。
另外, 与其他浏览器的JavaScript引擎相比, 其速度优势明显。经测试, SquirrelFish的速度是SpiderMonkey (用于Firefox3.0RC 1中) 速度的1.46倍, 是带追踪的Tamarin的1.9倍, 是vanilla版Tamarin (用于FLASH 9中) 的1.8倍。
(3) SquirrelFishExtreme。SquirrelFishExtreme引擎于2008年9月发布, 是对SquirrelFish的改进版本。其改进之处有以下四点: (1) 对字节码的优化。包括字节码指令集的改进, 如添加组合指令、窥孔优化 (peepholeoptimizations) 、更快的操作常量和专门用于执行常用操作的机器码。 (2) 多态内联缓存 (PolymorphicInlineCache) 。对象的属性访问是JavaScript处理性能的瓶颈, 对于具有相同属性、且属性顺序相同的对象, 用一个结构ID来标识其对象, 使得结构相似的对象对属性进行访问时, 很可能执行的是同一段代码, 从而使效率得到提高。 (3) 上下文链接的实时编译器 (ContextThreadedJIT) 。将部分字节码转换为机器码———将复杂的操作码转换为函数调用, 将简单的操作码、或常用的复杂操作码直接内联为机器码流, 使硬件的分支转移能力得以发挥[3]。 (4) 正则表达式实时编译器。将实时编译技术应用到正则表达式的处理过程中, 使其处理速度提高了5倍, 并提供了原来仅在Perl、Python或Ruby中支持的文本处理功能。
图3是WebKit官方公布的性能数据, 可以看出, 使用SquirrelFishExtreme的WEBKIT引擎相比使用SquirrelFish的WEBKIT速度提高了约110%。
1.3 V 8引擎
V 8引擎是Google为其Chrome浏览器专门开发的JavaS-cript引擎, 使用C++语言实现, 支持ECMA-262第三版的标准, 可运行于WindowsXP、Vista、MacOSX 10.5, Linux等系统上。
V 8引擎的独特之处是其动态机器码生成系统, 它直接将JavaScript源代码编译为机器码以提高效率, 该过程不生成字节码。另外, V 8使用动态创建隐含类 (hiddenclass) 的方法实现属性的快速访问, 该方法的思想与Self语言使用map结构的原理类似[4], 即当某类的对象第一次被创建时, 将建立一个隐含类, 当对象被添加了新的属性后, 将生成新的隐含类。这种处理方法对动态语言主要有两个好处:一是属性的访问不需要额外的查找 (dictionarylookup) , 二是V 8能够使用经典的基于类的优化——内联缓存 (inlinecaching) 。
V 8采用stop-the-world、generational的垃圾收集器, 而且, 它始终了解内存中对象和指针的位置 (accurate) , 避免将对象误认为是指针而导致的内存泄露问题。
1.4 WindowsScriptingHost
在IE中, 对JavaScript的处理是通过WSH (WindowsScriptingHost) 来完成的。WSH是Windows中自带的脚本运行环境, 以COM[5]技术为基础, 支持VBScript, JScript两种语言。
WSH包含了ScriptEngine和ScriptingHost两部分, 其中ScriptEngine为脚本的解释器, 负责对JavaS-cript的解释和执行。当所执行的动作需要ScriptingHost所提供的服务如读写文件时, 需向ScriptingHost提出要求, 由它进行处理。
WSH使用non-generational的垃圾收集器, 结构较为简单, 性能相比其他引擎的generational的垃圾收集器略差。
2 排版引擎
排版引擎又叫渲染引擎 (renderingengine) , 在浏览器软件中负责展现内容 (如HTML, XML、图片、applets等) 和整理信息 (如CSS、HT-ML标签等) , 并将内容格式化输出。除了网页浏览器之外, 电子邮件客户端以及其他需要编辑、显示网络内容的应用程序都需要排版引擎。
目前流行的排版引擎如表2所示。
2.1 Trident
Trident又名MSHTML, 第一版随IE 4.0的发布而推出, 是目前使用最为广泛的排版引擎。在Trident中, 微软首次提出了著名的COM (组件对象模型) 技术, 以增强Windows中软件组件的通信和协作。
除IE之外, 使用Trident引擎的浏览器有:AvantBrowser、Maxthon、GreenBrowser等。另外, GoogleTalk, AOLInstantMessenger 6.x以及微软的系列软件MSN Messenger, Outlook, WindowsMediaPlayer等均使用了Trident引擎进行内容的渲染。IE 8beta版中将包含最新的TridentVI, 而目前已发布的IE 7正式版中使用的是TridentV, 它所支持的特性有:HTML 4.01、HTML 5子集、CSSLevel 1 (不完全支持CSS 2和3) 、JScript5.6 (JavaScript 1.4) 、DOM Level 1 (不完全支持Level 2) 。
2.2 Gecko
Gecko是一套开源的网页排版引擎, 被Firefox浏览器以及Netscape 6以上版本使用, 流行程度仅次于Trident。其组成包括:文档解析器 (解析HTML和XML) , 样式系统 (处理CSS等) , 图形库, 平台相关的图形、渲染组件 (支持Win32, X, Mac) 等。
除了Firefox之外, 使用Gecko排版引擎的浏览器有:Camino、Flock、SeaMonkey、K-Meleon、Epiphany等等。最新的Gecko1.9使用了Cairo 2D图形库以取代原有的GFX图形库, 它能够使用显卡的GPU来渲染WEB页面的2D图像, 提高了渲染速度, 并大幅减轻了CPU的负担[5]。它支持的特性有:HTML 4.0、CSS Level 1 (不完全支持CSS 2和3) , JavaScript1.8、DOM 1、2 (不完全支持DOM 3) 、XML 1.0、XHTML 1.1、XS-LT和XPath, MathML、XForms (需要官方扩展插件) 、RDF。
2.3 KHTML
KHTML由KDE开发, 以LGPL方式授权, 在2002年被苹果采纳, 用来开发Safari浏览器, 并将包装后的KHTML命名为WEBCORE, 作为WEBKIT浏览器框架的排版引擎。KHTML拥有速度快捷的优点, 但语法容错度比Gecko引擎小。
除了Safari之外, 使用KHTML的浏览器还有:Konqueror、GoogleChrome、NokiaSeries60的浏览器等。最新的KHTML支持的特性包括:HTML 4.01、CSS 1和CSS 2.1, CSS 3选择符 (selector) 及部分其他功能、EC-MA-262 (JavaScript 1.5) 、PNG、JPEG、GIF图形格式、DOM 1、DOM 2及部分的DOM 3、SVG。
3 性能测试
3.1 JavaScript引擎测试
3.1.1 测试工具
(1) SunSpider。使用最为广泛的JavaScript引擎测试工具, 由WebKit团队于2007年12月发布, 用于测试不同浏览器、浏览器不同版本的JavaScript性能。测试集与实际的JavaScript应用较为接近, 包括浮点数运算、数组访问、位运算、控制流、加密、日期类、数学运算、正则表达式、字符串处理等9项测试, 测试结果以通过所有9项测试的总时间表示。测试中不包含DOM操作测试。
(2) ChromeBenchmark。由Chorme团队开发, 包含五个测试环节。该测试对递归性能较为看重, 不包含DOM操作测试。
(3) DromaeoV 2。由jQuery作者和Mozilla的JavaScript权威JohnResig开发, 测试从内置函数到主流函数库等等实际浏览时会遇到的运算问题, 包括大量有关DOM操作的测试。
本文选用SunSpider作为测试工具, 以获得贴近实际应用的测试结果。
3.1.2 测试结果
对Firefox、Safari、Chrome浏览器分别进行测试, 机器配置为Core 2DuoCPU, 2GB RAM, 测试环境为WindowsVista 32-bit, 禁用所有的浏览器插件。
从图4可以看出, 使用V 8引擎的Chrome以微弱的优势胜过使用SquirrelFishExtreme的Safari 4.0排名第一, 带有追踪功能的Firefox3.1beta 1也表现优异, 排名第三。由于IE的测试时间过长 (总耗时27124毫秒, 仅string单项测试即耗时18296.8毫秒) , 未在上图予以标示。
3.2 排版引擎测试
3.2.1 测试工具
ACID:ACID是由网页标准计划小组 (Web StandardsProject, WaSP) 设计的一份网页浏览器与网页各种标准兼容性的测试网页, 主要针对DOM和JavaScript问题, 通过可以度量的标准进行测试。最新版本Acid 3包括100个测试子集, 分为6组 (bucket) , 测试结果以图形表示:6个矩形分别代表6组的测试成绩, 矩形的颜色表示每组内通过的测试子集的个数。
本文选用最新的Acid3作为测试工具。
3.2.2 测试结果
对以Trident, Gecko, KHTML为核心的浏览器分别进行测试, 机器配置为Core 2DuoCPU, 2GBRAM, 测试环境为WindowsVista 32-bit, 禁用所有的浏览器插件。
从图5可以看出, 基于Trident的IE对新的标准如CSS2的支持较差, 即使是使用最新发布的IE8, 其ACID得分也仅有21分。基于Gecko 1.9.1的FireFox3.1Beta2, 其得分较基于Gecko 1.9的FireFox3.0.4有较大提升, 排名第二。而配备了WEBCORE (KHT-ML) 核心的Safari, 其最新版本4.0Beta甚至已经完全通过了Acid3的测试, 得分达到了100分, 同样以WEBCORE为核心的Chrome对比标准的支持也较好, 得分仅次于Firefox3.1b2和Safari 4.0Beta。
4 结束语
本文介绍了当前主流浏览器的JavaScript引擎和排版引擎的实现原理及技术特点, 并使用评测工具对各浏览器JavaScript引擎和排版引擎的进行了评测, 比较了各JavaScript引擎的性能差异及排版引擎对网络标准的支持程度。在桌面应用WEB化及企业的网络应用日益增多的趋势下, 浏览器作为客户端的入口程序, 其重要性不言而喻, 比较研究各浏览器的内核技术, 分析浏览器内核的性能, 对开发和部署基于WEB的应用程序, 有一定的参考意义, 对于浏览器及插件的开发人员, 亦有重要的实用价值。
参考文献
[1]Andreas Gal, Michael Franz.Incremental Dynamic Code Generation with Trace Trees Technical Report No.06-16, Donald Bren School of Information and Computer Science, University of California, Irvine, 2006.
[2]马嘉, 周明天, 陈虹.一种基于ARM7的嵌入式Java虚拟机性能优化技术研究.计算机应用研究, 2007, 24:97～100
[3]Marc Berndl, Benjamin Vitale, Mathew Zaleski, Angela Demke Brown.Context Threading:A flexible and efficient dispatch tech-nique for virtual machine interpreters.Code Generation and Optimization, 2005.CGO2005.International Symposium on, 2005:15～26
[4]Craig Chambers, David Ungar, Elgin Lee.An Efficient Implementation of Self, a Dynamically-Typed Object-Oriented Language Based on Prototypes.OOPSLA'89Conference Proceedings, 1989:49～70
[5]梁忠杰, 思敏, 李婷.COM技术和动态链接库技术的应用研究.微计算机应用, 2006, 6
7.《动画及网页制作》课程教案 篇七
课程名称：动画及网页制作 任课班级：美术学院2005级动画班
任课时间：2007年5月28日 至 2007年6月28日 周数：5周 教学目的及要求：
《动画及网页制作》是多媒体专业学生重要的必修基础课。通过对本课程的学习，学生能够使用Flash，制作网页动画，课件。了解网络动画的制作过程，游戏的制作过程，制作出有趣的游戏和精彩的动画片。
教学方法：
以教师的实例演示与学生的上机练习相结合的方法为主，同时组织学生观看优秀的flash动画和网页，辅导学生独立完成一个完整的flash动画或网页制作。
教学重点及难点：
教学重点：掌握并理解flash的操作界面，熟练使用flash中几种实现动画的基本方式来制作flash动画，学会并理解flash中的各种链接方式和AS语言来，学会编写动画应用脚本，利用flash及相关辅助软件制作网页动画。
教学难点：flash中的各种链接方式和flash的AS语言，独立编写动画应用脚本，网页的制作和链接。
教学内容：
第（1）章 认识FLASH 多媒体简介及其多种相关软件，初步把握用FLASH进行设计的一般方法和思路；了解FLASH动画的基本特点，以及Flash5.0的基本工作环境。
第（2）章 窗口介绍
本章简单介绍FLASH的基本界面组成，包括标题栏、菜单栏、工具栏、工具箱、舞台、层选择、和时间轴。
1、舞台(Stage)就是工作区，最主要的可编辑区域。在这里可以直接绘图，或者导入外部图形文件进行安排编辑，再把各个独立的帧合成在一起，以生成电影作品。
2、时间轴窗口(Timeline)用它可以调整电影的播放速度，并把不同的图形作品放在不同图层的相应帧里，以安排电影内容播放的顺序。
3、绘图工具栏(Drawing Toolbar)放置了可供图形和文本编辑的各种工具，用这些工具可以绘图，选取，喷涂，修改以及编排文字，还有些工具可以改变查看工作区的方式。在选择了某一工具时，其所对应的修改器(Modifier)也会在工具条下面的位置出现，修改器的作用是改变相应工具对图形处理的效果。
4、标准工具栏(Standard Toolbar)列出了大部分最常用的文件操作，打印，剪贴板，撤消和重做，修改器以及控制舞台放大比例的图标和选项，便于进行更为快捷的操作。
5、控制器面板(Controller)控制电影的播放操作的工具集合，一般不大常用，处于隐藏状态。
第（3）章 工具箱
了解工具箱的作用，掌握铅笔工具、钢笔工具、墨水瓶工具、橡皮工具、两种箭头工具、笔刷工具、吸管工具的用法。图形和文字是Flash动画的基础，所以掌握绘图工具的使用对于制作好的Flash作品是至关重要的。由于Flash的绘图工具种类比较多，其相应的修改器也各不相同。和画线条一样，按住SHIFT键时，用椭圆工具可以画出正圆，用矩形工具可以画出正方形来。掌握椭圆和矩形工具的使用方法，可以用不同颜色的边框，填充色，不同线宽线型作出各种各样的圆和矩形来。
第（4）章 时间轴
时间轴是FLASH中最重要的概念，时间轴(Timeline)是Flash中最重要的工具之一。他决定了动画的组织形式。所有的设计都是围绕着时间轴展开的。熟悉和充分利用好这四种模式，会给开发和调试工作带来许多便利。熟练掌握层的分类以及各种操作。会制作遮罩动画、按轨迹移动动画，简单的MOTION动画，逐帧动画。了解洋葱皮的作用，在制作动画的过程中，会使用洋葱皮。用它可以查看每一帧的情况，调整动画播放的速度，安排帧的内容，改变帧与帧之间的关系，从而实现不同效果的动画。
第（5）章 几种重要窗口设置
Flash中动画设置的过程，主要就是各种属性设置的过程。本章重点介绍了几个最常见窗口的意义，掌握帧、库窗口、动画、场景、符号、实例等属性的设置。符号的分类以及各种符号的制作与用法，性质。我们学习了有关图符和图库的一些基本知识，而创建图符的目的是要在动画制作的过程中运用它生成相同或不同的实例，创建图符的方法有两种：可以从工作区中选取对象转换成图符，或者先创建一个空的图符，然后在图符编模式下添加内容。实例创建好后，可以通过属性菜单对实例进行裁剪，粘贴，缩放，旋转。
第（6）章 ACTION初步
ActionScript是Flash的脚本语言,使用ActionScript可以给Flash动画添加交互性。可以说掌握了该语言，你的Flash技术将上一个台阶,多加运用后，当可成为Flash高手。Flash 5的ActionScript为创建包含复杂游戏、表单、调查表和实时交互性的网站提供了许多新的特性。可以对自己制作的动画进行设置，让用户事件（如按钮单击和按钮）触发脚本，告诉动画执行什么动作。
第（7）章 发布与输出
FLASH的动画的主要优势是在广域网上发行，本章主要介绍了这种发布技术。掌握优化动画的一些小技巧，测试动画下载技能，会根据需要将FLASH源文件发布成网页文件，各种图像文件，以及可执行文件。
第（8）章 基本技巧实例
本章详细介绍了几个有代表性的FLASH动画设计的例子，基本上涉及了所有基本技能和技巧。制作片头的LOADING效果，可结合ACTION中的ifframeloaded（）命令使用，鼠标属性和对象属性的同步变化，可结合ACTION中的startdrag()命令和stopdrag()命令，Setproperty()命令使用,文本滚动窗口可结合ACTION中的loadvariablesnum()和telltarget()命令使用。详细介绍文本框的用法。随鼠标飘落的雪花，了解隐形按钮的用法。
第（9）章 ACTION高级应用实例
本章主要介绍应用一些程序设计技巧，利用RADIO,CHECKBOX,COMBOBOX成MOVECLICP,并且具有通用性。
FLASH
8.HTML语言与网页制作教案 篇八
城步职业中学：刘红兰
教学内容：HTML语言与网页制作
教学目的：
1、掌握输入和运行HTML文件的方法
2、掌握HTML基本的结构标记
3、掌握html在网页特效中的简单运用
教学重点：HTML基本的结构标记 教学难点：html在网页特效中的简单运用 教学方法：演示法 教学地点：多媒体 教学课时：1课时 教学过程:
一、什么是HTML语言
网页是由一种称为HTML的语言来描述的，网站中的大多数网页都以HTML文件的形式保存，HTML（HyperTextMark-upLanguage）即超文本标记语言，是WWW的描述语言。下面，让我们来看一看下面这个例子吧！
9.浏览 篇九
3月10日, 工业和信息化部部长李毅中在主题为“扩内需、促就业、保增长”的十一届全国人大二次会议记者会上表示, 电信资费的改革, 将会把消费者的合法权益和利益放在首位, 新推出的电信资费方案必须实行单行收费, 现有的双向收费会暂时并存, 但最终将全部过渡到双向收费。李毅中在回答记者关于电信资费下调, 手机和固话的长途费、漫游费能否取消的提问时表示, 电信资费事实上已在逐年下降。前年资费和上年相比降低了13%, 去年降低了11%。随着电信业的发展和有序竞争格局的形成还有降低的余地。至于漫游费和长途话费问题, 李毅中称, 漫游费的上限将会进一步下调, 中国移动去年与上年相比降低了42%, 中国联通与上年相比降低了35%。
联想等14家企业中标电脑下乡
全国推广家电下乡产品电脑项目招标结果3月5日公布, 本次投标的21家厂商中, 联想、TCL、戴尔、方正等14家厂商中标, 华硕明基等7家厂商无缘电脑下乡。据统计, 共有183款电脑入选, 其中台式机产品有104款, 笔记本产品60款。中国电子进出口总公司公告显示, 14家
中标的厂商分别是, 惠普、戴尔、联想、TCL、方正、海尔、宏碁、浪潮、万利达、神舟、清华同方、长城、西计三山天骄、满疆。同时, 华硕、明基、七喜、卓尔 (长春) 、雄风 (广东) 、合智思创 (重庆) 、沐泽7家厂商落选。有报告预计, 实施“电脑下乡”后, 未来3年内, 农村市场有望实现每年新增2700万至3600万台的电脑需求, 加之相关的PC外设、软件等市场, 以3年为执行期的“电脑下乡”政策有望整体将拉动100亿元规模的IT销售。
3月15日, 央视“3·15”晚会曝光山东部分移动公司利用短信群发器和基站向用户发送垃圾短信牟利, 并向合作伙伴出售山东及全国手机用户信息。央视调查发现, 垃圾短信的发送已经从最初的个人、小公司, 逐步向大公司发展。山东的一些移动公司在暗地里规模化经营, 启用基站大面积定向发送垃圾短信。由于短信发送速度快、目标精准, 又可利用技术手段规避风险, 使得山东部分移动公司广告短信业务量明显增加, 客户发短信还得走关系提前预约。除各种商业广告短信外, 山东有的移动公司还发送违规违法的信息, 包括代开增值税发票、办理抵押贷款、提供无担保借贷等。这些移动公司还为此下发短信发送任务, 一般客户经理每月得有几十万或几百万元的收入指标。
保监会介入携程假保单事件
3月17日, 中国保监会保险中介监管部召开新闻发布会, 介绍了携程卖出假保单事件的经过, 并表示将在全国彻查假保单。保监会有关部门负责人表示, 将对从事制售假保单等严重违法行为的机构及人员从重、从快处罚, 坚决将这部分机构和个人清除出市场。在此前的2008年11月, 在三亚度蜜月的梁先生通过携程旅行网订了两张从三亚回昆明的返程机票, 并购买了两张总计40元的交通工具意外伤害保险。事后梁先生通过保险公司的客服电话查询时, 才得知这两张保险单均为假保单。在多次交涉无果后, 梁先生向携程提出或者公开道歉, 或者赔偿80万元的要求。今年2月20日, 携程在公开声明及致歉信中表示, 向梁先生公开致歉, 承认保单确属伪造, 表示目前已对相关责任人进行了严肃处理, 并将赔偿梁先生4000元。
人物
盖茨重返全球富豪榜首
3月12日消息, 据国外媒体报道, 美国《福布斯》杂志日前公布了“2 0 0 9年全球十亿美元富翁榜单”。微软创始人兼董事长盖茨以400亿美元的身家重新夺回全球首富的位置。排名前三的富豪依次为盖茨、股神巴菲特和墨西哥电信大亨斯利姆。去年, 巴菲特超过盖茨成为首富, 不过金融危机和美国股市暴跌让股神巴菲特遭遇严重损失, 今年的财富只有370亿美元, 远远低于去年的620亿美元。
阿姆斯特朗出任AOL新CEO
3月13日消息, 据国外媒体报道, 美国媒体巨头时代华纳旗下子公司AOL周四宣布, 已任命谷歌北美地区广告销售业务总裁蒂姆·阿姆斯特朗 (Tim Armstrong) 担任AOL下任CEO。阿姆斯特朗将取代AOL现任CEO兰迪·法尔科 (Randy Falco) 的位置。AOL当天在一份声明中表示:“阿姆斯特朗是率领AOL进入下一个发展阶段的合适人选。”
前奥运赛艇选手布里廷掌舵谷歌英国
3月18日消息, 据国外媒体报道, 谷歌任命前奥运赛艇选手、英国最大报业集团三一镜报集团原CEO高管马特·布里廷 (Matt Brittin) 为英国分公司掌门人。布里廷在1988年汉城奥运会上代表英国参加了赛艇比赛, 并多次获得世锦赛奖牌, 布里廷于2007年1月从三一镜报集团离职, 加盟谷歌, 他在三一镜报集团担任战略和数字总监, 负责该集团与主要广告客户交易的直销组织工作。
数字
全国有400万台“肉鸡”
3月15日, 央视“3·15”晚会曝光黑客盗取网银信息网上廉价出售, 地下木马产业正通过灰鸽子、上兴远控、Ghost木马等各种“肉鸡”控制工具, 疯狂侵蚀着互联网安全甚至财富。奇虎360安全专家表示, 央视所揭露的仅为木马产业的冰山一角:整个地下木马产业从业人员已接近百万的规模, 这个黑色产业的规模已经达到每年10亿元, 并以极快的速度增长, 而目前全国的“肉鸡”最少有400万台。
IBM拟65亿美元并购Sun
3月19日消息, 据《华尔街日报》报道, IBM正与Sun商讨并购事宜, IBM很可能以65亿美元现金收购Sun。另据美联社获得的消息称, 双方确实在为此而展开谈判。收购Sun将强化IBM的互联网、数据存储、政府部门和电信业务。分析人士表示, 这是一场数据中心争夺战, IBM收购Sun将使得市场上只剩下2或3家厂商。收购Sun将使IBM的全球服务器市场份额提高9.6%至43%, 扩大对惠普30%市场份额的优势。
索尼实施裁员8000人计划
10.《网页设计中的表格排版》教案 篇十
授课老师：陈清锋
总1课时
本周第5课时
备课时间:2010年11月30日
授课班级:高一（2）班
授课时间:2010年12月9日
教学目标
知识与技能
1、掌握网页设计中的格式化操作
2、掌握网页设计中表格底纹设置
3、掌握表格的属性设置
4、掌握网页设计中表格的排版 过程与方法
1、培养学习、比较、归纳等思想方法和自觉学习的方法。
2、培养学生动手操作的动手能力，形成比学赶帮的学习气氛。
3、培养学生基本的网页制作流程，培养学生任务驱动方法。情感态度与价值观
1、在操作过程中体会网页编辑的整体美感，培养学生基本审美的观点。
2、引导学生形成自主学习与合作学习等良好的学习方式。
3、培养学生正确的人生观和道德情感。教学重点
1、表格中单元格的美感排版
2、掌握表格中的底纹操作 教学难点
1、网页设计中的表格美感排版
2、网页设计中表格嵌套操作 教学用时 1课时 教学地点 三楼机房 教学过程
一、课堂准备及引入（2分钟）
师生问好。清点人数。安全教育：大家刚才来到机房是怎么来的？蹦过来的？！不要急冲冲地来，要做一个文明学生，有一个大将风范，从容地走进机房，如果你是跑来，容易撞到别人，自己也容易摔倒。
大家都知道，现在每个公司，每个学校，每个企业都有了自己的网站，他们的网站都是很漂亮，而且都是非常容易吸引人的，其实，你们也是有能力达到那种水平的，关键是看你要不要学的问题，如果你要学，你们完全有可能超越他们。那么，在制作网页之前我们应该做一个什么重要的步骤呢？建立网站站点，下面，让一个同学来建立一个网站。由学生上台操作完成。网站建好以后，我们就可以制作网页了。今天我们的主要内容是如何利用网页设计中的表格对网页进行排版。（展示课题和重难点）
接着，展示本次训练的网页效果。要求学生按要求完成本次作业效果。（发素材到学生机）
二、提出自学训练题目（5分钟）
学生自己建立一个以自己名字命名的站点，新建一个主页页面，同时再建3个页面作子页面。
1、建立主页，同时建立三个子页面，制作主页网页背景，字体大小和网页标题。
2、制作LOGO栏（一行3列）。
3、制作导航条（首页、湄州之旅、三字公约等8个导航）
4、制作主页面的排版。（注意各排版的关系和位置）。
5、制作页面底部的版权和与子页面的链接部分。
三、学生操作，教师巡视（5分钟）
四、学生演示操作结果，检查学生的自学效果（5分钟）学生操作结果。（分别由学生来完成题目）
五、教师讲解，指出学生的不足（板书）（8分钟）
1、建立主页，“文件”→“新建”→“基本页”→“HTML” →“确定”。保存存“index.html”，用同样的方法建立三个子页面，分别保存。a“属性”→“页面属性”→点击“背景图像”右边的“浏览”按钮，选择“pic/bggreen.gif”这个图像文件，作为网页的背景。
b在标题右边输入：欢迎进入充满朝气蓬勃的高一（2）班级网站。
2、制作LOGO：制作一行三列的表格，分别插入各自的图像和文件。
3、制作导航：a新建一个页面文件，然后在编辑区域中插入一个 2 × 1 的表格，并设置表格的基本属性参数。b将光标置于第一行的单元格中，再将单元格的背景颜色设置为 # 69A 538，并应用同样的方法将第二行单元格的背景颜色设置为 #8FCB 5A。设置完成后将光标至于第一行的单元格中，然后在此单元格中插入一个 1 × 8 的表格，并设置表格的基本属性参数.。c录入文字并设置单元格。在新插入的表格的所有单元格中输入文字，然后选中所有单元格，设置单元格的相关属性。d改变其中一个单元格的文字颜色和背景颜色，使其突出显示。e此时即可得到带有层次感的表格效果。
4、主页面的排版：（重点讲解，让学生明白为什么要这样操作）
a插入一个一行三列的表格（重点说明：大的外表格起到排版布局作用）b左边的一列：插入三行一列的表格，并输入必要的图像和文字。c中间的一列：插入三行一列的表格，并输入必要的图像和文字。d右边的一列：插入三行一列的表格，并输入必要的图像和文字。（查看结果与教师的效果有何不一样）
e左边的一列：插入三行三列的表格，并输入必要的图像和文字。f中间的一列：插入三行一列的表格，并输入必要的图像和文字。g右边的一列：插入三行三列的表格，并输入必要的图像和文字。
（整调排版使用网页整洁美观，关键利用网页设计中的空表格作用进行排版）
5、制作版权和子页面：一行一列表格，输入版权。制作部分超链接。
六、学生当堂训练（8分钟）
学生继续完善网页主页和子页面的设计及超链接制作。
七、学生提交作业（2分钟）
让学生把作业提交上来，检查学生的作业。
八、作业讲评，比较，推优（1分钟）
把学生作业进行讲评，学生之间对比在学习中形成一个比学赶帮的气氛。（做好学生作业情况记录）
九、小结（1分钟）
1、网页中的表格排版一定少用空格。
2、页面要整齐美观。
3、网页中排版要注意空隙的使用。
4、使用扩展布局。
5、只设宽度，不设高度。
十、作业（10秒）
制作一个关于个人的网站。
十一、思考题，指导下一节讲课内容（30秒）
1、网页设计中有否其他的页面排版？
2、预习层的使用？它与网页有什么不一样的地方？
十二、检查计算机硬件配件，师生问好，有秩序下课。（5秒）
11.网页浏览教案 篇十一
（高二信息技术公开课教学教案）
［ 教学目的 ］
了解网站的基本结构、构建网站的步骤，掌握用FrontPage制作简单网页 ［ 教学重点 ］
网站规划、在网页中输入文字，插入图片和表格 ［ 教学难点 ］
在网页中输入文字，插入图片和表格 ［ 教学形式 ］ 演示与练习穿插进行 ［ 教学过程 ］ ［导入新课］
大家都很喜欢上网，因为网上有许多东西（学习资料、游戏、软件、音乐……）可供我们选择，而且许多都是免费的。这就是网络的一个很重要的特点――资源共享。这些资源都是放在一个一个网站中的。我们也可以构建一个网站，把你的珍藏整理好放上去。这样别人就可以分享你的东西。目前，在网上就有许多有名的个人网站，像华军软件、电脑之家、驱动之家、九天音乐等。［讲授新课］
要想在网上安家落户，大体上有以下三步：网站规划、网页制作和上传以布。今天我们就先来学习网站规划和简单网页的制作。
一、网站规划
（在制作网页之前要先建站，如果没有事先的准备及策划，只盲目的开始编辑网页，将要花更多的时间和精力在网站的整合上。所以要养成先建站再织网的好习惯）
1． 确定网站的主题
2． 网站要包含哪些咨训与服务 3． 构思每个网页的草图 4． 确定网页与网页之间的链接
演示：
1、用FrontPage中的导航来更直观地了解网站结构；
2、用FrontPage新建一个站点；
（1）打开FrontPage，选择“文件”－＞“新建”－＞“站点”；（2）单击“只有一个网页的站点”
注：在“文件夹列表”中显示该站点中所有的文件夹和文件。（一般新建站点后就有两个文件夹，我们一般将网站所需的图片放在“image”文件夹中，当然你也可以根据需要新建一些文件夹，但必须在一个站点中）练习：
1． 自己构建一个个人网站；
2． 新建个人网站（当然此时的个人网站还只是和个空白网页）二．制作网页“自我简介”（先展示一下做好的“自我简介”）
（一）在网页中输入文字和插入表格
1． 在网页中编辑工作区输入文字“自我简介”，居中；
2． 选中文字“自我简介”，选择“楷体＿GB2312”，字号为“6（24）磅”，粉红色）； 3． 选择“插入”－＞“换行符”，在弹出的“换行符属性”对话框中选择“普通换行符”，单击“确定”，光标移到下一行； 4． 单击“常用”工具栏上的“插入文件中的图片”按钮，弹出“图片”对话框； 5． 单击“剪贴画”按钮，在“比喻”类别中选择一幅图片，将此图片插入网页中； 6． 调整图片的大小，居中放置；
7． 选择“格式”－＞“背景”命令在网页中加入背景图片； 8． 单击“网页编辑区”下方的“预览”标签，可以预览网页的效果。
（二）制作“自我简历表”
网页中仅有一个标题和一幅图片，内容太少，下面插入一个表格 1． 单击“常用”工具栏上的“插入表格”按钮，制作一个6行2列的表格； 2． 在第一行第二列中，将单元格拆分成3列； 3． 输入“自我简历表”中的文字；
4． 选中第一、三列，将字体设为“黑体”，字号为“4（14）磅”，字型为“粗体”，选中第二、四列，将字体设为“楷体”，字号为“4（14）磅”，选中这个表格，单击“居中”按钮，选中第二、四、六行，设置颜色为“浅绿色”；选中这个表格，单击右键，选择“表格属性”命令，选择边框颜色为“粉红色”，粗细为1；单击确定。注：
1、格的边框粗细设为0，则表格不显示边框。（我们可以利用这一特点来合理安排网页的版面设置，书上163页图7.14的混合排版效果就是一例
2、“文件夹列表”中，双击某一网页，该网页就会显示在网页编辑区中，练习：
1． 在刚刚新建的站点上新建几个网页；
2． 在编辑网页时，学会使用表格来对网页进行排版。三．小结
12.浏览 篇十二
微软发布Windows phone
10月15日,微软公司携手90余家移动通信合作伙伴,在北京宣布将推出首批全新的Windows phone智能手机,17款即将于今年年底前上市的采用微软Windows Mobile 6.5操作系统的Windows phone也首度亮相。Windows phone是基于微软Windows CE的内核嵌入式操作系统,为用户提供与微软Windows操作系统相似的视窗界面和操作方式,同时带来与Windows操作系统同样强大的系统功能。
AMD将发布Congo平台
10月18日消息,据称,AMD计划于10月底或11月初推出面向超轻薄笔记本的Congo平台。据国外媒体报道称,AMD原定于7月份发布Congo平台,但由于超轻薄笔记本需求下跌而推迟了发布日期。AMD尚未公布Congo平台的详细资料,外界预计,Congo平台将包括双核Turion Neo X2 L625、Athlon Neo X2 L335/L325或单核Athlon Neo MV-40处理器,以及M780G芯片组。
三星与LG推出太阳能手机
三星电子和LG电子日前开始发售各自的太阳能手机。三星的这款触摸屏太阳能手机命名为Blue Earth,其外壳是由再生塑料水瓶的材料制成的,背部配备了一块太阳能面板。LG的太阳能手机命名为GD510 Pop,同样具有触摸屏,但其太阳能面板是选配附件。三星Blue Earth定位于顶级消费者,定价在300美元左右。这款手机还可以通过传统的电源线充电,将先在瑞典上市。LG Pop手机的定价同样在300美元左右,选配的太阳能面板价格约为50美元。
新浪管理层首获实际控制权
日前,新浪发布公告,称新浪将新增发约560万股,以新浪CEO曹国伟为首的新浪管理层将以约1.8亿美元的价格,购入新浪新增发的5 6 0万普通股。收购完成后,以曹国伟为首的新浪管理层,将持有新浪9.4%股份,成为新浪第一大股东。这次收购,对管理层而言是一次身份的转换。曹国伟在给员工的信中表示,“从今天开始,我们将实现自己角色的转换,以一个创业者的心态来面对我们的未来”。他认为,这将很大程度上改变新浪长期以来股权分散的情况收购,使新浪管理层和员工的利益与股东利益更加趋于一致。迄今为止,新浪管理层的1.8亿美元购股计划,将是中国互联网行业内的首例MBO案例。新浪管理层将通过新浪投资控股有限公司进行此次管理层收购。该公司1.8亿美元投资新浪,曹国伟和新浪管理层拥有该公司的实际控制权。
报告显示宏碁超越戴尔成全球第二大PC厂商
10月15日消息,据国外媒体报道,市场研究公司IDC发布报告称,第三季度全球PC出货量同比增长2.3%,原因是PC行业继续复苏。报告显示,宏碁超越戴尔,成为全球第二大PC厂商。IDC称,第三季度全球PC出货量为7810万台,除日本以外地区的出货量均达到或超出预期。2009年前两个季度,全球PC出货量均同比下滑。IDC此前预期,第三季度全球PC出货量将同比下滑2.9%。报告显示,惠普继续维持全球PC出货量头名位置,市场占有率为20.2%,第三季度出货量同比增长9.3%;宏碁市场占有率为14%,出货量同比增长25.6%;戴尔出货量同比下滑8.4%,市场占有率从2006年的第一下降至第三;联想和东芝分列四、五名。
开心网推出收费项目网友表示质疑
10月16日起,开心网(kaixin001.com)在个别组件里推出收费项目,让不少网友觉得“不开心”。据介绍,该交友社区中“礼物”和“买房子送花园”的插件推出收费项目引起网友争论,绝大多数网友称不会使用收费功能。网友点击“礼物”组件,在“选择礼物”一栏里就会看到有“收费礼物”的标题。点击标题后出现需要收费的礼物,包括各种各样的蛋糕、名贵药材或者时下正在流行的潮人必备品,价格一般为1个开心币或2个开心币(等于1元或2元)。据了解,开心网(kaixin001.com)并不是第一家组件收费的社交网站,类似社交网站如人人网(原“校内网”)、千橡开心网(kaixin.com)等均陆续推出收费项目。
英特尔IBM等6名高管因涉嫌内幕交易而被捕
10月17日消息,据国外媒体报道,来自IBM和英特尔(博客)等公司的6名高管日前因涉嫌内幕交易而被铺。这6名高管包括IBM系统与科技事业部总经理Bob Moffat、英特尔投资公司战略投资主管Rajiv Goel、麦肯锡高管Anil Kumar和对冲基金Galleon创始人Raj Rajaratnam等。据美联社报道,2007年1月至7月间,一些高管将有关谷歌、宝利通(Polycom)和希尔顿酒店的非公开信息通知给Rajaratnam,然后由Rajaratnam运作帮助Galleon集团获利2000万美元。另据路透社报道,内部交易还涉及到英特尔投资公司,这些内部消息被用于交易IBM、Sun和AMD公司股票。据悉,美国证券交易委员会将对这些高管提起民事诉讼。
数字
谷歌在线办公软件企业用户突破200万
据国外媒体报道,谷歌日前表示,旗下在线办公软件Google Apps的企业用户已超过200万。谷歌称,Google Apps当前的企业用户数量已达到200万,高于6月份的175万。这其中包括每位员工每年需支付50美元的大企业用户,也包括免费使用的小企业用户。此外,Google Apps的活跃用户数量为2000万,高于6月份的1500万,该数字中包括免费使用该项服务的大学生用户。
Twitter已经发布出第50亿条消息
据国外媒体报道,Twitter用户目前已经发布出了50亿条消息。第50亿条消息是由来自美国有线电视公司Current Media的高管罗宾.斯隆(Robin Sloan)发布的。斯隆是在回复另外一名用户的消息时发送该消息的,内容为“Oh lord”。判断这条消息成为Twitter上第50亿条消息的依据是,Twitter消息的链接末尾的数字表示已经发布的消息总数。
工信部:9月全国固话用户减少222.9万
工业和信息化部网站消息,2009年1-9月份,全国累计净增电话用户6198.5万户,总数达到104358.9万户。固定电话用户累计减少1660.8万户,移动电话用户累计净增7859.3万户,达到71983.8万户。其中,9月份新增电话用户710.5万户,全国固定电话用户减少222.9万户,全国移动电话用户净增933.4万户。互联网用户方面,基础电信企业的互联网用户进一步趋向宽带化。1-9月份,基础电信企业净增互联网宽带接入用户1644.9万户,达到9932.8万户,而互联网拨号用户减少了326.6万户。
声音
蒂姆:网址中两条斜线并无必要
10月15日消息,互联网创始人蒂姆.伯纳斯-李(Tim Berners-Lee)承认,互联网址中http:后面的两条斜线“//”,其实并无必要,他为这带来的不便致歉。据国外媒体报道,蒂姆表示,他当年其实很容易找到解决办法,不用这两条斜线。他说,30年前他设计互联网的时候,没想到这两条斜线,后来会给人带来这么多麻烦。蒂姆以幽默的环保角度道歉说,真不知道这两条线,浪费了多少时间、打印墨水和纸张。
鲍尔默:浏览器与操作系统无实质差别
据国外媒体报道,美国科技博客网站Tech Crunch近日刊登了对微软CEO史蒂夫.鲍尔默(Steve Ballmer)的独家采访。本次采访主题是操作系统和浏览器领域的竞争。鲍尔默针对IE8和Windows 7发表了自己的观点。鲍尔默认为,将操作系统和浏览器做出区分,现在已经毫无意义。他详细阐述道,浏览器与操作系统其实已没有实质差别——两者都是操作系统。唯一差别就是操作系统是硬件驱动程序。
桑德伯格:Facebook广告规模将超谷歌
据国外媒体报道,Facebook COO谢丽尔.桑德伯格(Sheryl Sandberg)日前表示,该社交网站所针对广告市场规模要超出谷歌的搜索广告市场。长期以来,桑德伯格一直试图扭转外界对Facebook缺乏营收模式的看法,她详细描述了该公司如何针对3亿用户通过新颖的广告模式获取营收的策略。桑德伯格认为,广告是一种“漏斗”模式,开始是在漏斗的顶部鼓励用户的参与并创造需求,然后在漏斗的底部让用户购买产品。
谷歌侵权万种作品每本赔60美元惹众怒
全球最大的“网络搜索引擎”谷歌,自从推出“数字图书馆”计划后,就因版权争议,在全球广受非议。其中,就有570位内地作家的17922种作品未经授权,即被谷歌非法扫描,部分已放上网。面对前来声讨的作家,谷歌日前提出和解声明,表示每本著作可以获得至少60美元(折合港币约465元)的赔偿。消息一出,引起了内地作家更大的愤怒。谷歌的“数字图书馆”计划始于2004年。今年8月30日,谷歌更高调宣布,将在这个数字图书馆基础上,构建全球最大的“在线图书馆”,客户可通过免费搜索,在线浏览相关图书。据悉,5年间,谷歌已经将全球尚存有版权的近千万种图书收入了“数字图书馆”,但都没有通报版权所有者本人。
富士康在成都投资10亿美元建设产业基地
13.网页浏览教案 篇十三
单击“保存”按钮，保存模板。系统将自动在根目录下创建Template文件夹，并将创建的模板文件保存在该文件夹中。在保存模板时，如果模板中没有定义任何可编辑区域，系统将显示警告信息。我们可以先单击“确定”，以后再定义可编辑区域。
3、从文件菜单新建模板 选择“文件/新建”命令，打开“新建文档”对话框，然后再类别中选择“模板页”，并选取相关的模板类型，直接单击“创建”按钮即可。”
（二）Dreamweaver 8 定义可编辑区域 模板创建好后，要在模板中建立可编辑区，只有在可编辑区里，我们才可以编辑网页内容。可以将网页上任意选中的区域设置为可编辑区域，但是最好是基于HTML代码的，这样在制作的时候更加清楚。在文档窗口中，选中需要设置为可编辑区域的部分，单击常用快捷栏的“模板”按钮，在弹出菜单中选择“可编辑区域”项。10
在弹出的“新建可编辑区域”对话框中给该区域命名，然后单击“确定”按钮。新添加的可编辑区域有蓝色标签，标签上是可编辑区域的名称。如果希望删除可编辑区域，可以将光标置于要删除的可编辑区域内，选择“修改/模板/删除模板标记”命令，光标所在区域的可编辑区即被删除。这样模板文件就创建好了。
（三）、其他模板区域 模板中除了可以插入最常用的“可编辑区域”外，还可以插入一些其他类型的区域，分别为“可选区域”、“重复区域”、“可编辑可选区域”和“重复表格”。
1、可选区域 可选区域是模板中的区域，用户可将其设置为在基于模板的文件中显示或隐藏。当要为在文件中显示的内容设置条件时，即可使用可选区域。
2、重复区域 重复区域时可以根据需要在基于模板的页面中负值任意次数的模板部分。重复区域通常用于表格，也可以为其他页面元素定义重复区域。
3、可编辑可选区域 是可选区域的一种，可以设置显示或隐藏所选区域，并且可以编辑该区域中的内容。
（四）、Dreamweaver 8 使用库 所谓库项目，实际上就是文档内容的任意组合，可以将文档中的任意内容存储为库项目，使它在其它地方被重复使用。
1、创建库 在文档窗口中选择需要保存为库项目的内容。单击资源面板“库”分类中右下角的“新建库项目”按钮。一个新的项目出现在资源面板“库”分类的列表中，预览框中显示预览的效果，还可以给该项目键入新名称。这样，一个库项目就创建好了。
2、插入库 将光标方在网页中需要插入库文件的位置，在资源面板“库”分类中选择需要插入的库项目，直接拖动到光标所在位置即可。
3、更改库 如果修改了库文件，选择“文件/保存”命令，弹出“更新库项目”对话框，询问是否更新网站中使用了该库文件的网页。单击“更新”按钮，将更新网站中使用了该库文件的网页。
（五）、创建基于模板的页面
1、打开素材csslianxi.html文件，选择菜单栏的文件>另存为模板命令。
2、在弹出的另存为模板对话框中，在“站点”文本框选择“xmweb”，在“另存为”给模板命名为mo1，点击确定。
3、弹出是否更改链接的提示，选择“是”。此时，在站点内自动生成一个名为“Templates”的文件夹，名称为mo1.dwt的模板文件被保存在该文件夹中。
4、鼠标在网页表格的最下一行空白处单击一下，选中状态栏的