H5

学习目标:

一、知识目标

1.WEB标准
2.HTML概念
3.HTML文件基本结构
4.使用Notepad++编写HTML文件
5.查看网页源代码
二、
1.网站、网页概念
2.制作网站的流程(前端、后端)
3.H5前端开发的主要课程
4.WEB开发主要的浏览器
5.网页制作常用的开发工具
6.WEB标准(2)
7.HTML基本概念
8.HTML发展历程
9.HTML文件的基本结构
10.网页源文件的获取

学习内容:

二.1.网站是构成web的基础,所谓网站(Website),就是指在网际网络(万维网)上,根据一定的规则,使用HTML等工具制作的用于展示特定内容的相关网页的集合,同时也是构成web的基础.
网页是网站中的一『页』,是构成网站的基础.网页是构成网站的基本元素(网页是网站的一页),是承载各种网站应用的平台.通俗的说,网站就是由网页组成的.
文字与图片是构成一个网页的两个最基本的元素.你可以简单的理解为:文字,就是网页的内容;图片,就是网页的美观.除此之外,网页的元素还包括动画、音乐、程序等等.
二.2.前端:美工设计(photoshop);页面布局美化(html+css);创建动态的HTML页面,网站更加有动感、有魅力,吸引更多的浏览者.(javascript)
后端:后台程序的建设(php、asp、jsp、.net);数据库建设(mysql...);服务器的选择
二.3.①HTML(结构) --> 语法、标签、属性
		②CSS(样式) --> 语法、div+css布局、兼容
		③Javascript(行为) --> 语法、BOM、DOM、交互设计、主流特效 
		④HTML5+CSS3(移动端) --> 新标签、新特性、更加简洁的交互效果 
		⑤PHP+mySQL(后台数据库) --> AJAX、网站制作流程 
		⑥框架(应用) --> jquery、bootstrap、zpeto、angularjs... 
		⑦webApp --> 响应式网站、移动端网页、跨平台App
二.4.①IE浏览器
		②谷歌(chrome)浏览器 
		③火狐(firefox)浏览器 
		④opera浏览器 
		⑤safari浏览器
二.5.①Webstorm
		②Dreaweaver
		③Phpstorm
		④Hbuilder
		⑤Sublime Text 
		⑥Notepad++ 
		⑦记事本 
二.6.(1)Web标准是网站开发中一系列标准的集合,包括XHTML、XML、CSS、DOM和ECMAScript等.制定这些标准是为了便于维护,代码更简洁,降低带宽的运行成本,更容易被搜索引擎搜索到,改版方便,不需要变动页面内容,提高网站易用性等.
6.(2)Web标准是由W3c和其它标准化组织制定的一套规范集合,Web标准的目的在于创建一个统一的用于Web表现的技术标准,以便通过不同的浏览器或终端设备向最终用户展示信息内容.
6.(3)Web标准由一系列规范组成,目前的Web标准主要由三大部分组成:结构(Structure)、外观(Presentation)、行为(Behavior).真正符合Web标准的网页设计是指能够灵活使用Web标准对Web内容进行结构、表现与行为的分离.
二.7.(1)HTML(Hyper Text Markup Language,超文本标记语言)
		(2)①我们现在正在使用的版本是HTML4.01.
			 ②对语法的要求不是很严格,标签不闭合,大小写不注意,引号运用不严格.
			 ③HTML作为一款标记语言,本身不能显示在浏览器中.标记语言经过浏览器的解释和编译,才能正确地反映HTML标记语言的内容.HTML从1.0到5.0经历了巨大的变化,从单一的文本显示功能到多功能互动,许多特性经过多年的完善,已经成为了一款非常成熟的标记语言.
二.8.① HTML  -->  1991 
		② HTML+  -->  1993 
		③ HTML 2.0  -->  1995 
		④ HTML 3.2  -->  1997 
		⑤ HTML 4.01  -->  1999 
		⑥ XHTML 1.0  -->  2000 
		⑦ HTML5  -->  2012 
		⑧ XHTML5  -->  2013 
二.9.(1)完整的HTML文件包括标题、段落、列表、表格以及各种嵌入的对象,这些对象统称为HTML元素.
	一个HTML文件的基本结构如下:
		<!DOCTYPE html>  -->  html5标准网页申明
		<html>  --> 文件开始标记 
		<head>  -->  文件头开始的标记 
		...文件头的内容(head里面可以写的标签:title、meta、style、script、link)
		<title></title>  -->  网页标题 
		<meta charset="UTF-8">  -->  使用最广泛的网页编码是utf-8 
		</head>  -->  文件头结束的标记 
		<body>  -->  文件主体开始的标记 
		...文件主体的内容
		</body> -->  文件主体结束的标记
		</html> 文件结束标记
	二.10.(1) <meta>标签的作用:提供有关页面的元信息,标签位于文档的头部,不包括任何内容
				主要有以下两种作用:
				①<meta name="keywords(关键字)" content(内容)="百度">向搜索引擎说明你的网页的关键词;
				<meta name="description" content="百度一下,你就知道">告诉搜索引擎你的站点的主要内容;
				content内容是给网络爬虫看的,让搜索引擎更快的找到你的网页
				②<meta charset = "utf-8"/>万国码  规定网页的文字编码格式;
		 (2) <title> 标签的作用:定义网页的标题,标签位于文档的头部  <title>我的网页</title>
	二.11.(1)查看网页源代码:在浏览器当中,点击右键-[查看网页源代码]命令,可以查看当前网页的代码.
			  (2)网页源文件的获取:在需要保存的页面,右键单击-[另存为]命令,即可将网页源代码保存到指定的			 	   位置.

学习产出:

	1.重点:(1)html基本结构
				 (2)使用记事本创建第一个页面
	2.难点: web标准、html概念

新的改变

 	1.知道了HTML5是什么
 	2.学完了HTML5能干什么
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值