Autor: Bartek Raducha
Projektowanie stron www - czy musi być trudne?
Projektowanie własnej strony internetowej to fantastyczna praca.
Możesz uwolnić swoją kreatywność. Zrobić stronę internetową, o której marzysz, a do tego… bawić się!
Strona internetowa to miejsce, w którym łączy się design, praktyczne rozwiązania i pisanie.
Jeśli lubisz dopieszczać szczegóły i doskonalić coś przez długi czas, to projektowanie stron internetowych jest czymś, co da Ci dużo satysfakcji.
Ale wcale to nie oznacza, że to coś trudnego! Wręcz przeciwnie.
Projektowanie stron internetowych, czasem nazywane web designem, jest proste.
Zwłaszcza gdy wiesz, jak do tego podejść. A jeśli jeszcze tego nie wiesz, to zaraz dostaniesz zbiór najważniejszych rzeczy związanych z projektowaniem stron www w pigułce :).
Spis treści:
Projektowanie stron www – od czego zacząć
Pierwszy ekran – klucz do dobrze zaprojektowanej strony internetowej
User experience w projektowaniu stron internetowych
Proporcje, czyli złota zasada projektowania stron www
Granice strony i poziomice - ważne elementy w projektowaniu strony internetowej
Dobre grafiki na stronie internetowej, czyli dlaczego nie warto kombinować
Typografia – wisienka na torcie projektowania strony www
Jak zacząć projektować strony internetowe?
Najważniejsze jest określenie celu strony.
Co ma mówić Twoja strona? Co mają na niej znaleźć odbiorcy? To najważniejsza rzecz w projektowaniu strony internetowej.
Nie robisz jej tylko po to, żeby była ładna. O nie.
Ładne strony, które po prostu są ładne, może cieszą oko niesamowitymi efektami, ale kiedy próbujesz się połapać w ich strukturze to zaczynają się schody.
Zwłaszcza kiedy patrzysz na taką stronę i zastanawiasz się „gdzie jest to, czego szukam”?
Nie zmuszaj użytkowników do zadawania takich pytań.
Przywitaj ich z gotową odpowiedzią. Celem użytkowników na Twojej stronie jest znalezienie odpowiedzi na nurtujące ich pytania.
Celem strony internetowej dla Twojej firmy musi być dostarczenie tej informacji.
Sprawdź, jak są projektowane wyszukiwarki internetowe lub – na przykład – hoteli.
Od razu po wejściu na stronę główną jednego z wyników wyszukiwania widzisz… wyszukiwarkę.
Dalej są inne rzeczy, ale pierwszym elementem strony, jaki widzą ludzie, jest okno wyszukiwarki.
Rozumiesz teraz o co chodzi?
Z resztą – zobacz jak to może wyglądać w praktyce:
Pierwszy ekran – klucz w procesie tworzenia strony i jej realizacji
Dlatego tak ważny jest pierwszy ekran (czyli to, co widzisz w pierwszej kolejności wchodząc na stronę internetową), który widzą użytkownicy.
Gdy wchodzisz na WebWave masz jasny komunikat: „cześć, mamy kreator stron internetowych, w którym zrobisz świetną stronę za darmo; spróbujesz?”.
Wchodzisz i od razu wiesz, o co chodzi. Idea strony www jest na tacy.
Cel Twojej strony musi być widoczny od początku. Masz gabinet stomatologiczny lub prowadzisz stronę szkoły?
Uwzględnij to w projekcie strony internetowej: umieść najważniejszą informację w pierwszym ekranie.
Pamiętaj też o tym, żeby menu strony było widoczne – ono też pomoże Twoim użytkownikom znaleźć od razu to, czego szukają.
Określenie celu strony pomoże Ci prześledzić ścieżki, które musi pokonać użytkownik żeby go zrealizować.
Czyli ile kliknięć dzieli go od wyznaczonego przez Ciebie celu. Dobrze się domyślasz – im mniej, tym lepiej.
Dlatego dodając i układające elementy na każdej z podstron zastanów się nad tym, czy kierują użytkownika do Twojego celu.
User experience w projektowaniu stron internetowych
Czyli liczenie się z użytkownikiem. Twoja strona internetowa musi wywierać na Twoim użytkowniku dobre wrażenie. Co najmniej – neutralne.
Taki użytkownik wchodzi na stronę, widzi co go interesuje, a potem przechodzi po prostu do celu. Wie wszystko, czego potrzebuje, może przejść do realizacji celu.
Na user experience składa się też to, jak wykonasz projekt graficzny strony czy sklepu internetowego. Oznacza to pewną pracę z Twojej strony. Musisz zastanowić się nad tym, jaki cel ma każdy z elementów na stronie i jak wiąże się z pozostałymi. Każda z rzeczy, które umieszczasz na stronie, musi mieć jasno określony cel.
Chociaż brzmi to dosyć skomplikowanie, to zapewniam Cię, że takie nie jest. Wygląda to mniej więcej tak, że zaczynasz robić stronę i już na tym etapie musisz mieć określony cel.
Potem dodajesz i rozmieszczasz kolejne elementy, co w kreatorze stron WebWave jest dziecinnie proste. Już wtedy musisz wiedzieć, jaki cel ma mieć każdy z tych elementów. Jeśli nie ma żadnego, to… może lepiej go nie umieszczać?
Pamiętaj, że każdy element na stronie, który nie ma jasno określonego celu, odciąga uwagę Twojego użytkownika.
Dlatego tak popularny jest ostatnio trend minimalizmu w projektowaniu stron internetowych. Proste formy pozwalają skupić uwagę na kluczowych rzeczach. A od tego do realizacji Twojego celu już tylko jeden krok.
Ponad 600 000 ludzi tworzy strony za darmo, bez kodowania i przy wsparciu AI. Zobacz, jakie to proste
Proporcje, czyli złota zasada projektowania stron www
Proporcje są bardzo ważne. Wpływają na wrażenie użytkownika. Czasem masz pewnie wrażenie, że jakaś strona jest „przeważona w lewo”, czyli ma więcej elementów z lewej strony niż z prawej.
Albo jakieś elementy układają się niesymetrycznie. Nawet jeśli nie widzisz tego na zasadzie „o, tu jest niesymetrycznie”, to Twój mózg dostrzeże to. A na pewno zauważą to użytkownicy.
Podobnie – może nie do końca świadomie, ale coś będzie im zgrzytało.
Takie zgrzytanie przy korzystaniu ze strony może powodować utratę użytkownika.
Pomyśl – wchodzisz na stronę internetową, na której niby wszystko jest fajnie, ale zaczynasz mieć wrażenie, że czegoś jest za dużo lub elementy są rozłożone nie do końca symetrycznie.
Wtedy nawet jeśli nie robisz tego świadomie, to masz ochotę porzucić taką stronę. Lub nie możesz się skupić, bo podświadomie widzisz, że coś nie gra. Jest krzywo.
To drobna rzecz, ale bardzo ważna dla realizacji Twojego celu. Jeśli użytkownik czuje, że coś mu nie gra na tej stronie, to jest już krok od zamknięcia karty i poszukania rozwiązania swojego problemu lub zaspokojenia wiedzy gdzie indziej.
Oczywiście – jeśli jest zdeterminowany, to pewnie wytrzyma to, ale… nie licz na to. Im więcej wymagasz od użytkownika swojej strony internetowej, tym bardziej go zniechęcasz do tego, żeby zrealizował Twój cel lub wrócił po nową dawkę wiedzy.
Jeśli użytkownik czuje, że coś mu nie gra na tej stronie, to jest już krok od zamknięcia karty i poszukania rozwiązania swojego problemu lub zaspokojenia wiedzy gdzie indziej.
Granice strony i poziomice - ważne elementy w projektowaniu strony internetowej
Te dwie rzeczy pomogą Ci zwalczyć problem z proporcjami. Poziomice, czyli linie, które wyznaczasz projektując stronę internetową, pozwolą Ci ułożyć elementy tak, żeby zachowały idealną harmonię.
Granice strony to takie dwie linie, które wyznaczają „od – do” strony internetowej. Z lewej się zaczyna, z prawej – kończy. To, co pomiędzy jest treścią. Rzadko kiedy ta szerokość powinna przekraczać 1200 pikseli.
Poziomice pozwolą Ci tak rozłożyć elementy na każdej z podstron, żeby harmonicznie ze sobą współgrały. To brzmi górnolotnie, ale gdy wiesz, gdzie jest środek, a gdzie skraje strony, to łatwiej Ci wszystko ułożyć.
Poziomice wstawisz na każdą stronę w naszym kreatorze stron internetowych. Dzięki nim tworzenie stron www jest jeszcze łatwiejsze i przyjemniejsze.
Dobre grafiki na stronie internetowej, czyli jak nie przeszkadzać użytkownikowi na Twojej stronie
Grafiki powinny być ładne. W praktyce działa tu zasada „mniej znaczy więcej”, czyli ładne grafiki, bez nadmiaru kolorów, będą idealne na stronie www przykładowo takiej jak blog, portfolio online czy landng page.
Pomyśl: jak wiele stron internetowych nie powala projektem – zwłaszcza jeśli przyjrzysz się temu dokładnie – ale za to zachwyca zdjęciami. Są dobrze dobrane.
Dlatego warto korzystać ze zdjęć z darmowych zbiorów zwanych stockami (stock po angielsku to „składnica”).
Wiele z nich jest naprawdę zjawiskowa, a czasem wystarczy spędzić kilka chwil na szukaniu tych idealnych na Twoją stronę internetową.
Pamiętaj, żeby dobierać zdjęcia, które nie będą przeszkadzały w realizacji celu Twojej strony.
Najlepiej gdy pasują tematycznie, ale nie wyglądają sztucznie. Na pewno kojarzysz strony, na których od zdjęć zionie sztucznością.
Jeśli jeszcze nie wiesz o co chodzi, to na pewno przeglądając grafiki w internecie natrafisz na takie, które wywołają u Ciebie takie wrażenie. Wtedy wiesz, że takich grafik nie warto mieć na stronie.
Pamiętaj, że w WebWave masz dostęp do kilkuset tysięcy darmowych grafik i ikon. Wystarczy, że otworzysz bibliotekę mediów i znajdziesz takie grafiki, które pasują do Twojej strony, a do tego zachwycą Twoich odbiorców.
Jeszcze co do grafik, to warto pamiętać o ich optymalizacji (czyli żeby nie były za duże, co jest częstym powodem wolnego wczytywania).
Kolory: które wybrać?
Chociaż kwestie estetyki są subiektywne, to jednak istnieją pewne zbiory kolorów, które do siebie po prostu pasują. Patrzysz na nie i widzisz, że dobrze się uzupełniają.
Jasne, do tego trzeba mieć sporo wyczucia graficznego, które nie każdy ma. Na pewno nie ja ;). Ale to nie znaczy, że musisz używać tylko czerni i bieli.
W internecie jest kilka fajnych narzędzi do tworzenia palet kolorów na stronie. Podajesz jeden kolor, który najlepiej odda ideę Twojej strony lub po prostu Ci się podoba, a algorytm wybiera najlepiej pasujące.
Trwa to chwilę, ale pozwoli Ci stworzyć schemat kolorów, którym podkreślisz profesjonalizm swojej strony.
Poza tym samo znaczenie kolorów i efekt psychologiczny, jaki wywołują, jest bardzo ciekawym tematem. Możesz to wykorzystać na stronie :).
Typografia – wisienka na torcie projektowania strony www
To, co teraz widzisz, jest efektem wyboru dobrej typografii, czyli krojów czcionek (albo fontów), wielkości i tak dalej. Typografia to cały tekst, który widzisz na stronie internetowej. Dlatego warto stosować dobre formaty tekstu. I korzystać z nagłówków.
W internecie najlepiej sprawdzają się fonty bezszeryfowe, czyli takie, które nie mają „kreseczek” na końcach liter. Na przykład Times New Roman jest szeryfowy, ale za to Lato, którym napisany jest ten tekst, jest fontem bezszeryfowym.
Wybór dobrych krojów pisma i wielkości na stronie jest bardzo, bardzo ważny. Tekst nie powinien być za mały (najmniejszy zalecany rozmiar liter na stronie internetowej to 16 pikseli, a dla zwykłego tekstu 20 pikseli), a do tego nie powinno być go zbyt dużo w poziomie – dlatego unikaj bardzo szerokich akapitów (jak w Wikipedii) i staraj się tak korzystać z pól tekstowych na stronie żeby w jednej linii nie było więcej niż 80-100 znaków.
Jak projektować strony internetowe? Krótkie podsumowanie
Jak widzisz, tworzenie stron internetowch to pewne wyzwanie, ale wcale nie takie straszne ;). Korzystając z narzędzi, które powstały żeby pomóc zrobić stronę internetową, z łatwością stworzysz ładną, a do tego skuteczną stronę internetową.
Może spróbujesz w kreatorze stron www WebWave?
Najczęściej zadawane pytania:
Jak w projektowaniu stron może pomóc darmowy kreator stron www?
Kreator stron internetowych bardzo ułatwia projektowanie funkcjonalnych stron www. Ten stworzony przez WebWave dodatkowo oferuje takie usługi, jak darmowy hosting i domenę (w ramach Planu Premium) oraz pomoc w pozycjonowaniu SEO (m.in. poprzez użycie słów kluczowych w tekście).
Czy budowę strony internetowej można oprzeć o gotowe szablony?
Owszem. Aby tworzyć strony internetowe dla firmy, nie musimy budować wszystkiego od zera. Wystarczy skorzystać z przygotowanych szablonów. Warto przy tym upewnić się, że nasza witryna internetowa będzie responsywna.
Popularne artykuły.
Kreator stron www WebWave umożliwia tworzenie stron www z pełną swobodą. Strony internetowe możesz tworzyć zaczynając od czystej karty lub wykorzystując szablony www. Strona www bez kodowania? To łatwe - zacznij już teraz.
contact@webwavecms.com
+48 731 395 898
Porozmawiaj z nami na czacie
Od godziny 08:00 do 24:00
Ta strona została stworzona w kreatorze WebWave.
Znajdziesz nas na:
Kreator WebWave.
Oferta.