计算机基础之网页设计.

计算机web程序设计计算机Web程序设计是一门结合了计算机科学、网络技术和软件开发的综合学科。

它主要关注于创建和维护通过互联网访问的应用程序和服务。

以下是对这一领域的基础概述和关键概念的介绍。

1. Web程序设计概述Web程序设计涉及到使用各种编程语言和工具来开发可以在浏览器中运行的应用程序。

这些应用程序可以是简单的信息展示页面，也可以是复杂的交互式应用，如在线商店、社交媒体平台和在线游戏等。

2. Web技术基础2.1 HTML超文本标记语言（HTML）是构建网页内容的标准标记语言。

它定义了网页的结构和内容，如段落、标题、列表、链接等。

2.2 CSS层叠样式表（CSS）用于描述网页的布局和外观。

它允许开发者控制字体、颜色、间距和其他视觉元素。

2.3 JavaScriptJavaScript 是一种脚本语言，用于增强网页的交互性。

它允许开发者创建动态内容，如动画、表单验证和动态更新的网页元素。

3. 前端开发前端开发是指直接与用户交互的界面设计和实现。

前端开发者使用HTML、CSS和JavaScript来构建用户界面，并确保它在不同的设备和浏览器上都能正常工作。

4. 后端开发后端开发关注于服务器、应用程序和数据库之间的交互。

它涉及到使用服务器端语言如PHP、Python、Ruby、Java或.NET来处理数据存储、业务逻辑和服务器管理。

5. 数据库技术数据库是存储、检索和管理数据的系统。

Web程序设计中常用的数据库技术包括关系型数据库（如MySQL、PostgreSQL）和非关系型数据库（如MongoDB、Redis）。

6. Web服务和APIWeb服务是一种软件系统，它允许不同的应用程序之间通过网络进行交互。

应用程序编程接口（API）提供了一种标准化的方法来访问这些服务。

7. 安全性Web程序设计中的安全性至关重要。

开发者需要了解如何保护应用程序免受攻击，如SQL注入、跨站脚本（XSS）和跨站请求伪造（CSRF）。

第一章、网页设计简介一、万维网概述1、万维网（World Wide Web,WWW）是一个基于超文本（hypertext）方式的信息检索服务工具。

超文本结构通过指针方式连接，可以使任何地方之间的信息产生联系，这种联系可以使直接的或间接的，也可以使单向的或双向的。

2、WWW系统允许超文本指针所指向的目标信息源不仅可以使文本，也可以是其他媒体，如图像、声音等信息，更重要的是可以把分散在不同主机上的资源有机地组织在一起，这种超文本结构与多媒体的结合体，被称为“超媒体”。

3、WWW获得成功的秘诀在于它制定了一套标准的、易于人们掌握的超文本开发语言HTML、信息资源的统一定位格式URL和超文本传送协议HTTP，用户掌握后可以很容易的建立自己的网站。

二、HTML语言1、WWW所使用的母语就是HTML语言。

2、HTML使Hypertext Markup Language的英文缩写，即超文本标记语言，它是构造Web 页面（page）的主要工具。

3、设计HTML语言的目的是为了能把存放在一台计算机上的资料与另一台计算机中的资料方便的联系在一起，形成有机的整体，人们不用考虑具体信息是在网络的那台计算机上。

4、使用HTML语言描述的文件，能独立于各种操作系统平台（如UNIX、Windows等），访问它只需要一个WWW浏览器，我们所看到的页面，使浏览器对HTML文件进行解释的结果。

5、可以通过浏览器直接查看一个页面的HTML源代码，例如在IE浏览器菜单栏上选择“查看”——“源文件”即可。

三、网页设计的相关概念1、超链接网页时使用HTML语言编写的，其特点就在于“超链接”。

超链接（Hyper Link）是特殊的文字标识，它指向了WWW中非资源，例如一个网页、声音、文件、网页的一个段落或者WWW中的其他资源等，这些资源均可放在任意一个服务器上。

鼠标单击超链接时，就会跳转到超链接所指向的资源，就可以从WWW上下载新的信息。

判断一个网页的某个部分是否是超链接，就是当鼠标的光标箭头拖到这个地方时，如果是超链接，浏览器便会改变光标为一只手的形状。

《网页设计》课程标准一、课程定位《网页设计》是虚拟现实应用技术专业的专业学习领域课。

该课程实现Web程序开发知识、方法及工具，着重介绍在Web开发过程用到的HTML5基础知识，用于美化Web页面的样式表知识。

是一门用途广泛、前景良好的计算机行业课程，是适应计算机虚拟现实应用技术专业课程的需要。

该课程的学习可为后续《JavaScript脚本语言》等课程奠定一定的职业能力基础。

二、课程目标通过《网页设计》课程的学习，使学生具备Web应用开发的基本知识，为学习和掌握专业知识和职业技能打下基础。

1．知识目标（1）理解网站的基本概念和HTML5网页编程语言基础；（2）掌握搭建开发环境、网站的搭建（3）掌握HTML5中文字和段落的设置和常用标签；（4）掌握列表标签的使用；（5）掌握超级链接标签的使用；（6）掌握表格标签的设计和使用；（7）掌握框架页面布局；（8）掌握表单的设计；（9）掌握网页中多媒体的应用；（10）掌握层叠样式表CSS3的基本知识；（11）掌握一到多款网页设计软件的运用。

2．能力目标（1）能运用HTML5标签设计网页；（2）能使用CSS3设计网页；（3）会网页设计工具设计网页。

3．素质目标（1）具有自我学习的能力；（2）具备规范化、标准化的代码编写习惯，一定速度的代码编写能力；（3）养成忠于职守、认真负责、精益求精的敬业精神；（4）具备良好的沟通能力；（5）具备良好的团队合作精神以及自我展示能力。

三、课程设计1、设计思想（1）教学内容框架课程按照以能力为本位，紧密围绕在使用HTML5标签，利用CSS3 +DIV布局制作网页过程中遇到的实际需要和应该掌握的技术，全面介绍HTML5标签设计网页的内容和技巧。

（2）总体设计思路以完整的网页制作工作过程为导向，重构教学内容。

根据行业企业发展需要和完成职业岗位实际工作任务所需要的知识、能力素质要求，按照网页设计与制作的过程和学生的学习认知规律，打破原有的功能化知识体系，对教学内容从简单到复杂，从入门到深化进行科学安排，循序渐进的实现教学目标，课程内容与项目开发内容一致，理论与实践一体化，实现学习和工作的深度融合。

网页制作教学设计优秀8篇制作交互网页教学设计篇一网页的制作一、教学题目：网页的制作二、教学目标：1、知道站点、主页的概念，能在指定位置建立只有一个网页的站点；2、认识frontpage的界面；3、掌握在主页中插入文字、图片、水平线；4、掌握页面文件与图片的保存。

三、教学重点：1、能在指定位置建立只有一个网页的站点（难点）2、能在页面中插入文字、图片、水平线3、掌握页面文件与图片的保存（难点）四、教学难点：在教学中，一方面采用比较教学的方法，促进学生知识的迁移；另一方面，提供学生一个导学课件，让学生根据这个网络环境下的课件自己探索学习，以满足不同层次学生的需求。

五、教学过程：教师活动：1、引入课题：（激发兴趣，活跃气氛）同学们喜不喜欢上网？经常上新浪、西祠胡同等，有没有同学知道新浪、西祠胡同称做什么？（网站）浏览新浪网站，浏览的第一个页面称为什么？（主页）我们还可以浏览其它的页面，点击超链接浏览，当鼠标变成手指的形状时有超链接。

问题1：网站是不是就是网页？用自己的语言描述一下网站的概念（网站包含多个网页，通过超链接把不同的页面链接起来）问题2：网页是不是就是主页？(第一个页面称为主页，网站设计者可以确定哪一个是主页，主页的文件名一般为：,主页也是网页)设计网站一般必须经过两个步骤，首先是在计算机里做好，然后发布在internet上，让所有的人访问浏览。

今天我们学习用frontpage建立站点，制作一个主页。

先来研究一下没有发布的网站，打开教师做的网站问：同学们看到了什么？（文件夹）总结：可以这样理解网站：在资源管理器里，网站表现为一个文件夹，里面存放的是所有与网站相关的文件。

打开主页，浏览页面，这是老师做的一个导学课件，将帮助大家完成学习任务。

请学生浏览教师课件，了解学习任务。

2、新建站点frontpage的启动问：与word比较，有什么不同？（增加了视图区，编辑区有三个窗口）总结：视图区：多种视图模式是为了方便网站的管理。