Osiągnięcie równowagi w projektowaniu stron internetowych wymaga pewnego myślenia, wysiłku i umiejętności, ale jest to absolutnie tego warte. Wspaniałą cechą balansu, która może być zastosowana do szerszej kategorii projektów jako całości, jest to, że zachowuje to, co tworzysz, od nadmiernego, przeładowanego bałaganu, który nie przynosi korzyści użytkownikowi. Innymi słowy, równowaga w projektowaniu stron internetowych gwarantuje, że jako projektant trafisz właśnie w ten słodki punkt moderacji. Nie za dużo, ale nie za mało. Nie za głośno, ale nie za subtelnie. Utrzymuje harmonijny wygląd całego projektu, jednocześnie zachowując wszystkie cele związane z użytecznością swoich klientów. Teraz jest to umiejętność, którą możesz umieścić w zestawie narzędzi projektanta! W tym artykule przyjrzymy się, w jaki sposób możesz włączyć odpowiednią równowagę w witrynach swoich klientów.

Symetryczna równowaga

Jednym z najczęstszych przykładów balansu, z jakim spotykasz się podczas przeglądania stron internetowych, jest symetria, choć możesz nie zdawać sobie z tego sprawy, ponieważ jest to tak płynnie przedstawione. Symetria jest niezwykle przyjemna dla oka i tworzy estetycznie dobrze zorganizowany i harmonijny projekt. Równowagę symetryczną określa się umieszczając elementy jednakowo po obu stronach poziomej lub pionowej osi środkowej. Innymi słowy, obie strony wyimaginowanej linii do nurkowania na środku strony są w zasadzie lustrzanymi odbiciami. Chociaż niektórzy krytycy mogą spisać ten typ równowagi jako nudny lub przewidywalny, to jednak przetrwał próbę czasu i pozostaje jednym z najlepszych sposobów, aby pokazać równowagę w projektowaniu stron internetowych.

cisco

Witryna Cisco zdecydował się na to wypróbowane, przetestowane i prawdziwe podejście do projektowania. Zwróć uwagę, że strona jest doskonale zrównoważona na całej jej osi pionowej. Jeśli zrobiłeś wyimaginowaną linię i podzieliłeś ją na środek strony głównej Cisco, zauważysz, że:

  • Ta sama liczba elementów na pasku nawigacji (w tym ikona wyszukiwania) po obu stronach
  • Nagłówek i pod-linia są równie długie po obu stronach
  • Przycisk wezwania do działania jest idealnie wyśrodkowany
  • Ta sama liczba elementów pod nagłówkiem "Szybkie zadania" po obu stronach

Chociaż strona może nie być najbardziej ekscytującym miejscem w historii, nie musi tak być, ponieważ firma sprzedaje sprzęt sieciowy. Dodatkowo, strona jest użyteczna i funkcjonalna, zarówno atrybuty, które klienci mogą docenić. Spójrzmy na dwa inne przykłady symetrii:

iwc

IWC Schaffhausen , szwajcarski zegarmistrz, ma stronę, która ma poziomą, symetryczną równowagę. Jeśli podzielimy stronę na środkową oś w dół, obie strony mają symetrię.

łodyga fasoli

To samo dotyczy Aplikacja Beanstalk App . Prosta, minimalistyczna konstrukcja, której środkowa oś przechodzi w połowie strony głównej, pozostawiając dwie połówki strony z poziomą, symetryczną równowagą.

Asymetryczna równowaga

Możliwe jest również polarne przeciwieństwo symetrii, asymetryczna równowaga. Nie dajcie się zwieść faktowi, że asymetria oznacza brak równoważności między częściami! Jak się wkrótce przekonacie, asymetryczna równowaga osiąga system przeciwwagi w designie, a nie w sposób, jakiego można się spodziewać. Asymetrię można reprezentować na wiele sposobów na stronie internetowej. Na przykład, połowa ekranu, w pionie lub w poziomie, może pochwalić się bardziej intensywnym elementem, podczas gdy druga połowa może mieć subtelniejsze elementy. Pomimo tej nierówności, zarówno pod względem siły, jak i liczby, równowagę tworzy zestawienie przeciwstawnych elementów. W ten sposób asymetria może być naprawdę piękna, może nawet bardziej niż prosta symetria, ponieważ opiera się na koncepcji odmienności, aby stworzyć równowagę. To paradoks projektowania, ale taki, który działa tak dobrze na każdej stronie. Asymetryczna równowaga jest zatem bardziej interesująca i dająca do myślenia niż przewidywalna symetria. Wywołuje tematy modernizmu, energii i cudu. Projektanci powinni jednak pamiętać, że tworzenie asymetrii na stronie wymaga więcej pracy niż zwykła symetria. W końcu musisz reprezentować relacje między elementami projektu, które są bardziej skomplikowane.

honda

Honda daje nam krystalicznie czysty przykład asymetrii w projektowaniu stron internetowych. Pod spodem, na swojej stronie głównej, firma korzysta z projektu opartego na karcie, ale powoduje to nieco chaotyczny wygląd, który jest wizualnie atrakcyjny i kolorowy, ale powoduje brak równości po obu stronach pionowej lub poziomej centralnej osi. Po pierwsze, same karty mają zawsze różne długości, są poziome i nie zawsze można je ułożyć w dowolnej jednolitej kolumnie lub rzędzie. Stwarza to dużą asymetrię, która jest bardzo interesująca. To prawie jak mały labirynt na stronie głównej firmy samochodowej! Istnieją również inne interesujące przykłady:

typographisme

Typographisme to doskonały przykład asymetrii w projektowaniu stron internetowych. Jego strona zawiera dwa elementy, które są krzywe. Zarówno logo TG, jak i zielony znaczek w prawym górnym rogu tworzą asymetrię.

duplos

Duplos "Asymetria jest silniejsza. Jego strona posiada konstrukcję pływającą, która nie będzie spójnie układać się z drugą połówką, niezależnie od tego, czy oś środkowa jest pionowa, czy pozioma. Ogólnie rzecz biorąc, tworzy przyciągający wzrok wygląd, który jest interesujący.

Balans promieniowy

Balans promieniowy jest dość prosty. Jak sama nazwa wskazuje, balans promienisty występuje, gdy wszystkie elementy projektu na stronie emanują w równych odstępach od jednoczącego, centralnego punktu. Jeśli więc podzielisz stronę pionowo lub poziomo wzdłuż centralnej osi, elementy obu stron będą równie daleko lub blisko punktu centralnego. Niektóre z najbardziej podstawowych przykładów balansu promieniowego to takie rzeczy jak promienie słoneczne pochodzące z centralnego punktu lub staw, który ma kilka zmarszczek na powierzchni. Tym, co sprawia, że ​​ta forma równowagi jest bardziej wyjątkowa, jest to, że efekt promieniujący idzie w obie strony: tak jak uwaga prowadzi od centralnego punktu, to również prowadzi do niej z powodu wspólnego centrum. Z tego powodu utrzymanie punktu centralnego jest łatwe.

vlog

Najlepszym przykładem balansu promieniowego - co jest dość rzadkie na stronach internetowych, zwłaszcza na stronach domowych - jest Vlog . Jest uosobieniem balansu promieniowego, ponieważ wszystko promieniuje na zewnątrz od centralnego punktu białego typu "Vlog.it".

Wszystkie rodzaje równowagi

Do tej pory powinno być dość oczywiste, że wszystkie rodzaje sald mają pewne wspólne więzi. Istnieją jednolite czynniki, które konsekwentnie pojawiają się w każdym projekcie, który cechuje atrakcyjna i interesująca równowaga. Równowaga w projektowaniu stron internetowych jest wszędzie wokół ciebie. Prawdopodobnie nie doceniasz tego na wszystkich stronach, które przeglądałeś przez całe życie; ale to tylko dlatego, że równowaga nie jest pierwszą rzeczą, o której myślisz, kiedy poruszasz się po dowolnej stronie. Niemniej jednak, równowaga jest ważna dla projektu witryny. Nie tylko zapewnia estetyczne elementy, które są interesujące z wizualnego punktu widzenia. Może także pomóc użytkownikowi w łatwiejszym wchłonięciu informacji wizualnych na stronie, co nie oznacza również poprawy nawigacji po stronie. Projektanci mogą dążyć do osiągnięcia lepszego balansu w projektowaniu stron internetowych, zwracając szczególną uwagę na harmonię, przeciwwagi i równoodległość. Końcowy wynik dobrego bilansu to wypłata niewykorzystanej dywidendy dla klientów i doświadczenia użytkownika.