Dołącz do czytelników
Brak wyników

Trendy w projektowaniu stron WWW

Artykuł | 22 grudnia 2018 | NR 28
275

W kwietniu 2016 r. w świecie cyfrowym funkcjonowało ponad miliard stron internetowych – konkurencja w sieci jest więc ogromna. Poza tym trendy w wyglądzie i mechanizmach działania stron www bardzo szybko się zmieniają, dlatego warto je śledzić i czerpać inspirację przy tworzeniu własnego portalu. 

Wybraliśmy kilka najbardziej popularnych nurtów i rozwiązań webowych, które zawładnęły internetem w 2016 r. i które jeszcze długo powinny być na topie. Sprawdź, które z nich możesz zastosować na swojej stronie.

POLECAMY

Przede wszystkim responsywność

Obecnie prawie 9 na 10 użytkowników internetu posiada przynajmniej jeden smartfon, a urządzenia mobilne to główne narzędzia, dzięki którym zwłaszcza ludzie młodzi łączą się z siecią. Dlatego niezależnie od tego, czego dotyczy Twoja strona, ani tego, czy tworzysz wielki serwis, czy one-page site, jedno jest pewne – musisz sprostać wymaganiom responsywności (responsive web design – RWD). Responsywność to, mówiąc najprościej, zdolność strony do automatycznego dostosowania układu treści do wielkości okna urządzenia, na którym jest wyświetlana. Mimo że o RWD mówi się już od dobrych kilku lat, badania wskazują, że wciąż duża część stron internetowych nie jest responsywna. Pamiętaj jednak, że strona, która nie dopasowuje się do rozmiaru ekranu, to dzisiaj nie tylko przeżytek, lecz także marketingowy strzał w stopę. W 2015 r. Google wprowadził zmiany, przez które w wynikach wyszukiwania na urządzeniach mobilnych jako pierwsze pojawiają się strony do nich dostosowane. Planując więc konkretne rozwiązania graficzne lub programistyczne na swoją stronę, upewnij się, że będą responsywne – zwłaszcza jeśli jej odbiorcami mają być przede wszystkim użytkownicy komórek czy tabletów.

Rysunek 1. Przyrost liczby stron internetowych na świecie od kwietnia 2000 r. do kwietnia 2016 r. (Źródło: //news.netcraft.com/archives/category/web-server-survey/)

 

Mniej znaczy więcej

Ten nurt w projektowaniu stron jest już znany od jakiegoś czasu, ale wciąż trzyma się nieźle i długo jeszcze pozostanie trendy. Mowa o minimalizmie. W czasach kiedy w każdej sekundzie jesteśmy bombardowani najróżniejszymi komunikatami, prostota jest w cenie. I jest prawdziwą sztuką. Żeby stworzyć stronę internetową w tym duchu, trzeba naprawdę dogłębnie przemyśleć jej budowę i wiedzieć, co dokładnie chce się zakomunikować – wyodrębnić to, co najważniejsze, zrezygnować z tego, co zbędne, postarać się o właściwą strukturę treści itd. 

Jak więc – poza ograniczeniem i uporządkowaniem treści – możesz nadać stronie minimalistyczny charakter? Przede wszystkim grając pustą przestrzenią, która – wbrew pozorom – ma wielką siłę przyciągania (zobacz dalej wymienione przykłady), ale też za pomocą uproszczonej nawigacji, np. hamburgera (ikonki, która dopiero po kliknięciu rozwija się do pełnego menu), prostej typografii i nienachalnych, stonowanych kolorów. Tak rozumiany minimalizm leży u podstaw dwóch poniższych, dominujących dziś stylów projektowania.

Flat design – styl, w którym nie stosuje się elementów dających złudzenie trójwymiarowości – (gradientów, cieniowania itp.), a kładzie nacisk na proste kształty i kroje tekstu oraz oszczędną paletę kolorów. Flat design ma długą historię, bo wywodzi się z Międzynarodowego Stylu Typograficznego rozwijającego się w Europie od początku XX w.; teraz przeżywa drugą młodość. Od czasu, kiedy stał się modny, zdążył już ewoluować – jego odświeżona i udoskonalona odsłona stylu to flat design 2.0, dopuszczająca stosowanie żywych, kontrastujących kolorów (np. dwóch dominujących barw – tzw. duotone), cieni i ekstrawaganckich fontów – 
wszystko po to, by ułatwić poruszanie się po stronie i uatrakcyjnić ją wizualnie. Jeśli chcesz zainspirować się stronami z całego świata wykonanymi w stylu flat, zajrzyj na: //www.awwwards.com/websites/flat-design/.

Material design – styl stworzony przez Google, będący młodszym bratem flat design. Został opracowany, by zapewnić użytkownikom jednakowe wrażenia podczas korzystania z różnych urządzeń. Początkowo był stosowany wyłącznie w środowisku mobilnym, ale z czasem stał się też popularny w projektach stron internetowych. Material design przywrócił trójwymiar do łask – to głównie za jego pomocą treść na stronie jest porządkowana. Więcej o material design dowiesz się z wytycznych Google: //www.google.com/design/spec/material-design/introduction.html/.

Podrasowany minimalizm

Oszczędna forma nie wszystkim przypada do gustu – jeśli zaliczasz się do tego grona, a mimo to chciałbyś jakoś wpisać się w nurt minimalizmu, wykorzystaj trendy, które dodadzą trochę życia prostym stronom WWW. 

Hero images

Pierwszego wrażenia nie da się wywrzeć dwa razy, dlatego warto zainwestować w naprawdę dobrej jakości całoekranowe zdjęcie (dzisiaj również: wideo, animację lub kinografikę), które zapewni, że odczucia internautów odwiedzających Twoją stronę będą wyłącznie pozytywne. Wrażenie użytkowników będzie tym lepsze, im bardziej wyjątkowy będzie obraz na stronie startowej. 

Sesję zdjęciową możesz wykonać samodzielnie (jeśli tylko masz odpowiednie umiejętności i sprzęt), zlecić jej wykonanie profesjonalistom (jeśli dysponujesz sporym budżetem) albo skorzystać z banków zdjęć. Zaletą dwóch pierwszych rozwiązań jest na pewno całkowita swoboda twórcza – barierę stanowić będzie tylko wyobraźnia i zasobność portfela, a wadą – wysokie koszty i ryzyko, że efekt końcowy będzie odbiegał od pierwotnych założeń. Z kolei pliki stockowe mają tę przewagę, że są dostępne od razu i można je kupić za niedużą kwotę albo nawet pobrać za darmo. Dodatkowo, już samo szukanie obrazów w banku zdjęć jest inspirujące – mając w głowie jakąś koncepcję i szukając obrazów konkretnego typu, można przypadkowo natknąć się na inne fotografie, które znacznie lepiej oddadzą planowany charakter strony. Ponadto, współcześnie banki zdjęć tworzą również artystyczne, zaangażowane kolekcje, zapraszając do współpracy uznanych fotografów i grafików. Przykładem może być kolekcja „Disconnect”, którą dla banku

Fotolia przygotowała trójka utalentowanych artystów z Europy (obejrzyj kolekcję na //blog.fotolia.com/pl/?s=disconnect). Wśród nich była polska fotografka Sonia Szóstak. Jej wysmakowana kolekcja fotografii z archipelagu Filipin urzeka autentyzmem i prostotą i świetnie nadaje się do wykorzystania w projektach internetowych.

Ze względu na fakt, że profesjonalne obrazy są coraz bardziej popularnym elementem web designu, projektanci zaczęli powszechnie stosować skalowalne grafiki wektorowe (SVG), pozwalające na wyświetlenie tej samej grafiki w jednakowej jakości na ekranach o różnej rozdzielczości (obraz nie traci na jakości podczas skalowania). Oczywiście pliki SVG mają też swoje ograniczenia, ale nie zmienia to faktu, że zdobywają internet.

Font is king

Wyjątkową stronę tworzą nie tylko piękne zdjęcia, filmy (najlepiej w rozdzielczości HD lub coraz częściej 4K) czy rozbudowane animacje, lecz także niepowtarzalne kroje pisma. Czasem wyst...

Pozostałe 70% treści dostępne jest tylko dla Prenumeratorów

Co zyskasz, kupując prenumeratę?
  • 6 drukowanych wydań magazynu Online Marketing
  • Dodatkowe artykuły niepublikowane w formie papierowej
  • Dostęp do czasopisma w wersji online
  • Dostęp do wszystkich archiwalnych wydań magazynu oraz dodatków specjalnych
  • ... i wiele więcej!
Sprawdź szczegóły

Przypisy