这是我参与「第四届青训营 」笔记创作活动的第1天
（一）什么是前端
- 解决GUI人机交互问题
- 跨终端
- web技术 web技术栈解决多段交互的技术
- shell：外壳
- core：内核（JS执行引擎、渲染引擎） IE：trident
- 开发者-修改，维护页面
- 浏览器-展示页面
- 搜索引擎-提取关键词，排序
- 屏幕阅读器-给盲人读页面内容
- 每一个HTML元素都具有具体含义 a元素：超链接
- 传达内容，而不是样式 所有元素与展示效果无关
- 代码可读性
- 可维护性
- 搜索引擎优化
- 提升无障碍性
- 了解每个标签和属性的含义
- 思考什么标签最适合描述这个内容
- 不使用可视化工具生成代码
- h1--h6：表示标题
- 有序列表
- 无序列表
- 定义列表
- img标签
- src属性是必须的，嵌入图片的文件路径
- cite元素用于引用作品标题
- controls 是否展示浏览器自带的控件，可以创建自定义
-
pc/移动浏览器
客户端/小程序
vr/ar等
运行在浏览器，通过HTTP协议和服务器进行通信，渲染页面
HTML、CSS->浏览器内核->页面
浏览器：
Firfox：gecko Opera：presto
功能、安全、美观、兼容、性能体验、无障碍
（三）HTML是什么
HTML (HyperText Markup Language) 超文本标记语言，不是一门编程语言，而是一种用来告知浏览器如何组织页面的标记语言。 MDN：Mozilla Development Network，Mozilla 开发者社区。
（四）标准的文档结构
HTML：页面、HTML文档
文档声明，告诉浏览器，当前文档使用的HTML标准是HTML5。
不写文档声明，将导致文档进入怪异渲染模式。
lang属性：language，全局属性，表示该元素内部使用的文字为哪一种自然语言书写。
属性=属性名+属性值
有些元素没有结束标记，这样的元素叫做空元素
（五）语义化
什么是语义化
p元素：段落
h1元素：一级标题
元素展示到页面中的效果，应该由CSS决定。
因为浏览器带有默认的CSS样式，所以每个元素有 一些默认样式。
重要： 选择什么元素， 取决于内容的含义， 而不是 显示出的效果
每隔一段时间，搜索引擎会从整个互联网中抓取页面源代码
如何做到语义化
