Dzieło sztuki zapisane w CSS, czyli rzecz o trendach w projektowaniu stron WWW

Logika i konsekwencja na wierzch

Jak więc powinien wyglądać profesjonalnie przeprowadzony proces budowy serwisu WWW – od poczęcia w głowach projektantów aż do umieszczenia go na serwerze? W tym miejscu należą się dwa słowa wyjaśnienia na temat podziału ról podczas pracy nad witryną internetową w profesjonalnych agencjach. Najczęściej popełnianym błędem jest pomijanie roli projektanta lub mylenie go z grafikiem (chociaż zdarza się, że jest to jedna osoba). Duża grupa ludzi nie ma nawet pojęcia o jego istnieniu, jednak to on zajmuje się „układaniem” strony i to jego wizja jest dopiero realizowana przez grafika. Pracę projektanta można porównać do pozytywistycznej pracy u podstaw, która ma fundamentalne znaczenie dla późniejszych efektów, pozostając jednocześnie niezauważoną i niedocenioną.

„Najpierw projektant ustala grupę odbiorców strony internetowej, następnie określa cele, które witryna ma spełniać, a później sprawdza, czego oczekuje grupa odbiorców strony. Wówczas można przystąpić do stworzenia makiety serwisu i przeprowadzenia badań eyetrackingowych. Dopiero podczas kolejnego etapu pracy, po uzyskaniu tych wszystkich informacji i włączeniu ich w projekt, witryną zajmuje się grafik” – wyjaśnia Mateusz Miernikowski.

Bardzo ważną częścią pracy jest precyzyjne ustalenie – wraz z klientem – wszelkich szczegółów dotyczących proponowanych przez obie strony rozwiązań. Zabieg ten pozwoli na wyeliminowanie lub przynajmniej w dużym stopniu ograniczenie ewentualnych nieporozumień, które mogą wynikać z różnych sposobów postrzegania tego samego zagadnienia. Etap ten pokazuje, jak ważną rolę odgrywa wzajemna komunikacja z klientem. Podczas tego stadium projektu ciągle jest czas, aby przekonać go do porzucenia pomysłów, które według niego są genialnymi rozwiązaniami, mającymi fundamentalne znaczenie dla serwisu, a w rezultacie okazują się niepotrzebnymi elementami, powodującymi tylko szum komunikacyjny lub wręcz czyniącymi witrynę nieporęczną. Jak przestrzega Grzegorz Krzemień, podstawowym błędem popełnianym przez klientów jest chęć zakomunikowana wszystkich treści, które uważa on za najważniejsze, już na stronie głównej.

„Czasami zdarza się, że według klienta wszystko jest równie ważne, przez co ginie to w powodzi innych równie ważnych elementów” – mówi wiceprezes GoldenSubmarine.

Z kolei Mateusz Głuszek zwraca uwagę na tendencję do powiększania wszystkiego. – „Często klienci chcą powiększać czcionki, buttony lub swoje logo” – mówi.

Dr Dariusz Tworzydło, doradca zarządów firm ds. public i media relations, przestrzega również, by na stronie internetowej nie dominowała inwencja graficzna nad treścią, wówczas bowiem przekaz PR – który zwykle odgrywa dosyć istotną rolę – zostanie przytłoczony.

„Wszystko musi być podporządkowane logice i konsekwencji, nawet najlepszy projekt graficzny może bowiem czasem być wyrwany z kontekstu i odległy od przekazywanej treści” – stwierdza.

Marketing to podstawa, ale…

Na początkowym etapie produkcji należy ustalić wszystkie niezbędne rozwiązania marketingowe, które mają zostać zaimplementowane w serwisie. Mimo iż są one obecnie niezbędnym elementem projektu, nie zawsze spotykają się z aprobatą osób odpowiedzialnych za ich wdrożenie, czyli grafików.

„Zasady marketingowe potrafią wiele zepsuć, gdyż narzucają pewien schemat działania. Każdy patrzy na witrynę przez pryzmat swojej pracy: marketer widzi w niej produkt, który należy jak najlepiej sprzedać, a grafik chciałby czasami poszaleć z nieszablonowymi pomysłami” – mówi Ewelina Poznańska. – „Ja zwracam uwagę na rozwiązania graficzne, na kompozycję strony – te elementy zdradzają, kto robi strony zachowujące kanony Internetu, a kto podchodzi do projektu jak do pewnego rodzaju obrazu, który z funkcjonalnością niekoniecznie musi mieć wiele wspólnego” – dodaje.

...marketer nie może być daltonistą

Jednym z najważniejszych elementów serwisu internetowego jest odpowiedni dobór barw. To one w dużej mierze determinują odbiór oraz postrzeganie witryn przez użytkowników. Często zdarza się, że firmy, zamawiając projekt strony internetowej, narzucają własny zestaw barw, który wynika z używanej przez nich identyfikacji wizualnej lub z kolorystyki znaków graficznych – jest to tzw. księga marek, czyli zestaw wytycznych dotyczących kolorów oraz czcionek stosowanych przez daną firmę.

Jednakże oprócz instrukcji od zamawiającego witrynę istnieje wiele zasad, do których należy się stosować. Bezwzględną normą jest zachowanie czytelności tekstu, który musi kontrastować z tłem. Sięgając pamięcią w przeszłość, każdy z pewnością może sobie przypomnieć kilka większych bądź mniejszych serwisów, które z tą zasadą były na bakier. Od kilku lat takie projekty są już jednak prawdziwą rzadkością. Innym ważnym aspektem, na który należy zwrócić uwagę, jest harmonijne zgranie używanych przez firmę znaków graficznych z projektem przygotowywanej witryny.

„Dobór barw to niezwykle istotny element w kreowaniu wizerunku za pomocą serwisu WWW. Nie ma jednak sformalizowanych wytycznych, które warunkowałyby użycie jakiegoś konkretnego koloru. Przyjmuje się jednak zasady nieformalne. Warto, aby barwy wykorzystywane w konstrukcji strony internetowej były spójne z przyjętym systemem identyfikacji firmy. Jeśli zatem np. bank wykorzystuje w swoim logo i całej symbolice kolor niebieski, to wrzucenie na stronę internetową koloru wściekle czerwonego powoduje zakłócenie i zafałszowanie przekazu. Warto, aby użyte barwy uwzględniały tematykę i zawartość portalu. Najważniejsza jest jednak spójność z systemem identyfikacji” – stwierdza Dariusz Tworzydło.

Przygotowując paletę kolorów, która ma być wykorzystana w projekcie, należy również pamiętać o odpowiednim doborze kolorystyki do tematyki projektowanej witryny.

„Wszystko zależy od potrzeb klienta oraz branży, z której się on wywodzi. Jeżeli projektujemy witrynę o samochodach wyścigowych, nie może być ona w kolorach różu i błękitu, w przypadku przygotowywania strony z bielizną takie kolory będą natomiast jak najbardziej na miejscu” – wyjaśnia Mateusz Miernikowski.

Zatem do „Heli w opałach” jak ulał pasuje kolor fioletowy (http://helawopalach.onet.pl/), strona o Erneście Hemingwayu utrzymana będzie zaś w stonowanej, klasycznej kolorystyce (http://www.ernesthemingwaycollection.com/).

Rysunek 5: ErnestHemingwayCollection.com – Hemingway w klasycznej oprawie, czyli odpowiedni dobór barw do tematyki serwisu.

Barwy mają również fundamentalne znaczenie w biznesie. Ich zadaniem jest współgranie z kształtami, nazwą czy mottem, co w efekcie ma się przekładać na pozytywne kojarzenie przez odbiorcę. Dla przykładu: z kolorem niebieskim kojarzone są usługi medyczne, z szarym i srebrnym wielkie korporacje, a barwa zielona zalecana jest dla banków. Jak się nietrudno domyślić, podobne zasady obowiązują podczas projektowania witryn internetowych, a pewne standardy dopasowania barw do poszczególnych branż utrwalają siatkę skojarzeń również na polu projektów sieciowych. Utarte standardy owocują jednak często pewną jednorodnością pośród niektórych serwisów branżowych. Firmy boją się eksperymentów, decydując się na przetestowane przez innych rozwiązania.

„Osobiście nie przepadam za niebieskimi stronami – takich projektów są miliony w Internecie! Często realizując prywatne zlecenia, próbuję klientowi zaproponować zabawę barwami. Niestety, w większości wypadków nie spotyka się to z jego przychylnością, gdyż chce on mieć po prostu taką samą stronę jak konkurencja” – zauważa Ewelina Poznańska.

Gdzie są prymusi?

W celu dobrego zilustrowania przedstawionych w tekście zaleceń eksperci zostali poproszeni o podanie przykładów stron, które w ostatnich miesiącach zrobiły na nich największe wrażenie.

Dariusz Tworzydło przywołuje portal www.brief.pl, zwracając uwagę na wykorzystane tam rozwiązania kolorystyczne. „Strona ma zachowawcze kolory, ale jednak wyraźnie eksponuje znaną na rynku markę Brief. Wykorzystana kolorystyka nie jest nachalna. Sprzyja szybkiemu odnajdywaniu potrzebnych informacji. W tym wypadku, przez powściągliwość w stosowaniu barw, nie spowodowano chaosu, co przy wspominanym działaniu może się zdarzyć” – mówi.

Marcin Wojciechowski zwraca natomiast uwagę na strony napoju Burn (http://www.burn.pl/), Galerii Hoża (http://www.galeriahoza.pl/) oraz artysty Leszka Możdżera (http://www.mozdzer.com/) – przykłady dobrego połączenia multimedialności z prostotą nawigacji. W rezultacie mimo audiowizualnego bogactwa nie natkniemy się tu na – mogące stać się przyczyną frustracji wśród użytkowników – „udziwnienia”.

Rysunek 6: Strona internetowa Leszka Możdżera to przykład, iż fajerwerki multimedialne mogą iść w parze z funkcjonalnością.

Innymi ciekawymi projektami, które z kolei przedstawia Mateusz Głuszek, są serwisy kampanii Subaru (http://www.sexysubaru.ca/) oraz Ethno Port Poznań Festiwalu 2008 (http://www.ethnoport.pl/).

Rysunek 7: Seksowne Subaru obok mniej seksownego pana, czyli serwis Sexysubaru.ca.

W zestawieniu, jak widać, dominują strony flashowe, co tylko potwierdza galopującą „multimedializację” Sieci.

Widoki na przyszłość

Na koniec przyszedł czas na odrobinę futurologii, czyli próbę przewidzenia kierunku, w jakim podążać będą trendy w najbliższych latach. W tej kwestii specjaliści są zgodni – czeka nas dynamiczny rozwój interakcyjności serwisów (jednym z ostatnich polskich przykładów jest udostępnienie możliwości personalizacji portalu Onet.pl) oraz coraz większa multimedialność Internetu. Trend ten zdominuje najprawdopodobniej również przekazy reklamowe realizowany na potrzeby Sieci. Projektanci dążyć będą też do jak najdalej idącego uproszczenia komunikacji na linii serwis-internauta. Tendencje te będą się najprawdopodobniej rozwijały równolegle, przenikając się i odnajdując w coraz to nowych zastosowaniach.

Warto jednak pamiętać o pewnej prozaicznej prawdzie. Trendy w projektowaniu stron WWW podlegają ciągłej ewolucji, która jest odbiciem zmieniającego się społeczeństwa, jego potrzeb oraz przede wszystkim języka, którym się komunikuje. Najlepszą ilustracją tej tezy jest stwierdzenie zaczerpnięte od Jacka Opalucha (grafik, projektant, ilustrator, flashowiec), który w jednym z wpisów na swoim blogu (http://seventhmodel.com/blog/) zauważył, że: „Dobry design jest odbiciem tego, co dzieje się ze społeczeństwem, odbiorcą i projektantem. Dobry design to dialog pomiędzy twórcą, tworzywem i użytkownikiem. Na tym polega ta komunikacja: ja mówię do ciebie językiem, który ty zrozumiesz. Można mówić niewyraźnie, archaicznie czy w końcu niezrozumiale. Zawsze jednak podejmuje się próbę przekazania jakiejś treści w języku zrozumiałym dla odbiorcy. A ten – no żyje tam, gdzie żyje. I tak jak w sztuce – to kwestia stylu. Przełożenia własnej wyobraźni na język uwikłanego w czas teraźniejszy odbiorcy”.