projektowanie graficzne stron internetowych

Projektowanie stron internetowych

Projektowanie stron www jest jednym z najważniejszych etapów wchodzących w skład tworzenia stron internetowych. Wielu klientów kojarzy projekt graficzny wyłącznie z samym wyglądem witryny internetowej. Faktyczne, na etapie projektowania w programie graficznym powstaje wizualizacja graficzna strony ale nie tylko. Graficy tworzący projekt strony www muszą przede wszystkim pomyśleć aby była właściwa typografia, nawigacja i cała logika strony internetowej. Wszystko to ma ogromny wpływ na końcowy efekt.

Ustalenia, koncepcja stron www, czas

Może wyda się to dość banalne ale doświadczenie i lata pracy z różnymi „typami” klientów nauczyły nas, że nawet coś, co wydaje się oczywiste, dla kogoś innego, wcale takie oczywiste być nie musi.

Każdy projekt rozpoczynamy od ustaleń i już podczas pierwszego kontaktu z klientem pytamy dla kogo będzie adresowana projektowana strona internetowa i czego pokrótce będzie dotyczyła. Każda branża ma indywidualny charakter dlatego zasady dotyczące danej branży będą obowiązywały tylko przy tworzeniu stron odpowiedniej dla tej branży.

Aby nasza współpraca była jak najlepsza oczekujemy od naszych nowych klientów odpowiedzi na podstawowe pytania. Formularz wyceny dostępny tutaj.
Jeżeli ktoś w mniejszym bądź większym stopniu zbudował wyobrażenie swojej strony internetowej, będzie nam znacznie łatwiej projektować i szybciej osiągniemy pożądany efekt.

Często jednak klienci przesyłają nam zlecenia budowy strony internetowej, nie mając żadnego wyobrażenia o tym: jak ma ona wyglądać oraz jak powinna funkcjonować. Wówczas, to my musimy uzyskać od klienta jak najwięcej informacji.

Co musimy wiedzieć?

Przede wszystkim czym dokładnie zajmuje się firma i jaki jest zakres jej działalności. Kolejno powinniśmy dowiedzieć się co klient chce osiągnąć poprzez stronę internetową. Musimy również wiedzieć, czy strona ma być interaktywna, czy tylko prezentować ofertę firmy, czy będzie często aktualizowana? Wszystkie te informacje są nam potrzebne nie tylko do stworzenia wizualnej i logicznej części serwisu, ale także do zaprojektowania i ustalenia hierarchii menu.

Projektowanie grafiki strony

Nie będzie wielkim zaskoczeniem, jeśli powiemy, że wygląd musi być spójny z tematyką strony. Graficy, gdy zaczynają pracę nad stroną (w oparciu o zebrane informacje oraz wytyczne od zlecającego), zaczynają tworzyć sobie w głowie pewną wizję strony. Jedną z pierwszych rzeczy, jaka powstaje w myślach projektującego jest kolorystyka strony internetowej, do której musi dopasować resztę.

Kolory wybierać będziemy w nawiązaniu do tematyki serwisu oraz w taki sposób, aby zainteresować potencjalnych odbiorców (np. kobiety, mężczyźni, dzieci). Jako że kolory wpływają w różny sposób na ludzkie samopoczucie, wywołując u nas pewne reakcje (np. czerwony kolor zwraca uwagę, biały jest neutralny, a niebieski uspokaja). Wybierać je będziemy również w oparciu o to jaki efekt zlecający zamierza osiągnąć poprzez publikacje strony www w internecie.

Czasami dostajemy od zlecającego logo firmowe i wówczas to do niego dopasowywany jest powstający design strony. Najważniejsze jest to, aby cały wygląd strony był spójny, a styl był rozpoznawalny na każdej z podstron (dobrze, gdy każda podstrona czy sekcja, nawet w bardzo zaawansowanych i rozbudowanych platformach, miała jakiś wspólny element).

Projektowanie typografii strony

Badania wykazują, że trudniej czyta nam się z monitora komputera niż drukowany tekst taki jak książki czy czasopisma. Tworzone witryny internetowe muszą zatem być jak najwygodniejsze dla odbiorcy naszego serwisu. To właśnie wykorzystanie odpowiedniego kroju i wielkości czcionki odpowiada za to czy witryna jest przystępna w odbiorze czy nie.

Typografia strony internetowej powinna być dobrana w taki sposób aby serwis nie był męczący ale łatwy i przyjemny. Typografia kojarzy się większości wyłącznie z rodzajem i wielkością czcionki dla tekstu, jaki zamieszczany jest na witrynie. Jest to jednak tylko jeden z jej elementów. Czcionka faktycznie jest bardzo ważna, jednak „położenie” tekstu (a wraz z nim i kilka innych elementów, na które powinniśmy zwracać uwagę podczas projektowania) jest bardzo istotne.

W typografii istnieją zasady, które określają wygląd tekstu tj; interlinia tekstu, wyróżnienia w tekście (sposób w jaki je zaznaczamy), odnośniki tekstu, chorągiewki (przy niejustowanym tekście, wyrównanie tekstu w akapicie tak, by był w miarę możliwości równy w każdej linijce) czy szerokość łamu (kolumny), itd.

Nawigacja czyli projektowanie menu

Nawigacja strony internetowej jest najważniejszym elementem z punku widzenia odbiorców, którzy nawet na najciekawszej wizualnie stronie nie zostaną, gdy będą mieli trudność w odnalezieniu tego czego szukają. Jeśli chodzi o nawigację, nie polecamy eksperymentów i innowacji.

Wykorzystujmy sprawdzone rozwiązania, do których ludzie są przyzwyczajeni i które rozumieją. Po pierwsze, nawigacja na każdej podstronie musi być jednakowa. Po wejściu na kolejną z podstron użytkownik nie może od nowa uczyć się, jak korzystać z serwisu.

Menu zawsze powinno znajdować się w widocznym miejscu. W menu głównym umieszczamy takie sekcje, jak: Oferta, O nas, Kontakt, Referencje, Artykuły, Pomoc, itp. Nie możemy przesadzać z ilością zakładek menu głównego. Ograniczmy się tylko do najważniejszych.

Zazwyczaj na każdej z podstron znajduje się również menu dodatkowe czyli lista poszczególnych głównych działów menu. Przykładowo, w zakładce Artykuły, w menu dodatkowym możemy podzielić teksty i przypisać je do określonego zbioru tematycznego, który umieszczamy na stronie.

Nawigacja, breadrcumbs i chmura tagów

Nawigacja odbywa się oczywiście nie tylko poprzez menu, ale także przez treść. W treści na stronach umieszczane są np. linki, które są dobrze widoczne dla użytkowników, więc w bardzo wygodny sposób kierują do wybranych miejsc na stronach.

Do innych narzędzi nawigacyjnych należą również tzw. breadcrumbs (okruszki chleba) oraz chmura tagów. Breadcrumbs to linki umiejscowione na górze strony (najczęściej pod nagłówkiem), oddzielone od siebie znakiem (np. strzałką, pionową kreską). Mają za zadanie pokazać użytkownikowi, w którym miejscu na stronie internetowej (podstronie) się obecnie znajduje.

Chmura tagów to zestaw linków kierujących do podstron (wygląda jak niedbale porozrzucane słowa kluczowe). Im większa czcionka słowa umieszczonego w chmurze tagów, tym większa popularność podstrony. W taki sposób na stronie wyróżnione są najbardziej interesujące internautów treści.