Mała czarna, w której każda kobieta wygląda dobrze niezależnie od okazji (no… może jest kilka wyjątków) to bezpieczna klasyka mody. Design internetowy też ma swoją “małą czarną”, tyle, że jest to “mała biała”- czyli spora dawka białego tła z ciemnym tekstem i urozmaicającymi detalami.
W rzeczywistości takie rozwiązanie najlepiej sprawdza się dla stron informacyjnych, z dużą ilością tekstu. Z oczywistego powodu – ułatwia czytanie. Dodatkowo, w dzisiejszych czasach, kiedy królują monitory LCD – podobno oszczędzamy energię, nie wspominając już o dodatkowych atutach estetycznych czyli czystości i stylu grafiki biznesowej.
Czytelność tekstu w internecie
W przypadku tekstu drukowanego, w normalnych warunkach, druk biały na czarnym tle jest znacznie mniej czytelny niż czarny na tle białym, który – jak wykazały badania – czyta się od 10 do 40% szybciej. Ponadto, oko wykonuje więcej fiksacji podczas czytania druku białego niż podczas czytania druku czarnego.
Badania takie przedstawia między innymi Zachrisson Bror w swoim opracowaniu “Studia nad czytelnością druku” (Zachrisson Bror, Studia nad czytelnością druku, Warszawa, Wydawnictwa Naukowo-Techniczne 1970 ). Dodatkowo zmniejszenie kontrastu między tekstem a tłem powinno pozytywnie wpłynąć na poprawę czytelności. Bror zauważył, że stare książki, z pożółkłymi stronami, czytane są nieco szybciej niż te, które zostały właśnie wydrukowane na białym papierze.
W oparciu o te wnioski powstała praca magisterska Adama Sydora, która analizuje jak wyniki badań Brora nad tekstem drukowanym mają się do czytelności w internecie (Sydor A., Pismo — 6000 lat ewolucji. Rola we współczesnym świecie,Uniwersytet Zielonogórski 2005, praca magisterska). Otrzymujemy tutaj wniosek, że w przeciwieństwie do druku, zmniejszenie kontrastu między tłem i znakiem ujemnie wpływa na czytelność tekstu. Najlepiej odczytywany jest tekst złożony krojem zoptymalizowanym do wyświetlania na ekranie monitora (jak Verdana) z dużym kontrastem między znakiem i tłem. Wyniki badań w tej pracy wykazują, że ingerencje w znak – włączenie kontroli kerningu, wygładzanie krawędzi czy zmiana kontrastu między znakami a tłem zamiast podnosić, wpływają na czytelność negatywnie. Wydaje się, że jest to spowodowane rozmyciem znaku. Dodatkowo zmniejszenie kontrastu między znakiem i tłem jeszcze bardziej wzmaga rozmycie znaków na monitorze, przez co stają się one gorzej rozpoznawalne.
Badanie przeprowadzone na grupie 78 osób, przy tekstach złożonych ze 180 wyrazów każdy, dało poniższe, uogólnione wyniki dla osób często czytających z ekranu:
co daje prawie 10% przewagi dla tekstów zamieszczanych na białym tle w stosunku do kremowego koloru tła.
Szybki test na czytelność tekstu na czarnym lub białym tle można przeprowadzić tutaj. Polecam przeczytanie pełnego opisu (chociaż łatwe to nie jest)… Na mnie faktycznie “duchy linii” działają :-).
Oszczędność energii???
W czasach panowania monitorów CRT ciemne tło pulpitu gwarantowało niższe zużycie energii elektrycznej i wolniejsze zużywanie się luminoforu. Pewnie miało to także swój wpływ na styl stron internetowych i dominujące, ciemne kolory tła.
Na szczęście wylała “fala bieli” zanim jeszcze PC WORLD przeprowadziło badania, które o dziwo dowiodły, że dla monitorów LCD korzystniejsze jest jasne tło. Choć w rzeczywistości różnice wartości poboru mocy są naprawdę minimalne.
Wystarczy posłuchać głosów jakie podniosły się po ukazaniu tego artykułu:
songrochu: Przyznaje, zaintrygowało mnie to bo myślałem zawsze odwrotnie, więc wyciągnąłem z szafy miernik, podłączyłem między listwą i monitorem i…racja. Włączałem w Ntest aple różnych kolorów i fakt przy jaśniejszych wychodzi mniej prądu.Jednakże te różnice są znikome. Biała apla ~35W, ciemne lub czarne ~37W. Różnice są na poziomie 1-2W. Testowane na 22calowym monitorze HP w2207h.
Uff, czyli nie musimy jednak przy projektowaniu popadać w technologiczną paranoję, ale przy dużej ilości tekstów warto stawiać na ich czytelność, czyli białe tło rulezzz.
Poniżej kilka przykładów:
Bell
Strona, która niezmiennie zachwyca mnie czystością I prostotą.
Apple
Światowy potentat. Klasy designu zazdroszczą mu chyba wszyscy.
Brio
Ładny przykład od bawiącego ostatnio w Polsce Davida Erricsona, a dokładniej – od North Kingdom. Szkoda, że już nie ma wcześniejszej wersji intro.
Jak widać i oni muszą czasem zarabiać na zmarznięty, szwedzki chleb html’em :-). Chodź w rzeczywistości jest tutaj tyle wstawek flashowych, że zastanawiam się jaki był cel stworzenia strony z tak intensywnym wymieszaniem technologii.
the Old Fashioned
Tylko biel tła i czerń fontów. Minimalizm górą.
Corporate Risk Watch
Tutaj biel jest złamana, ale koncepcja i układ przykuwają oko.
A co u nas nowego białego w htmlu?
Adfest
Bardzo blogowo i prosto. Detale domykające stronę z góry i dołu przełamują szablon. Za jakiś czas trzeba będzie sprawdzić jak przyjął się nowy serwis.
Prezent.wp.pl
Jeszcze miło, świątecznie i prezentowo. Większe plamy koloru sprawiają, że przekaz jest bardziej emocjonalny. Wszędzie obszerne teksty na białym tle, choć podsekcje sprawiają wrażenie przeładowanych.
Pokojowo.pl i Rzeczowo.pl
Dwa nowe serwisy od Agory. Czysta, klasyczna stylistyka rodem z fotoblogow, a tematyka – piękne rzeczy i wnętrza to coś co tygryski lubią najbardziej. Mam nadzieje, że te serwisy będą się rozwijać. Dużo szczęścia w Nowym Roku!
Motogratka.pl i Praca.pl
I jeszcze takie z końcówki roku odświeżenia “skórek” na zimę. Jakoś tak, wg mnie, niezbyt udane.
Dominika Kwol
Dyrektor Artystyczny
Jest mały problem z linkiem o anchorze:
“Studia nad czytelnością druku”
Swoją drogą dzięki za link… Ciekawy artykuł…
Cieszę się, że autor odwołał się w tym artykule do mojej pracy i badań jakie przeprowadziłem. Obawiałem się, że zostaną one pominięte cała moja praco pójdzie na marne. A Tu proszę :)
Faktycznie, kiedy przeprowadzałem badania, byłem zdziwiony, że wszystkie „ulepszacze” zamiast podnosić – wpływają negatywnie na szybkość czytania tekstów.
Przecież opracowanie każdej z tych metod kosztowało wiele firm wiele czasu i pieniędzy.
W badaniach swoich nie brałem pod uwagę technoligii Clerar Type, która w tamtym okresie była nowością. Piszące ten tekstu używam Maka, który tekst wyświetla doskonale – lepiej niż XP i Vista.
Jestem ciekaw jak technologia rozwinie się w przyszłości i w którą stronę podąży.
Czytelność tekstu staje się coraz ważniejszym problemem poprzez wzrastającą popularność urządzeń mobilnych – wypoasażonych w ekrany mniejsze niż te w komputerach stacjonarnych.
Pozdrawiam
Dziekuję za uwagę w sprawie odnośnika – faktycznie błąd i poprawione.:-) Jeśli chodzi o Zachrisona Bror’a to w sieci rzeczywiście trudno znależć przekłady przynajmniej fragmentów książki- czyli pozostaje oryginał ” na żywo”.
Adam: Fajnie, że się odezwałeś. Świetny temat pracy i realizacja – chętnie zapoznałabym się z podobnymi badaniami na szerszą skalę.To był indywidualny pomysł na pracę, czy znalazłeś podobne badania np w zagranicznych źródłach?
Chętnie dołączyłabym w artykule odnośnik do Twojej strony/namiarów dla osób zainteresowanych.
Co jak co, ale szary na białym tle czyta się tragicznie.