这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天
前端与 HTML
这节课程围绕“前端要解决的基本问题”及“什么是 HTML ”两个基本问题展开
前端要解决的基本问题
前端应该关注哪些方面？
功能、美观、无障碍、安全、性能、兼容、体验
前端的边界？
- node.js 可以做服务端
- ELECTRON 可以做桌面应用
- React Native 开发客户端应用
- Web RTC 实现多人会议
- Web GL 开发流畅 3D 应用
- Web ASSEMBLY 把 C++ 等编译成可以在浏览器中直接运行的代码
总之，前端的发展非常迅速，技术更新的速度非常快，需要我们去不断的学习，才能跟上技术的发展
什么是 HTML
HTML，全称是 HyperText Markup Language，即超文本标记语言，它不是编程语言，而是一种用来告知浏览器如何组织页面的标记语言，用来描述网页的表现，展示效果或功能及行为
“超文本”（hypertext) 是指连接单个网站或多个网站网页的链接
- HTML 使用“标记”（markup) 来注明文本、图片和其它内容
- HTML 通过“标签”（tag）标记元素，标签由在<和>中包裹的元素名组成
- HTML 标签里的元素名不区分大小写。可以用大写、小写或混合形式书写
DOM 节点树
HTML 和 DOM 有什么不同
DOM 是用来操作和描述 HTML 文档的 接口
如果说浏览器用 HTML 来描述网页的结构并渲染，那么使用 DOM 则可以获取网页的结构并进行操作。一般来说，我们使用 JavaScript 来操作 DOM 节点，从而实现页面的动态变化以及用户的交互操作。
DOM 解析
HTML 内容被解析成 DOM 树
HTML 语义化
语义是语言的含义，语义化是前端开发的专用术语，语义类标签是对内容的补充，表达标题摘要，文章结构、强调重点、丰富含义，避免歧义。
HTML 语义化的好处包括：
- 增强
可读性，便于开发和维护 - 增强结构清晰度，利于
SEO - 增强
可访问性，便于屏幕阅读器定位和朗读
HTML 语义化不是一定要执行的标准：
- 利用无语义标签，如
<div>和<span>可以满足几乎所有开发需求 - 可读性、SEO 和可访问性，使用语义化标签不是必须的
- 部分语义化标签存在兼容性问题
- 滥用列表标签，会增加不必要的嵌套，增加额外的 CSS Reset 的样式
讲师多次提醒我们，要传达内容而非样式，这就是语义化的目的
课程小结
这节课我们学习了前端应该解决哪些问题，前端可以做什么以及
- 什么是 HTML
- DOM 和 HTML
- HTML 语义化以及语义化的好处
