Trendy webdesign 2017

Trendy webdesign 2017

Kontynuując temat trendów w webdesgn można powiedzieć, że nadal obowiązuję przewijanie stron w dół oraz efekt parallax, jak również układy kart.

motyw wordpress ikony
Ikony na stronach www – motyw wordpress Monstroid

Ikony

Ikony bardzo podobają się użytkownikom. Osobiście nie lubiłam ikon na stronach www, bo nie zawsze wiadomo było co dany obrazek oznacza. Kiedyś ikony były malutkie i trzeba było się dopatrywać co to właściwie jest. Ideałem było jeśli po najechaniu myszą pojawiał się napis i można było odcyfrować znaczenie ikony.

Ikony stosuje się coraz częściej i stają się rozpoznawalne. Często stosowane ikony bootstrapa czy font awesome są podobne i przyzwyczajamy się do nich jak do znaków drogowych. Dzięki stosowaniu webfonts ikony nie są malutkimi obrazkami marnej jakości. Można je dowolnie powiększać, stosować kolory, co ułatwia ich odczytanie.

Ikony szczególnie często wykorzystuje się w układzie kart czyli krótkie opisy np. usług firmy plus duża ikona jako ilustracja. Jedynym kłopotem może być znalezienie odpowiedniej ikony, która pasuje do tego co chcemy opisać. Np. na stronę o zwierzakach mamy tylko ikonkę odcisku łapki. Ale ilość ikon się stale zwiększa.

Pokrewnym tematem jest korzystanie z ilustracji zamiast zdjęć. Są ciekawsze i często zabawne.

Typografia i zdjęcia

Technologia umożliwia coraz szersze użycie ciekawych fontów na stronach www – najprościej dzięki użyciu Google fonts. Dalej utrzymuje się moda na strony typu “one page”, zbudowane z poziomych części zawierających krótkie teksty wyświetlone dużą czcionką. Towarzyszą im duże, piękne zdjęcia w tle oraz przycisk “call to action”. Aby części strony odróżniały się od siebie stosuje się różne tła lub zdjęcia w tle.

Zdjęcie w nagłówku tzw. hero image musi być szczególnie atrakcyjne. Nadal popularne są slidery, które pozwalają na pokazanie wielu zdjęć. Z kolei zdjęcia poniżej, które są mniej ważne, często przykrywa się warstwą przezroczystego koloru aby napis był bardziej czytelny.

Coraz częściej stosuje się animacje, duże animowane gify oraz wideo. Rozwój technologii pozwala na używanie wideo tak że nie będzie ono blokowało strony, dzięki temu jego zastosowanie będzie rosło.

Problemem jest tu dźwięk, gdyż nie ma nic bardziej irytującego jak dźwięk na stronach www, szczególnie wtedy gdy nie wiadomo jak go wyłączyć. Super wygląda ruchomy hero image, czy jest to wideo czy animowany gif. Ale automatycznie odtwarzająca się reklama dźwiękowa lub, co gorsza, muzyczka na stronie, bardzo przeszkadzają.

Efekt Split-screen

Ciekawym rozwiązaniem jest tzw. “split-screen” czyli ekran podzielony na dwie kolumny, które na urządzeniach mobilnych ustawiają się jedna pod drugą. Kolumny mogą być równiej szerokości lub nie. Układ ten pozwala na ogromną ilość kombinacji.

Split-screen może obejmować dwie części o równej szerokości i równej ważności, różniące się tłem.

Split-screen może też przypominać kartę obróconą o 90 stopni, gdzie po jednaj stronie znajduje się zdjęcie a po drugiej opis. W zasadzie jest to karta w poziomie, a więc tyczą się do niej zasady budowy układu kart.

Split-screen dobrze sprawdza się na stronach, gdzie jest mało treści a dużo zdjęć lub ilustracji. Można eksperymentować z kolorami i typografią.

 

responsive_wp_728x90


Profesjonalny Hosting


13 Comments
  1. Cześć, bardzo fajny artykuł. Szczerze to nawet nie miałem pojęcia o tym całym split-screenie, a widzę, że to może znacznie pomóc mi w pracy. Dziękuje bardzo za rzeczowy artykuł.

  2. To fakt, ikony kiedyś to był jeden wielki piksel nie do rozpoznania. Na szczęście wszystko idie do przodu. Tworzy się więcej domen, które ułatwiają życie i wprowadzają hasztagi, kategoryzują stronę na działy, jak bitevil.com, co znacznie ułatwia poruszanie się po stronie.

  3. Coraz częściej pojawia się ten motyw split screena. Myslę, że to bardzo przyciąga uwagę odbiorcy i ułatwia znalezienie szukanej rzeczy/usługi na stronie.

Leave a reply

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *