前端与HTML | 青训营

45 阅读2分钟

今天为青训营的第二讲——前端与HTML。本节课程围绕“前端要解决的基本问题”及“什么是 HTML ”两个基本问题展开,层层解析前端技术栈的构成,以及作为前端最为基础的技术 —— HTML 基础语法和基本功能,在实际研发过程中如何做到 HTML 语义化?由此分为四个部分展开,分别是1、前端工作的定义;2、前端技术栈拆解与分析;3、HTML 作用解析;4、HTML 语义化。 首先先讲讲前端,前端能解决GUI人机交互问题,能跨终端(例如PC/移动浏览器,客户端/小程序,VR/AR等),能实现Web技术栈,而前端技术栈即服务器端与Javascript(行为),CSS(样式),HTML(内容)通过网络协议连接在一起。 前端需要做到多方位让使用者舒适,由此前端要注意的方面很多,像功能、美观、安全、性能、无障碍、兼容、体验等等,而其边界及开发环境很广也很普遍。 接着讲讲HTML的用法,先举个例子,,其中src就是属性名,而photo.jpg则是属性值,然后便举出了构建一个页面的例子,如下:

页面标题

一级标题

段落内容

甚至讲解了HTML的语法:1、标签和属性不区分大小写,推荐小写;2、空标签可以不闭合,比如input、meta;3、属性值推荐用双引号包裹;3、某些属性值可以省略,比如required、readonly,除此之外还讲解了怎样引用链接。 最后提到了HTML的语义化,那么什么是语义化呢?HTML中的元素、属性及属性值都拥有某些含义,而开发者应该遵循语义来编写HTML,即有序列表用ol,无序用ul;lang属性表示内容所使用的语言,开发者可经过了解每个标签和属性的含义,思考什么标签最适合描述这个内容,并不使用可视化工具生成代码,而经过语义化可实现代码的可读性,可维护性,搜索引擎优化,提升无障碍性。 经过这节课的学习,我学到了如何使用HTML,并且如何写出一个页面,了解到了HTML的基本语法及功能,实现HTML语义化。