前端与 HTML | 青训营笔记

311 阅读2分钟

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

今天老师带我重新思考了一次前端工程师的职责范围

那么再问一次,什么是前端?

用老师总结的一句话来说:前端工程师是使用web技术栈解决多端图形用户页面交互问题的工程师。

不管是移动应用、小程序还是web网页,都是前端工程师的专业领域,使用一系列web技术栈去解决图形用户页面交互问题

到这里我就想到了跨端技术,用跨端来打通平台,用通用技术去解决多端的用户界面交互一定是一件优雅又高效的解决方案。

于是:我搜索了一些相关的跨端技术,有flutter、uni-app这两个给了我很大的吸引力,flutter的开发速度的默认样式的精美程度惊艳到了我,uni-app的跨端数量也让我大为震惊(兼容性方面有很多的优化空间)但这是一个不错方向

今天虽然是学习的HTML,对之前学过的HTML做了一些复习,但是今天的课程的其他部分引发了我的一些思考,让我对后续的学习安排找到了兴趣的方向。

HTML学习中,让我反思之前代码不规范的严重性,div不能是一个万能的百宝盒,HTML5中了有很多特定含义的div标签,我们应该使用nav、header、footer等标签使页面更具语义化,阅读起来代码结构也更加清晰。

类似的情形还有,无序列表用ul和有序列表ol,尽可能的用贴近的语义化标记与描述页面的结构。

今天还复习到一个很重要的知识点,但是我几乎没有重视的标签meta标签

<meta>:元数据标签

作用 说明文档、描述数据的标签

meta标签分为三类: charset/name/http-equiv

meta标签的组成

  meta标签的作用取决于我们为它定义的属性和属性值。

  name:把content属性连接到某个名称。

  content:定义与 http-equiv 或 name 属性相关的信息。

  http-equiv:把content属性关联到http头部。

  charset:定义文档的字符编码。

seo优化

  从前端的角度做seo优化基本就是在meta标签中定义两个部分的内容

  页面关键词(keywords):每个网页都应该有一组描述网页内容的关键词,这些关键词是提供给搜索引擎进行搜索匹配的。

  页面描述(description):对网页内容的描述,不超过150个字符。这个部分会被搜索引擎抓出来作为网站概要显示出来。