深色模式到來了!

深色模式 Beta 功能的圖像,設計者為 Justin Scherer (WMF)

當我們在晚上的時候,維基百科的白色背景讓我們眼花撩亂,很不舒服。我建議使用者可以切換夜間模式,或至少選擇較深的顏色。這同時可用於行動版。VictorPines, 2017

某種可切換的深色或夜間模式。這將成為每個人都最容易訪問的功能——而不僅僅是已登入用戶的新背景顏色。Premeditated Chaos, 2018

維基媒體專案的顏色為白色或接近白色,長時間觀看會對眼睛造成傷害,並且會消耗筆記型電腦更多的能量。David L, 2021

請添加深色模式!! –Crenshire, 2023

維基媒體基金會已經看到了許多這樣的要求。深色模式在維基百科的行動應用程式中可用,但在網頁瀏覽器中仍未能使用。這同時編輯們在「社群願望清單調查」「Vector 2022 皮膚」推廣活動中提出的共同要求——我們收到了數以百計的評論!我們在此一併向各位表示感謝。

前段時間,一些維基媒體基金會工作人員 Volker、Alex、Carolyn 和 MusikAnimal 構建了一個深色模式腳本作為實驗。這已成為不同維基專案上的流行小工具——但是直到今年我們還是未能讓深色模式成為介面的常規部分。現在在社群的幫助下,我們終於準備好開發此功能了!請繼續閱讀以了解深色模式的好處、其實現原則,以及如何參與其中。

為什麼選擇深色模式?

深色模式提高了網站的可訪問性——主要好處是這可以減輕眼睛疲勞。當我們進行長時間的閱讀或編輯時——尤其是當我們周圍環境黑暗時,明亮的螢幕與周圍黑暗之間的對比可能會引起不適。深色模式透過為我們提供較暗的背景和淺色文字來緩解這種情況,減少眩光並最大限度地減少眼睛疲勞。此功能對於夜間讀者或在設備上花費大量時間的讀者特別有用。

許多讀者和編輯都喜歡深色模式。較暗和較柔和的色調可以減少對眼睛的刺激,營造更輕鬆的閱讀環境,增強閱讀體驗。

陰影中的光芒, Andrés Nieto Porras

是什麼讓建構深色模式成為可能?

過去,我們無法根據未有登入的用戶偏好來更改我們的網路介面。這些使用者無法設定首選頁面密度、變更字體大小或設定深色模式。此外,MediaWiki 皮膚和設計架構使得維護兩種配色方案(淺色和深色)變得困難。我們首先要改善這三個面向。

  • 我們從改進皮膚架構開始——我們在建立 Vector 2022 時就這樣做了。這為進一步的介面變更奠定了基礎。
  • 接下來,設計系統團隊 介紹了Codex 及其「設計象徵」。這些都是有用的變量,就像維基百科上的模板一樣,允許我們制定和集中顏色定義。
  • 最後,我們新增了為未有登入的用戶提供首選項的功能。在開發 Vector 2022 時,我們建立了一個更改內容區域寬度的切換開關。在聽取了編輯的意見和一些創造性思維後,我們同時將其提供給未有登入的用戶。接下來,我們的工程師和建築師創建了一個更廣泛的系統,使我們能夠進行更多可自訂的設置。

有了這個系統,我們就可以開始規劃無障礙閱讀計畫了。這是我們對使用者舒適地閱讀維基和調整設定的需求的回應。第一步,已登入和未有登入的使用者將能夠選擇不同的字體大小和文字密度——接下來將是深色模式。

如何參與?一起參與——但具體是如何參與其中?

編輯者控制的內容包括範本:文章訊息框、資訊框、導覽框,以及點陣圖、時間軸、表格等等。其中一些,例如天氣和運動表,以有意義或語義的方式使用顏色。簡單地反轉這些顏色會立即失去它們的意義。我們需要尋找其他選擇。

Buenos Aires, de.wikipedia.org

無論我們選擇什麼技術方法,我們都會與編輯協調。我們可以為大小社群建立不同的解決方案。在接下來的幾週內,我們將提出具體問題和想法。

我們希望以有限數量的社群和維基專案逐步開始。首先,深色模式將是測試版功能。因此,這僅適用於決定啟用模式的已登入使用者。當我們建立最終版本時,任何登入使用者都將有機會與我們一起進行測試。

我們將與介面管理員、範本和模組維護者以及有興趣使維基專案更易於每個人閱讀的編輯進行交談。我們希望與他們一起提出建議,使頁面對深色模式更加友善。我們同時將幫助他們調整維基專案上的當前程式代碼。當足夠多的頁面變得適合深色模式時,我們將為未有登入的用戶推出深色模式。(順便說一句,我們不確定多少頁才足夠。我們將會詢問這個問題!)

您對這一切感覺如何?請在我們的專案討論頁面上分享您的想法。請務必訂閱網路團隊時事通訊訂閱網路團隊時事通訊,以免錯過我們的更新資訊。謝謝你!