前端与 HTML | 青训营笔记

48 阅读2分钟

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

一、本堂课的重点内容

1、什么是前端?

  • 解决GUI人机交互问题
  • 跨终端 :①PC/移动浏览器②客户端/小程序③VR/AR等
  • Web技术栈

2、前端技术栈

![`3KUB3DM7F}[XH{T4Q54N0.png

3、前端应该关注的方面:

  • 功能
  • 美观
  • 无障碍
  • 安全
  • 性能
  • 兼容
  • 体验

4、html是什么?

HyperText Markup Language--超文本编辑语言

5、html常见的标签

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>页面标题</title>
</head>
<body>
  <h1>一级标题</h1>
  <p>段落&nbsp内容</p>
</body>
</html>

①DOCTYPE html

标记html是用哪个版本,浏览器按着规定去渲染,如果没有的话,浏览器渲染会特别奇怪

②html标签

在里面写网页的全部内容

③head标签

头标签,写不需要在网页展示的内容

④body标签

定义文档的主体,写需要在网页展示的内容

6、html语法

  • 标签和属性不区分大小写
  • 空标签可以不闭合,例input、meta
  • 属性值推荐使用双引号包裹
  • 某些属性值可以省略

7、语义化是什么?

  • html中的元素、属性及属性值都拥有某些含义
  • 开发者应该遵循语义来编写html

8、谁在使用我们写的html

  • 开发者-修改、维护页面
  • 浏览器-展示页面
  • 搜索引擎-提取关键词、排序
  • 屏幕阅读器-给盲人读页面的内容

9、语义化的好处

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

二、个人课堂总结

这节课我知道了什么是前端,什么是html,以及html中的一些标签,明白了前端是人机交互的媒介,只有前端页面的更加美观,便捷,用户的操作才会更加方便,才会吸引住用户,留住用户。