前端与HTML | 青训营课堂笔记总结
这是我参与【第五届青训营】伴学笔记创作活动的第一天！
课程重点
- 前端工作的定义
- 前端技术栈的解析与分析
- HTML作用的分析
- HTML语义化
具体分析
- 前端是网站的前台部分，运行在PC端、移动端等浏览器上呈现给用户浏览的页面，所以前端工程师是使用Web技术栈解决多端图形用户界面交互的工程师。前端技术栈可以拆分为三个基础大类，即HTML、CSS、JavaScript。HTML是负责页面、结构、内容等；CCS是可以设置页面的样式，比如位置、大小、颜色等；JavaScript是用来定义网页的行为，比如用户点击页面，页面应该如何反应。三者都是运行在浏览器里面的，而浏览器可以通过HTTP协议和服务器进行通信，把前端代码通过HTTP协议从服务器中进行抓取，然后进行渲染，浏览器也可以把用户填写的内容或用户的一些行为通过HTTP协议提交到服务器端，最后一个完美的页面就可以轻松呈现啦。
- HTML是一种超文本标记语言。其中包括一些标签，通过这些标签将页面中的内容进行格式统一。
- 在HTML中有许多常用的标签 例如：
标题
列表
在HTML中使用标签时，我们应该遵循以下四个原则，1.HTML中的元素、属性及属性值都拥有某些含义；2.开发者应该遵循语义来编写HTML；3.有序列表用ol；无序列表用ul；4.lang属性表示内容所使用的语言。
并且在前端中我们要注意功能、美观、安全、性能、无障碍相结合，更要致力于制作出具有兼容性能强和用户体验感满分的前端页面。
在浏览器抓取到HTML时，会把HTML代码会开始解析，解析出来一个DOM树，它为一个树形结构，形成的节点称之为DOM节点，包含文档的根节点，并由此向下依次分支。
在HTML中，语法也有相关的规定，1.标签的属性不区分大小写，推荐用小写；2.空标签可以不闭合，比如input、meta；3.属性值推荐用双引号包裹；4.某些属性可以省略，比如required、readonly等。
在HTML中页面也需要有整体的布局，在内容划分上也有若干标签，
1.页头以标题为主，放在header标签里，导航可以用nav标签来表示；2.页面的主体部分放在main标签里面，一般为页面的重点内容；3.页面的文章正文内容，我们可以放在article标签里面，可以有一个，也可以有多个,也可以没有；4.与页面相关但并非直接属于页面的主体内容，可以放在aside标签里；5.footer标签放在页尾，里面可以放一些比如参考链接，版权信息，备案信息等。
