Kiedy projektuję stronę internetową, skąd mam wiedzieć, jak użytkownicy widzą kolory?


11

Kiedy projektuję stronę internetową, skąd mam wiedzieć, jak użytkownicy widzą kolory? Widzę kolory witryny inaczej niż na moim Macbooku i komputerze stacjonarnym / notebooku z systemem Windows. Szczególnie nie widzę jasnych kolorów na pulpicie, np. Szare obramowania stołów są niewidoczne.

O co powinienem dbać przy projektowaniu? Czy jestem w stanie sprawić, że wszystkie ekrany będą bardzo podobne dzięki rozwiązaniu do projektowania?



1
Żeby dodać zamieszanie, prawie 10% ludzi jest ślepych na kolory - ale przynajmniej dzięki temu istnieją rozszerzenia dla Chrome, które pozwalają (zakładając, że nie jesteś) zobaczyć z grubsza, jak to będzie wyglądać dla kogoś, kto jest ...
Rycochet,

... a na poziomie przedsiębiorstwa gamma / kontrast + inne ustawienia ekranu mogą być wszędzie na monitorach w biurze (twoim kliencie), gdy są konfigurowane przez IT, który często używa zdalnego dostępu i ustawień grupowych do kontrolowania sieci komputerowych. W mojej ostatniej firmie dział informatyki znajdował się w innym kraju, z niewielką sympatią do projektowania - uzyskałem dostęp administratora i dodałem własny monitor i konfigurację! Praca według standardów i unikanie skrajności jest najlepszym podejściem, biorąc pod uwagę, że niektórzy klienci (np. Rząd) będą mieli ścisłą dostępność - poproś o to z góry, aby uniknąć niepotrzebnych zmian
Applefanboy

Odpowiedzi:


23

Krótka odpowiedź: nie.

Dłuższa odpowiedź: dosłownie niemożliwe jest uwzględnienie wszystkich ustawień i kalibracji ekranu, okoliczności i zdolności wizualnych (nie) widzów. Dlatego istnieją wytyczne dotyczące na przykład kontrastu tekstu i tła, aby zagwarantować użyteczność w co najmniej większości przypadków.

Mój osobisty przepływ pracy obejmuje co najmniej dwa nieskalibrowane monitory i niektóre testy na różnych urządzeniach mobilnych w różnych sytuacjach oświetleniowych.

W3C opracował kilka wskazówek dotyczących użycia koloru i niezbędnego kontrastu, które można przeczytać tutaj . Osobiście używam tego narzędzia do kontrastu w tekście Lei Verou, aby sprawdzić, czy moje kolory tekstu są zgodne z wytycznymi lub są co najmniej bliskie.


8
Zastanawiam się, czy ludzie z SE czytają te wytyczne. Mam całkiem dobrą wizję, ale kontrast między tłem a kolorem podświetlenia linku na wielu stronach SE (w tym tej) jest słaby.
Barmar

1
Chciałbym móc to głosować więcej niż raz! Ja sam używam rozszerzenia przeglądarki ciemnego czytnika, więc bez względu na to, jak ładna jest twoja strona, całkowicie zniszczę to tylko dlatego, że mam pięćdziesiąt lat!
PieBie

Według tej witryny webaim.org/resources/contrastchecker kontrast kolorów między tłem a linkami nie spełnia standardów dostępności w tej witrynie SE. Prawdopodobnie więc bezpiecznie założyć, że ludzie z SE nie czytają takich wytycznych.
ESR

2

Nie robisz tego i nie możesz kontrolować ani egzekwować tych samych ustawień na monitorze / urządzeniu każdego użytkownika. Najlepsze, co możesz zrobić, to użyć profilu kolorów sRGB podczas eksportowania obrazów rastrowych do Internetu.

sRGB to światowa standardowa przestrzeń kolorów do reprodukcji kolorów w Internecie.

Pomoże to do pewnego stopnia, ale ostatecznie to preferencje użytkownika decydują o sposobie wyświetlania obrazów na jego urządzeniu. Oczywiście dotyczy to obrazów rastrowych, a nie innych elementów graficznych na stronie.


I skalibruj swoje wyświetlacze do sRGB, tak aby przynajmniej pokazywały twoje wyświetlacze
joojaa

Komentarze nie są przeznaczone do rozszerzonej dyskusji; ta rozmowa została przeniesiona do czatu .
Vincent

1

Współczesne przeglądarki i komputery rzadko mają problemy z wyświetlaniem prawidłowych kolorów (więcej informacji na ten temat można znaleźć na stronie https://websafecolors.info/learn ).

Wygląda na to, że same wyświetlacze sprawiają, że kolory wyglądają inaczej. Może to wynikać z ustawień jasności monitora, kontrastu i poziomu niebieskiego światła, a nawet z samej technologii monitora, takiej jak LED i rodzaj panelu. Nie ma sposobu na wymuszenie spójnych ustawień na różnych wyświetlaczach, a nawet na odczytanie ich ustawień i dostosowanie strony internetowej.

Polecam użycie Inspect Element i sprawdzenie kodu szesnastkowego kolorów na każdej platformie. Jeśli są identyczne, to wiesz, że to wyświetlacze. Rozwiązaniem będzie użycie kolorów o większym kontraście, aby mieli większą szansę wyróżnienia się na wszystkich ekranach. Możesz też wypróbować grubsze obramowania, a nawet wyściełane stoły bez obramowania! Większość użytkowników ma ekrany o wysokiej rozdzielczości, które otwierają wiele możliwości projektowania tabel, które zwykle wykorzystują tekst i formatowanie o grubości jednego piksela.


0

Odpowiedź brzmi nie, ponieważ kolor laptopa i kolor pulpitu nie są takie same dla każdego komputera. Możesz użyć kodu koloru, jeśli chcesz się upewnić, że kolor jest taki sam, na przykład możesz wpisać ten kod w css:

background-color: #D2B48C

2
Cześć Sally, naprawiłem czcionkę w twojej odpowiedzi, ale nie wiem dokładnie, jak to jest odpowiedź na pytanie. Czy mógłbyś opracować?
PieBie

To nie rozwiązuje rzeczywistego problemu. Problem polega na tym #D2B48C , że będą wyglądać inaczej na różnych monitorach, a pytanie brzmi, jak to rozwiązać.
rura
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.