Jak zrobić dobrą stronę internetową?

Jak zrobić dobrą stronę internetową?

Wszystkich nas cieszą estetyczne i dopracowane projekty. Wolimy obcować z dopracowanymi stronami www, nawet jeśli nasz kontakt z nimi ma się ograniczać tylko do zrobienia zakupów w sklepie internetowym. Jednakże stworzenie aktualnej, nowoczesnej i dopasowanej do obowiązujących trendów i standardów witryny nie zawsze jest łatwe. Jak więc zaprojektować stronę internetową, aby była jednocześnie ładna i funkcjonalna, a przy tym nie kosztowała fortuny?

Spójny styl graficzny to podstawowy element udanego projektu

Estetyczna grafika to pierwsza rzecz, na jaką zwracają uwagę użytkownicy po wejściu na stronę internetową, dlatego my również powinniśmy mieć to na uwadze przy projektowaniu strony internetowej dla firmy. Brzmi jak banał, ale wszyscy doskonale wiemy, że czasami wystarczy kilka sekund, aby ocenić czy się nam coś podoba czy nie. Niedopracowana szata graficzna wygląda nieprofesjonalnie i może skutecznie odstraszyć odwiedzających od podjęcia jakiejkolwiek konwersji na naszej stronie www np. złożenia zamówienia. Kiepsko wyglądający layout strony www może nawet, w skrajnych przypadkach, całkiem zniechęcić czytelników do zagłębienia się w treść. Dlatego warto zadbać o to, żeby nasza wizytówka w Internecie nie była dziełem przypadku tylko wynikiem przemyślanego twórczego procesu.

Oznacza to mnie więcej tyle, że jej struktura, układ, kolorystyka, wykorzystane grafiki i inne elementy wizualne powinny pasować nie tylko do charakteru naszej marki, ale również do grupy docelowej – klientów, którzy są potencjalnie zainteresowani naszymi usługami i produktami.

Styl graficzny firmowej strony internetowej powinien być spójny z innymi materiałami wizualnymi firmy. Jest to niezbędne dla właściwej rozpoznawalności marki. Wszystkie materiały identyfikacyjne, takie jak bannery, wizytówki, ulotki, plakaty lub inne gadżety, powinny mieć podobną, nawiązująca do siebie szatę graficzną. Jeśli więc zdecydujemy się na styl geometryczny, to ważne, aby motywy związane z geometrią były widoczne się nie tylko na stronie www, ale również na wizytówkach czy ulotkach. Powtarzające się elementy wizualne, pojawiające na różnych etapach kontaktu z firmą, budują w świadomości jej odbiorców trwały i profesjonalny obraz marki. Nie ma nic gorszego niż nieprzemyślany, niespójny i nijaki branding.

Kolorystyka strony www powinna współgrać z brandingiem

Podobnie jak styl graficzny, kolory na stronie internetowej będą stanowiły jeden z kluczowych elementów odzwierciedlających charakter firmy. Najlepiej zdecydować się na dwa lub trzy kolory. Powinny one pojawiać się także w logo. Ich wybór i dopasowanie warto zostawić grafikowi, ale ważne, aby zachować równowagę w ich stosowaniu na stronie internetowej. Jeśli chcemy wyróżnić jakiś element możemy użyć intensywnego koloru, który będzie przyciągał wzrok. Jednocześnie zaleca się zastosować mniej jaskrawą barwę fontów oraz stosować większy kontrast między tłem, a tekstem. Zapewni to lepszą czytelność długich artykułów i pozytywnie wpłynie na odbiór treści przez osoby niedowidzące.

Jak dobierać kolory do projektu
Aplikacja internetowa Adobe Color

Przydatnymi w wyborze odpowiedniego zestawu kolorów mogą okazać się takie narzędzia jak Adobe Color albo Paletton. Jeśli jednak nie czujemy się pewnie w zagadnieniach związanych z teorią kolorów i doborem barw, warto powierzyć to zadanie doświadczonemu grafikowi.

Nie warto przesadzać z nadmierną ilością fontów

Dla zachowania harmonii w projekcie warto użyć nie więcej niż trzech krojów pisma. Jeśli używamy dwóch lub więcej fontów, zadbajmy o to, aby różniły się one znacznie od siebie. Najczęściej jednak jeden krój, ale w kilku odmianach, w zupełności wystarczy. Przy jego wyborze należy kierować się estetyką oraz upewnić się, że pasuje on do wizerunku firmy. Czasami warto poeksperymentować i wybrać oryginalny krój pisma, zwłaszcza w bardziej nowoczesnym projekcie, ale trzeba pamiętać, aby nie przesadzić z efektami specjalnymi i urozmaiceniami. Niekiedy wystarczy tylko zmienić rozmiar fontu lub dodać pogrubienie, aby wprowadzić nieco różnorodności i zapewnić lepszy kontrast wizualny między akapitami, a nagłówkami. Zdrowy umiar jest tutaj bardzo wskazany, zwłaszcza, że im mniej różnych fontów na witrynie, tym szybciej będzie się ona wczytywała, co ma pozytywny wpływ na SEO.

Popularne zestawienia krojów pisma można sprawdzić na przykład na witrynie Google fonts, skąd można również pobrać darmowe fonty w wersji webowej, gotowe do zastosowania w projekcie strony internetowej.

Logiczny układ i wartościowe treści podniosą czytelność i możliwości SEO

Treści które zamieszczamy na stronie www mają zazwyczaj swój cel – informowanie, generowanie zapytań lub sprzedaż. Z tego powodu muszą być one napisane jasnym i zrozumiałym językiem i nieść za sobą jakąś wartość, przydatną z punktu widzenia czytelnika. Nie należy przy tym zapominać, że dobra strona internetowa to taka, która jest widoczna w Internecie. Warto więc zamieszczać w tekście istotne frazy kluczowe, aby móc dotrzeć do większej liczby osób i wysoko pozycjonować się w wynikach wyszukiwania Google. Istotne z punktu widzenia SEO frazy warto umieszczać w nagłówkach, opisach obrazków, listach wypunktowanych, a nie tylko w treści akapitów. Więcej na temat pozycjonowania strony internetowej pisaliśmy np. w artykule „jak promować stronę firmową w Internecie”.

Oprócz przejrzystego wyglądu i wartościowych treści, witryna musi mieć także logiczną nawigację, bo to właśnie przy pomocy menu głównego czytelnik będzie się po niej poruszał. Nie można dopuścić do sytuacji, w której użytkownik zabłądzi lub zacznie mieć trudności w znalezieniu odpowiednich treści.

Bardzo przydatnym elementem dobrze zaprojektowanej strony www jest możliwość szybkiego powrotu do strony głównej oraz uprzednio oglądanej kategorii. Pomocne mogą okazać się w tym tzn. okruszki (breadcrumbs). Pokazują one czytelnikowi, w którym miejscu na mapie witryny aktualnie się znajduje, a także umożliwiają mu szybki powrót do podstrony wyższego poziomu.

Kluczowe informacje powinny być widoczne

Warto również zadbać o pokazywanie kluczowych informacji w stopce strony. Zdarza się, że ważne elementy, takie jak dane kontaktowe, nie są widoczne na każdej podstronie tylko dostępne dopiero po wejściu w menu, jako odnośniki do innych podstron. Należy unikać takich rozwiązań i najbardziej istotne informacje umieszczać na stronie w taki sposób, aby czytelnik mógł intuicyjnie i szybko się do nich dostać. Trzeba przy tym pamiętać, że większość użytkowników korzysta z Internetu na urządzeniach mobilnych, dlatego strona musi być w pierwszej kolejności dostosowana do prawidłowego wyświetlania na smartfonach.

Na koniec warto jeszcze wspomnieć to tym, żeby nie zasypywać czytelników obszernymi blokami tekstu. Wiąże się to z ryzykiem, że szybko się znudzą i opuszczą stronę. Lepiej jest używać krótkich akapitów oraz wzbogacać artykuły zdjęciami, stosować wyróżnione nagłówki oraz takie elementy jak tabele, cytaty czy listy wypunktowane. Innymi słowy – jeśli artykuł będzie wyglądał dla odbiorcy atrakcyjnie, chętnie przeczyta go w całości.

Stanowcze NIE dla wyskakujących okienek, migających elementów i muzyki w tle

Ozdoby, urozmaicenia i efekty należy stosować z rozwagą. Jeśli nie są niezbędne, rozważmy ich usunięcie. Strona powinna być przede wszystkim czytelna i łatwa w obsłudze. Wszelkie rozpraszacze w postaci animowanych, wyskakujących elementów, mimo, że potencjalnie mogą wydawać się fajnym „bajerem”, powodują niepotrzebny chaos i utrudniają poruszanie się po witrynie. Po drugie, dodawanie takich niespodzianek opóźnia ładowanie strony www. A wolno wczytująca się witryna to nie tylko irytujący problem dla jej użytkowników, którzy prawdopodobnie szybko ją opuszczą, ale również dla SEO, ponieważ Google uwzględnia prędkość ładowania się strony www w swoich rankingach widoczności. Wolno działająca strona internetowa nie ma szans dobrze się pozycjonować i zająć wysokiego miejsca w wynikach wyszukiwania. To nie wszystko. Im więcej „fajerwerków”, tym większe ryzyko, że część nich może się wyświetlać nieprawidłowo na niektórych urządzeniach czy przeglądarkach (zwłaszcza starszych). W skrajnych wypadkach może to doprowadzić do tego, że strona będzie dla niektórych użytkowników niedostępna.

Oczywiście nie znaczy to, że nasza strona musi być nudna, ale stosujmy ozdobniki z umiarem. Pamiętajmy o tym, żeby przede wszystkim stawiać na użyteczność i czytelność, a nie przekombinowane efekciarstwo. Ładny design to właściwie dobrany styl graficzny, udana kompozycja, przyjemna dla oka typografia i kolorystyka, a nie wizualny chaos związany z przeładowaniem strony www niepotrzebnymi gadżetami.

Grafika, obrazy, zdjęcia – skąd je brać?

Wartościowe treści to nie tylko teksty, ale również materiały audio, wideo oraz zdjęcia. Bez tych ostatnich raczej trudno sobie wyobrazić współczesną, firmową stronę www. Nie zawsze dysponujemy jednak własnymi zdjęciami, które chcielibyśmy umieścić na naszej witrynie. Skąd więc je wziąć?

Jest kilka rozwiązań tego problemu. Pierwszym z nich jest skorzystanie z tzw. serwisów stockowych i zakupienie odpowiednich zdjęć, pasujących do prowadzonej przez nas działalności. Ceny fotografii w bankach zdjęć wahają się od około 10 do 50 zł. Tańszą alternatywą dla płatnych serwisów, są darmowe strony www ze zdjęciami takie jak np. pixabay czy pexels, ale jakość zdjęć, które tam znajdziemy nie zawsze jest wysoka, a ich wybór znacznie skromniejszy.

Darmowe zdjęcia dostępne w serwisie Pixabay
Serwis Pixabay oferujący tysiące darmowych zdjęć do pobrania

Pozostaje jeszcze trzecia opcja, czyli skorzystanie z pomocy fotografa. Oczywiście, nie jest to najtańsze rozwiązanie, ale przynajmniej będziemy mieli pewność, że zdjęcia, które zamieścimy na stronie www będą unikalne. Ponadto własne zdjęcia będą dowodem dla klientów na to, że nasza firma i produkty, które oferujemy faktycznie istnieją. Prawdziwe zdjęcia biura, pracowników czy realizacji w portfolio na pewno bardziej podniosą naszą wiarygodność w oczach klientów niż fotografia uśmiechniętego pana z słuchawką ze stocka, wcielającego się rolę wyimaginowanego konsultanta.

Gotowy szablon czy indywidualny projekt graficzny?

Nawet najlepiej opracowany projekt wymaga zastosowania odpowiednich rozwiązań technicznych, aby można go było wcielić w życie. Większość realizacji jakie powstają w Pixgoblin tworzymy od podstaw, choć zdarza nam się na życzenie Klientów tworzyć strony na wybranych przez nich gotowych szablonach. Choć zalecamy to pierwsze rozwiązanie, a więc stworzenie serwisu opartego na indywidualnym projekcie graficznym, nie ukrywamy, że jest to trudniejsze i bardziej czasochłonne zadanie dla wykonawcy. Wiąże się to z koniecznością zaangażowania webdesignera, który stworzy layout w programie graficznym, oraz programisty, który będzie musiał go zakodować. Kuszące może być w takiej sytuacji użycie gotowego szablonu graficznego. Czy jednak ma to sens?

Jeśli tworzymy prostą stronę dla wąskiej grupy odbiorców, albo amatorskiego bloga, którego nie będziemy promować, to faktycznie w takiej sytuacji postawienie serwisu na „gotowcu” nie będzie złym wyborem. Co jednak, jeśli myślimy poważnie o stronie internetowej dla firmy, czyli takiej, która ma na siebie zarobić i godnie reprezentować markę w sieci? Trzeba sobie zadać pytanie, czy warto zaoszczędzić na stronie www na starcie, aby później musieć robić ją od nowa, jeśli jednak okaże się, że gotowy szablon graficzny nie oferuje tego, co chcemy.

Dlaczego warto postawić na oryginalny projekt?

Podstawowym problem stron www budowanych na płatnych szablonach jest to, że są one nie tylko trudniejsze w zarządzaniu, ale zwykle znacznie gorzej się pozycjonują, wolniej działają i są obciążone masą niepotrzebnego kodu. Korzystanie z nich wiąże się z wieloma niedogodnościami, o których warto wiedzieć wcześniej.

Założeniem gotowego szablonu jest to, żeby każdy kto go kupi, mógł sobie wyklikać wygląd witryny z jej panelu administracyjnego. W teorii ma to ułatwić budowę serwisu niedoświadczonym użytkownikom, w praktyce powoduje jednak, że zarządzenie stroną zbudowaną na gotowcu jest męczące, niewygodne i wymaga nie tylko dobrej znajomości systemu CMS, ale również wiedzy z zakresu projektowania, aby móc dostosować wygląd serwisu do współczesnych standardów. Zwłaszcza, jeśli chcemy stworzyć projekt, który nie wygląda jak kalka innego serwisu korzystającego z tego samego szablonu. Z kolei darmowe szablony są najczęściej ubogie w funkcje, niedopracowane i rzadko aktualizowane, a więc potencjalnie niebezpieczne i konfigurowalne w bardzo znikomym stopniu. Korzystanie z nich bardzo często kończy się koniecznością ich łatania od strony technicznej i funkcjonalnej. Często generuje to jeszcze większe koszty niż stworzenie dedykowanego szablonu od podstaw.

Z tego powodu warto przemyśleć od razu postawienie strony internetowej na oryginalnym, indywidualnym projekcie. Jest to najlepsza opcja w sytuacji, w której zależy nam na wygodnej edycji treści, rozbudowanych możliwościach SEO, wysokim bezpieczeństwie oraz łatwej rozbudowie. Niestety będzie się to wiązać z większymi kosztami „na starcie”, ale warto je ponieść, aby zapewnić sobie i użytkownikom maksymalny komfort korzystania ze strony www, bez ryzyka, że nie spełni ona w którymś momencie naszych oczekiwań i będziemy musimy zaprojektować ją od nowa.