这是我参与「第四届青训营 」笔记创作活动的的第1天

一、前端的要点

1.解决的问题

①解决图形用户界面GUI（Graphical User Interface）下人机交互问题

②跨终端问题

    -PC/移动浏览器
    -客户端/小程序
    -Vr/AR等

③web的技术栈？

2.前端工程师的（三层）技术栈

一般包括：HTML（行为）、CSS（样式）、Javascript（内容） 前端工程师通过以上三层的技术栈，在浏览器端解决人机交互问题， 浏览器通过网络协议（http，https等）与服务器端交互

3.前端工程师应该注意哪些方面：

①功能的实现：解决了哪些问题，是否满足了用户的需求

②程序的性能：是否速度足够快？动画是否足够快？

③兼容性：是否能跨设备使用？

④无障碍体验：是否对所有的人都时可用的

⑤安全性问题：是否能保证用户数据的安全？是否存在安全漏洞？

⑥界面是否美观。

⑦用户体验：

4.前端的边界

随着前端技术高速的发展，前端技术能做的事情越来越多：

① 使用Nodejs 开发服务器端的应用

② 使用Electron 开发客户端应用

③ 使用react Native 实现P2P在线的传输

④ 使用webRTC开发3D游戏

⑤ 等。。。

5.开发环境

---

二、HTML超文本标记语言

1.不常用标签

① <-dl>标签：定义列表：①<-dt>键：②<-dd>值

②<-input>标签：type="range"出现滑块 设置list属性，为用户提供提示选项：

③<-select>标签：<-option>提供下拉选项

2.文本类标签

①引用标签

-<-blockquote>标签长引用，cite属性可定义来源地址
-<-cite>标签短引用，斜体显示
-<-code>标签引用代码标签

②<-em>标签：斜体显示

3.HTML文件对应的DOM树

4.HTML的语法关键点

-标签和属性不区分大小写，推荐小写
-空标签可以不闭合，比如input、meta
-属性值推荐用双引号包裹
-某些属性值可以省略，比如required、readonly

5.HTML界面划分

6.语义化

对于不同的元素与属性实现的功能不一样，开发者应该遵循语义来编写HTML
如：
    有序列表用ol;无序列表用ul
    lang属性表示内容所使用的语言

语义化的好处：

代码可读性好
可维护性强
搜索引擎优化更好
可提升无障碍性