前端概述
前端开发（Web Front-end development） 后端开发（Web back-end development） 前端开发开发什么：
- 结构布局、
- 样式呈现、
- 页面动态交互（数据交互处理、数据格式化渲染）
结构布局、 样式呈现、 行为逻辑 HTML、 CSS、 JavaScript 房子结构、 装修房子、 开门
HTML
HTML:超文本标记语言(Hyper text markup language)
双标签：
<p></p>
开放标签 闭合标签 开始标签 结束标签
单标签：
<br/>
标签属性:
对标签进行限定、修饰 属性名=‘属性值’
<a href='https://www.baidu.com' target='_blank'></a>
HTML的组成
<!DOCTYPE html> --------------------声明html版本为html5
<html lang='zh-CN'> -------------------------根标签
<head> -------------------------向浏览器传递网页的基本信息和配置
<title></title> ----------网站标题
<mate charset='UTF-8'></mate> --------设置编码字符集
<mate name='keywords' content=''></mate> ---------网站关键词
<mate name='description' content=''></mate> -------网站描述信息
</head>
<body><body> -------------------------网页内容区域
</html>
title
**title：** 网站标题 （一般30-40个字）
1. 主页title：网站名称+主要关键字/关键词描述
2. 详情页title：详情名称+网站名称+简介
3. 列表页title：分类名称+关键字+网站名称
4. 文章页title：标题+分类+网站名称
keywords
**keywords：** 关键字（一般100个字符，关键词之间小写逗号分隔）
1. 网站名称+分类信息
description
**description：** 描述信息（80-120汉字）
1. 综合title+keywords的简单描述
搜索引擎
搜索引擎认知的优先级：(与SEO搜索引擎优化相关)
title > description > keywords
语意化标签
语意化标签有利于搜索引擎爬虫seo优化，增加可读性
<i></i>
<em></em>
’i‘ : italic 表示斜体（物理标签 样式修饰）
'em' : emphasize 表示强调（语意标签 添加功能）浏览器搜索优先级高，建议使用
lang
lang: language 语言
<html lang='zh-CN'></html>
zh-CN：简体中文
en:英文
简体中文：zh-hans zh-CHS zh-CN
繁体中文：zh-hant zh-CHT
charset
charset: 编码字符集
<mate charset='UTF-8'></mate> 设置编码字符集
UTF-8 ：万国码
如果不写charset='UTF-8'网页中的中文会出现乱码
GB2312 ：中国信息处理国家标准码-简体中文编码（只认识简体中文）
GBK ：汉字扩展规范（扩大汉字收录，增加繁体中文，增加藏蒙维等少数民族文字。是对GB2312的扩展）
UTF-8 ：万国码（认识世界上所有的文字）
DOCTYPE
DOCTYPE 声明html
<!DOCTYPE html> 声明html（html5 的声明方式）
html声明 用于告诉浏览器使用的html版本
html声明不是html标签
document.compatMode : 浏览器兼容性模式
有html声明：document.compatMode 为 CSS1Compat(浏览器的W3C标准兼容性模式)
没有html声明：document.compatMode 为 BackCompat(浏览器的怪异兼容模式)
