缓慢运动

曾经，我被网络技术的飞速发展搞得晕头转向。似乎每天都有新的插件、框架、技术或语言特性发布。我坚信，为了生存，为了在自由职业者中竞争，我必须学习所有其他人擅长的东西：Webpack、React、Angular、SVGs、Houdini、CSS Grid布局、ES6，等等。活跃在Twitter上和参加各种会议并没有帮助我解决这个问题，因为我不断地接触到所有新事物。

放慢脚步

在某个时刻，我放弃了。我决定自己无法跟上节奏。从职业角度来看，这并没有改变我的任何现状，因为实际上，没有人期望我无所不知，而我之前的这种感觉仅仅存在于我的个人认知中。放慢速度是一个明智的决定，因为它不仅减轻了我的精神压力，也帮助我专注于自己真正想学习的东西。我仍然阅读新闻通讯、博客和Twitter，仍然会偶尔花些时间尝试新事物，但我不会给自己施加压力。我努力保持最新状态，但我并不觉得有必要掌握所有知识。

过去几年里，我一直就是这样处理网络技术发展的，但最近，尤其是在今年，我学习到了一些新的东西。它不是一个框架或语言——而是一种洞察力，即在我们对创新和进步的渴望中，我们忽略了利用HTML、CSS和JavaScript今天提供的众多功能。换句话说：如果我们回顾过去而不是展望未来，我们可以学习到很多东西。

别追逐瀑布

我说这是忽略，是因为我相信在我们认为自己了解的前端语言知识和我们实际应该了解的知识之间存在着巨大的差距。

HTML

检查网站并评估其前端质量是我的工作和爱好的一部分。我查看过许多网站的底层代码，我只能证实网络无障碍专家每天都在宣扬的内容：大多数HTML文档都处于糟糕的状态。如果你不相信我，看看这些数据：

• 前1,000,000个主页中，有98.1%都存在可检测到的WCAG 2错误。
• 数千个网站包含<h7></h7>和<h8></h8>元素。
• 在标题和元数据之后，div是最流行的元素。
• 平均而言，我们只使用了110多个可用元素中的大约30个。

了解HTML语法和知道如何正确使用它之间存在着巨大的差异。在编写结构良好、语义化的HTML文档方面，我们都可以进行一些复习。2020年，我花了很多时间学习HTML，我希望我构建的网站用户能够从我的见解中受益。

我在2020年学习到的关于HTML的两件我最喜欢的事情：

你可以通过在download属性中定义一个值来更改可下载文件的名称。

<a download="report.pdf" href="https://www.php.cn/link/4bf2689c42aae35e6924a432e435e0b1">Download (2MB)</a>

你可以使用value属性来更改有序列表中的编号。

<ol>
<li value="3">C</li>
  <li value="2">B</li>
  <li value="1">A</li>
</ol>

CSS

几乎每次我在MDN或CSS-Tricks上查找CSS属性时，我都会发现一些新的东西。自己试试看。搜索margin、list-style-type或color。我相信你会学到一些东西。

我在2020年学习到的关于CSS的内容列表很长，以下是我最喜欢的两点。

你可以使用url()函数作为content属性的值（的一部分）。

div::before {
  content: url('marker-icon.png');
}

你可以在CSS中实现原生平滑滚动。

/* 仅当用户不偏好减少运动时才动画滚动 */
@media (prefers-reduced-motion: no-preference) {
  html {
    scroll-behavior: smooth;
  }

  /* 在目标和视口顶部之间添加一些间距 */
  :target {
    scroll-margin-top: 0.8em;
  }
}

JavaScript

我经常编写JavaScript，但它不是我的核心优势，所以我一直在学习关于它的新知识。以下是今年我最喜欢的两点：

你可以使用nomodule属性来仅在不支持JavaScript模块的浏览器中运行JavaScript代码。

// nomodule.js
  console.log('This browser doesn’t support JS Modules.');

// module.js
  console.log('This browser supports JS Modules.');

结论

HTML是每个网站的支柱；知道如何编写语义化的文档应该是每个Web开发人员的首要任务。CSS在某种程度上非常复杂，为了学习新的概念，我们必须理解它们与旧技术的比较，以及它们解决的问题。JavaScript框架和库层出不穷，但它们都有一个共同点，那就是它们是用原生JavaScript编写的。

在2020年，我重新学习了我已经忘记的东西，并发现了关于已建立的元素和属性的新知识。如果你只去寻找，就会发现很多隐藏的知识。我将在2021年进一步扩展这个话题，因为还有很多很棒的东西值得探索。

以上是缓慢运动的详细内容。更多信息请关注PHP中文网其他相关文章！