每月 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 歲的女性，她告訴所有知名和有影響力的人，她不關心金錢，以及為什麼我們需要從她的角度看待氣候變化——她的生活處於危險之中，沒有錢可以挽救它。 我們需要更多像她這樣不受公司或財務規則支配的人。