这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天，今天的学习内容主要是HTML，课程的重点是：
- 前端工作的定义
- 前端技术栈拆解与分析
- HTML作用解析
- HTML语义化
前端工作的定义
作为一名前端程序员，我们首先需要解决的是图形用户界面（GUI）人机交互的问题，因为前端就是展现在用户面前的东西，是距离用户最近的，如果前端程序员无法解决这个问题，那么这将严重影响用户对产品的正常使用，与此同时，随着互联网的发展，我们不仅仅是局限于网页，更是有客户端/小程序，PC/移动浏览器，VR/AR等，需要前端程序员参与开发。前端技术栈拆解与分析
前端最基本的技术栈，也就是我们常说的前端三件套（html、css、JavaScript），与此同时也包括各种各样的网络协议，需要与服务器端（后端）进行交互。 作为一名前端程序员，我们不仅仅是要学会技术的使用，更是要关注它的功能、美观、无障碍、安全、性能、兼容性、体验，因此实际上前端的技术栈也是非常广的。 前端发展是非常非常快的，我们能看到许许多多的技术涌现，实现与后端的交互，因此作为前端程序员也需要进行不断地学习，才能一直适应这个行业。HTML作用解析
HTML全称是超文本标记语言，HTML实际上是由许多的标签构成的，包括我们常用的h1、a、img、p等等标签。最简单的一个HTML文件结构：
<html lang="en">
<head>
<meta charset="UTF-8">
<title>页面标题</title>
</head>
<body>
<h1>一级标题</h1>
<p>段落内容</p>
</body>
</html>
浏览器在获得HTML代码之后，会将其转化为DOM树，原先的HTML中的标签就会转化为一个一个的DOM节点，从而呈现给用户。 HTML有几点语法需要注意：
- 标签和属性不区分大小写，但是推荐小写
- 空标签例如input、meta可以不闭合
- 属性值推荐使用双引号包裹
- 某些属性值能够省略，例如required、readonly
HTML有很多很多类型的标签，可以不全部掌握，但是一定得有印象。
HTML语义化
HTML的内容划分，我们经常能看到一个网站基本上是按照这样一个结构展示给用户的。开发者应该遵循语义来编写HTML，因为这不仅仅是方便开发者在后期对页面进行修改与维护，也是希望搜索引擎能够提取关键词并排序，同时屏幕阅读器能够根据HTML来给盲人读页面内容。 综上，语义化能够给我们带来很多的好处。
- 代码可读性
- 可维护性
- 搜索引擎优化
- 提升无障碍性
