Java网络 1.5 HTML 骨架
HTML 骨架
- 概述
- 文档声明头
- HTML 规范
- 字符集
-
- 字符集的种类
- 字符集是什么
-
- 字库的类型
- 关键字和页面描述
-
- 格式
- 完整骨架
- title 标签
概述
标准的骨架:
Title
我们来一部分一部分的学习
文档声明头
任何一个标准的 HTML 页面, 第一行的开头一定是这样:
1 这一行, 就是文档声明头, DocType Declaration. 此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范. 到底有哪些规范呢?
首先我们先确定一件事情, 我们现在学习的是 HTML4.0.1 这个版本, 这个版本是 IE6 开始兼容的. HTML5 是 IE9 开始兼容的. 但是 IE6, 7, 8 这些浏览器还不能过早的淘汰, 所以这几年网页还是应用 HTML4.0.1 来制作. 后面将学习手机, 移动端的网页, 就可以使用 HTML5 了.
HTML 规范
HTML4.0.1 里面有两大种大规范, 每种大规范里面又有 3 中小规范. 所以一共 6 种规范:
| 大规范 | 小规范 | 描述 |
|---|---|---|
| HTML4.0.1 | Strict | 严格的, 体现在一些标签不能使用, 比如 u (下划线) |
| Transitional | 普通的 | |
| Frameset | 带有框架的页面 | |
| XHTML1.0 | Strict | 严格的, 体现在一些标签不能使用, 比如 u (下划线) |
我们学习的是 XHTML1.0 中的 transitional 版本. 因为我们页面汇总偶尔也要使用一些类似 u 这种标签.
Idea 中输入的 html:xt. x 表示 XHTML, t 表示 transitional.
HTML5 中极大的简化了 DTD, 也就是说 HTML5 中没有 XHTML 了.
字符集
字符集采用 meta 标签定义, meta 表示 “元”. “元” 配置, 就是表示基本的配置项目. meta 用开发工具生成就像.
字符集的种类
charset 就是 charator set “字符集” 的意思. 中文能够使用的字符集有以下三种:
UTF-8
gb2312
gbk
字符集是什么
我们先来举个活字印刷的例子.
老王和老李都发明了字库. “传” 字在老王的字库里面是第 2 个大盘子第 4 行第 43 列的. 而 “传” 在老李的字库里面是第 5 个大盘子第 6 行第 13 列的.
在计算机里, 不能直接存储汉字, 而存储的是编码. 所以, 计算机记录 “传” 这个字, 就是这么记录的:
- 老王: 20443
- 老李: 50613
字库的类型
我们简单的介绍两个字库, 想要详细了解的同学可以去翻 “Java 基础” 的文章, 在那里我有详细讲解.
UTF-8 是国际通用字库, 里面涵盖了所有地球上人类的语言文字. (Idea 的默认编码是 UTF-8)
gb2312 是国标, 是中国的字库, 里面仅涵盖了汉字和一些常用外文. (字库规模: UTF-8 > gb2312 (只有汉字))
注: UTF-8 里面存储一个汉字需要 3 个字节. 而 gb2312 只需要 2 个字节.
关键字和页面描述
meta 除了可以设置字符集, 还可以设置关键字和页面描述.
设置页面描述:
只要设置的 Description 页面描述, 那么百度的搜索结果, 就能够显示这些语句. 这个计算叫做 SEO (Search Engine Optimization) 搜索引擎优化.
格式
name 就是 “名字” 的意思, content 是 “内容” 的意思. 也就是说, 我们定义了一个名字是 “Description” (描述) 的 meta.
定义关键词:
这些关键词, 就是告诉搜索引擎, 这个网页是干嘛的, 能够提高命中率. 让别人能够找到你, 搜索到你. Keywords 就是 “关键词” 的意思.
完整骨架
一个比较完整的骨架是这样:
Document
第 4 行: 字符集设置
第 5 行: 关键词
第 6 行: 描述
title 标签
网页的标题
title 也是助于 SEO 搜索引擎优化的:
我是小白啦啦啦
京东(JD.COM)-正品低价、品质保障、配送及时、轻松购物！
网页的 head 标签里面, 表示的是页面的配置. 那么配置有哪些呢?
字符集, 关键字, 页面描述, 页面标题. 今后我们还能看见一些配置: IE 适配, 视口, iPhone 小图标等等…