每月 Web 开发更新 2⁄2019：Web 身份验证和 UX 问题

已发表: 2022-03-10
快速总结 ↬浏览器新闻、宝贵的经验教训、最佳实践、鼓舞人心的编码实验。 在他的每月阅读清单中，Anselm Hannemann 总结了过去几周 Web 开发领域发生的最重要的事情。

他们说，生活中唯一不变的就是变化。 这是真的，即使我们认为没有任何改变。 你是否注意到变化只是你如何感知和如何观察事物的问题。 在科技行业，很容易看出事情发展的速度有多快——阅读一篇像这样的总结文章，你会突然意识到在短短一个月内发生了多少事情。 自从我再次开始冥想，我获得了一个新的视角，它帮助我有意识地欣赏这种变化，并在起初看起来并不特别积极的事情中找到个人价值和感激之情。

以本周为例。 我想起了我们通常忘记的一个事实：互联网的结构。 如果你浏览网页，大多数流量在某个时候都是通过亚马逊引导的，所以如果你屏蔽他们的服务器——或者谷歌或苹果的服务器，或者所有这些——，互联网就没有多少了。 我已经在我的网络中使用了 Pi-Hole DNS 拦截器三年了，但从未真正欣赏过它，直到我本周了解了它的真正价值——考虑到我们对科技巨头的依赖，它提供的安全性和隐私性。 我认为在线安全的很大一部分依赖于作者花费大量时间和精力最终免费提供的开源软件，这不是很了不起吗？

消息

  • Firefox 65 发布。 新版本在disabled的 HTML 元素上调度事件，并支持script元素上的referrerpolicy属性、CSS 环境变量（ env()函数）、用于 JavaScript 的Intl.RelativeTimeFormat和 WebP 图像。
  • Safari Tech Preview 74 带来了可中止的fetch 、对 macOS 上的 U2F HID 身份验证器的支持以及新的 Web 身份验证 API 功能。
  • 在 Chrome 72 中，Chrome 引入了用户激活 API。 新版本还禁止在pageunload上弹出窗口。
  • 适用于 Android 的 Chrome 72 更新提供了期待已久的 Trusted Web Activity 功能，这意味着我们现在可以在 Google Play 商店中分发 PWA。
  • Safari 12.1 发行说明已发布（iOS 12.2、macOS 10.14.4）。 什么是新的？ Web 的黑暗模式、智能跟踪预防、macOS 上 Safari 的推送通知提示现在需要在 iOS 上进行用户手势、动作和方向设置才能启用DeviceMotionEvent和DeviceOrientationEvent （这意味着它现在默认禁用）。 Intersection Observer API、Web Share API 和<datalist>元素也是新的。
跳跃后更多！ 继续往下看↓

一般的

  • Max Bock 分享了他关于为什么简单是项目中最有价值和最重要的事情的想法。
  • Ian Littman 在 Twitter 上表示：“将 50% 的服务器从 PHP 5 迁移到 PHP 7 每年将节省 2.5 美元（编辑为 2.0）十亿美元的能源成本，并避免数十亿公斤的二氧化碳排放。 升级到 PHP 7。拯救地球。”
  • 您是如何开始学习 Web 开发的？ 我想我们大多数人都依赖于浏览器的“查看源代码”功能，并且仍然如此。 但是随着 JavaScript SPA 和更多的工具可以破坏、缩小和丑化源代码，我们阻碍了无数人的自我教育之路。 让我们转向更开放的方法，至少在生产服务器上提供源映射，以便人们可以通过开发工具访问实际源。

用户界面/用户体验

  • 好的数字产品和出色的数字产品之间的区别是什么？ 两个字母：UX。 用户体验设计。 但这有一个根本问题。 Johannes Ippen 关于为什么我们应该看到人类而不是用户。
  • 这是对过去十年流行网站如何变化的一个很好的总结——包括谷歌、YouTube、亚马逊、Facebook、苹果和易趣。 您可以清楚地看到我们今天处于不同的时代。
  • Colin Eagan 总结了我们必须为用户个性化 Web 体验的数十种可能性，以及哪些可行，哪些不可行。 他最后提出了一条有价值的建议：无论公司及其团队多么精通技术，都要从简单开始，而不是追随复杂的崇拜。
一张脸的草图，其中包含“看、说和做”、“听”、“想”和“感觉”等术语
为了创造出色的用户体验，我们需要将用户视为人类。 （图片来源）

HTML 和 SVG

  • Sara Soueidan 编写了关于 SVG 滤镜的 101 门课程，以帮助您了解它们是什么以及如何使用它们来创建自己的视觉效果。

可访问性

  • Rob Dodson 分享了关于如何构建更好的可访问性原语的精彩总结。

隐私

  • 谷歌是那些总能找到新的、聪明的方法来公开用户位置数据并将其出售给第三方的公司之一。 例如，现在谷歌希望出售用户的确切位置数据，以改善城市规划者的规划。 一方面很有用，但仍然让所有可能不知道他们的数据发生了什么的谷歌产品用户感到担忧。
  • “我对 Google 和 Facebook 的看法是错误的：它们没有任何问题（我们都这么说），”Aral Balkan 说。 这篇文章解释了即使是最光荣的开源项目也如何努力做出符合道德的选择，以及提供最佳用户体验而不是促进符合道德的解决方案的谬误。

网络性能

  • Jens Oliver Meiert 分享了他关于编写 HTML 的方式如何影响性能的研究。 即使我们能够使用 gzip 或其他技术来优化浏览器中的文档响应，省略可选的标签和引号也会产生影响。

JavaScript

  • 由于大多数数据泄露是由于密码弱且重复使用而发生的，因此 Web 身份验证是当今的热门话题。 新的 Web 身份验证指南是一个很好的例子，说明安全实施指南也可以很漂亮。
  • Mathias Schafer 总结了他在长期项目中维护大型 JS 代码库的经验教训。
  • Axel Rauschmayer 博士描述了 JavaScript 中仍然缺少的内容以及将来可以实现的内容。
  • Intersection Observer 登陆 WebKit，Webkit 团队为它写了一篇很有帮助的教程。
摘自指南。它展示了一个小女人的插图，她试图阻止一大堆钥匙翻倒。
Web 身份验证指南是对在线保护敏感信息的便捷介绍。 （图片来源）

CSS

  • Rik Schennink 解释了如何使用智能 CSS 根据用户滚动位置应用样式。
  • 令人难以置信的是，Fabricius Seifert 是如何用纯 CSS 制作这个太阳系 3D 动画的。
  • Preethi Sam 解释了如何使用鲜为人知的 CSS element()函数来创建小地图导航器。
  • Roman Komarov 分享了他使用可选侧边栏实现灵活博客布局的方法。 使用 CSS 网格和自定义属性制作。
用 CSS 构建的太阳能系统
在 Fabricius Seifert 精彩的 CSS 实验中探索太阳系。 （图片来源）

工作生活

  • 保罗格林伯格正在寻找失去的屏幕时间，并探索我们的生活会是什么样子，以及如果我们逃离屏幕，我们还有多少时间。 文章中有一些具有启发性的数字：美国人平均每十年在智能手机上花费 14,000 美元。 在平均工作寿命的过程中，这是 70,000 美元。 超过 29% 的美国人宁愿在三个月内放弃性生活，也不愿在一周内放弃智能手机。 或者，您可以种植 150 棵树，并用每年在智能手机和应用程序上花费的钱购买半英亩的土地。
  • 你是一个有耐心的人吗？ 不管你是不是，Jason Fried 想尝试的实验肯定是一个挑战：尝试在超市选择最长的队伍，取消 Amazon Prime 以延长交货时间，并尽可能抓住机会等待。 拥抱缓慢。
  • “赞美极端中庸”分享了一个有趣的观点，即为什么在生活的各个领域过度投入、过度工作和过度交付的文化是不健康的，以及我们如何才能转向更温和、更平静的道路.

超越……

  • “它必须是免费的。” 关于我们显然不需要但想要拥有的服务。 我的文章是关于在我们真正需要的东西中看到价值的重要性以及为什么少即是多。
  • 我们怎样才能让我们的生活更美好？ 埃里克·巴克说，通过维持重要的关系、避免技术、接受价值观而不是生活小窍门。
  • 观看 Greta Thunberg 的演讲，她是一位 16 岁的女性，她告诉所有知名和有影响力的人，她不关心金钱，以及为什么我们需要从她的角度看待气候变化——她的生活处于危险之中，没有钱可以挽救它。 我们需要更多像她这样不受公司或财务规则支配的人。