这是我参与「第五届青训营 」伴学笔记创作活动的第一天
课程重点
- 前端工作的定义
- 前端技术栈拆解与分析
- HTML 作用解析
- HTML 语义化
详细知识点介绍
前端工作的定义
前端工程师的工作就是利用web技术栈解决多端图形界面交互的工程师
前端技术栈
主要包含HTML(内容)、CSS(样式)、Javascript(行为)+网络协议(HTTP/WebSocket)
开发环境
浏览器(edge/chrom) + 编辑器(VSCode/WebStorm)
HTML
HyperText Markup Language(超文本标记语言) 浏览器解析HTML代码生成DOM树
HTML语法
- 标签和属性不区分大小写，推荐小写
- 空标签可以不闭合，比如input、 meta
- 属性值推荐用双引号包裹
- 某些属性值可以省略，比如required、 readonly
HTML语义化
语义化是什么？
- HTML中的元素、属性及属性值都拥有某些含义
- 开发者应该遵循语义来编写HTML
- 有序列表用ol;无序列表用ul
- lang属性表示内容所使用的语言
语义化的好处？
- 代码可读性
- 可维护性
- 搜索引擎优化
- 提升无障碍性
如何做到语义化？
- 了解每个标签和属性的含义
- 思考什么标签最适合描述这个内容
- 不使用可视化工具生成代码
课后个人总结
本节课程围绕“前端要解决的基本问题”及“什么是 HTML ”两个基本问题展开，深入解析了前端技术栈的构成。首先，课程阐述了前端要解决的基本问题，如如何在浏览器中展示内容。其次，课程深入讲解了作为前端最为基础的技术- HTML 的基础语法和基本功能。
在实际研发过程中，课程还着重介绍了如何做到 HTML 语义化。经过这堂课的学习，我对前端技术栈的构成，以及HTML的基础语法和基本功能有了更深入的了解。我也学会了如何高效地编写HTML,使用HTML语义化的原则来编写更优秀的代码。
