前端与 HTML | 青训营笔记

23 阅读2分钟

这是我参与「第五届青训营 」伴学笔记创作活动的第 1 天 什么是前端?

  • 解决GUI人机交互问题

  • 跨终端

    • PC/移动浏览器
    • 客户端/小程序
    • VR/AR等
  • Web技术栈

前端工程师:使用web技术栈,解决多端图形界面人机交互问题的工程师

前端主要的技术分为三层,最基础的是HTML(负责页面结构内容),

页面中使用CSS来设置页面的样式(位置大小颜色),

使用JavaScript来定义网页的行为(响应),HTML,CSS,JavaScript都是运行在浏览器里面的,浏览器通过http协议和服务器进行通信

image.png 前端要解决图形界面下的人机交互问题

前端应该关注到哪些方面?

  • 功能,解决问题,满足用户需求
  • 美观,界面
  • 无障碍,残疾患者
  • 安全,用户数据,漏洞
  • 性能,速度,动画流畅,用户体验
  • 兼容性,各种设备上正常使用
  • 体验

前端的边界?

现在前端能做的东西已经远远超过的页面这样一个简单的范畴

比如说可以用nodejs开发服务器端的这样一个应用

用electron或者reactnative开发客户端的应用

webrtc实现在线传输,多人会议

webgl开发流畅的3D游戏。。。

开发环境

HTML是什么? HyperText Markup Language

HyperText:超文本,不是简单的纯文字的东西,可以包含图片,标题,链接,表格等

markup language 标记语言

也可以在标签上去设置一些属性

image.png 浏览器拿到html代码后会进行解析,形成DOM树,每一个结点叫做DOM结点

image.png 谁在用我们写的HTML

开发者-修改,维护页面

浏览器-展示页面

搜索引擎-提取关键词,排序

屏幕阅读器-给盲人读页面内容

HTML传达的是内容,而不是样式

image.png

image.png 标题h1-h6六级标题

image.png

链接

image.png