Chrome i Firefox "powiedzą" stronom o ciemnym motywie

Ciemny interfejs na dobre zadomowił się w popularnych przeglądarkach stron internetowych, a niebawem autorzy stron będą mogli dopasować ich wygląd do motywu systemu. Google Chrome i Firefox niebawem pozwolą stronom pytać o ciemny lub jasny motyw, Apple Safari już to umożliwia.

Chrome i Firefox "powiedzą" stronom o ciemnym motywieChrome i Firefox "powiedzą" stronom o ciemnym motywie

Zapytanie o to, czy włączony jest ciemny motyw systemu, odbywa się za pomocą arkusza CSS. Zapytanie Media Query z właściwością prefers-color-scheme da stronie znać, czy przeglądarka preferuje motyw ciemny, jasny, czy nie ma to znaczenia. W ten sposób strona otrzyma informację o tym, jaki typ interfejsu jest włączony w systemie i będzie mogła się do niego dopasować.

Oto przykład stylu CSS, podany przez Mozillę:


.day   { background: #eee; color: black; }
.night { background: #333; color: white; }

@media (prefers-color-scheme: dark) {
  .day.dark-scheme   { background:  #333; color: white; }
  .night.dark-scheme { background: black; color:  #ddd; }
}

@media (prefers-color-scheme: light) {
  .day.light-scheme   { background: white; color:  #555; }
  .night.light-scheme { background:  #eee; color: black; }
}

W ten sposób można dopasować kolorystykę stron, zmienić grafiki i wiele innych elementów.

Chrome 76, Firefox 67, Safari 12.1

Kiedy skorzystamy z możliwości dopasowania strony do dziennego lub nocnego interfejsu systemu? Użytkownicy Apple Safari na systemie macOS mogą korzystać z tej funkcji od końca marca. W Chromie pojawi się ona w wersji 76, obecnie dostępnej w kanale Canary. Po jej wydaniu obsługa zapytania trafi też do krewniaków Chrome'a, jak Opera, Vivaldi czy Yandex.Browser.

Firefox wprowadzi obsługę zapytania w wersji 67, której wydanie zostało zaplanowane na 14 maja. Mozilla jest więc trochę szybsza od Google'a.

Oczywiście prawidłowa obsługa tego zapytania zależy także od autorów stron. Na marginesie dodam, że na dobrychprogramach możecie przełączyć tryb dzienny i nocny ręcznie. Przełącznik znajduje się na dole strony, obok przycisku zmieniającego wersję mobilną na desktopową. Którą wersję wolicie?

[h2]Czy to już Fingerprinting?[/h2]Możliwość sprawdzenia ustawień systemu w ten sposób budzi obawy o zachowanie prywatności. Taki parametr może zostać potraktowany jako część Fingerprintingu, czyli tworzenia unikatowego identyfikatora przeglądarki. Być może producenci przeglądarek powinni zaimplementować możliwość wyłączenia obsługi tego zapytania. W tym świetle możliwość ręcznego przestawiania trybu strony w jej ustawieniach nie jest wcale złym pomysłem.

Źródło artykułu: www.dobreprogramy.pl
Wybrane dla Ciebie
Ministerstwo Cyfryzacji zachwala mSzyfr. Nowy, bezpieczny komunikator
Ministerstwo Cyfryzacji zachwala mSzyfr. Nowy, bezpieczny komunikator
Komunikat Pekao S.A. Dotyczy wszystkich klientów
Komunikat Pekao S.A. Dotyczy wszystkich klientów
Copilot znika. Microsoft wycofuje się z agresywnej promocji
Copilot znika. Microsoft wycofuje się z agresywnej promocji
Santander Bank Polska zmienia nazwę. Będzie nowy adres WWW
Santander Bank Polska zmienia nazwę. Będzie nowy adres WWW
Masz mObywatela? Niektóre funkcje będą niedostępne
Masz mObywatela? Niektóre funkcje będą niedostępne
Awaria w Alior Banku. Nie działa aplikacja (aktualizaja)
Awaria w Alior Banku. Nie działa aplikacja (aktualizaja)
Ostrzeżenie CERT Orange. "Karta SIM wymaga aktualizacji"
Ostrzeżenie CERT Orange. "Karta SIM wymaga aktualizacji"
Koniec Messenger.com. Wszystko, co musisz wiedzieć
Koniec Messenger.com. Wszystko, co musisz wiedzieć
Microsoft potwierdza: Windows 11 przyspieszy
Microsoft potwierdza: Windows 11 przyspieszy
ProgramData - co to jest i czy można tam sprzątać?
ProgramData - co to jest i czy można tam sprzątać?
Używasz mObywatela? Koniecznie zapisz ten numer telefonu
Używasz mObywatela? Koniecznie zapisz ten numer telefonu
Skyscanner trafił do ChatGPT. Lotów można szukać zwykłą rozmową
Skyscanner trafił do ChatGPT. Lotów można szukać zwykłą rozmową
ZANIM WYJDZIESZ... NIE PRZEGAP TEGO, CO CZYTAJĄ INNI! 👇