10 najpopularniejszych trendów w projektowaniu stron internetowych w 2016 roku

Trendy w webdeisgnie 2016

Trendy w webdesign’ie na rok 2015

Internet zmienia się nieustannie. Jest to najszybciej ewoluujące medium, prawdziwy wulkan innowacji w porównaniu z takimi dinozaurami jak radio, prasa i telewizja.

Z jednej strony jest to świetna sprawa dla odbiorców, którzy dostają coraz bardziej angażujące, intrygujące i estetyczne treści. Z drugiej strony jest to ogromne wyzwanie dla wszystkich osób tworzących content: muszą być w ciągłym ruchu nieustannie się rozwijając, ucząc i pozostając na bieżąco z nowinkami.

Reklamy radiowe z roku 2015 nie różnią się drastyczne od tych z 2010. Telewizja również nie odnotowała wielkich różnic w sposobach konstruowania spotów reklamowych na przestrzeni ostatnich lat. A internet? To jest całkiem inna bajka! Nowe elementy pojawiają się niemal każdego miesiąca, a co kilka lat wchodzą kolosalne zmiany: interaktywne strony w HTML 5, Responsvie Web Design (wpasowywanie się w rozmiar każdego urządzenia jakie tylko obsługuje internet), flat design czyli zerwanie z dotychczasowym stylem graficznym… dzieje się, oj dzieje!


1.
Responsive Web Design
.

Responsywna strona internetowa, tzw. RWD

Strony responsywne, czy też mówiąc inaczej strony tworzone w zgodzie z RWD, to temat ostatnich tygodni. Wszystko za sprawą Google, które 21 kwietnia 2015 r. wprowadziło nowy algorytm wyszukiwania faworyzujący strony zgodne z RWD. Więcej o tym pisaliśmy w naszym artykule Co to jest RWD? Czy Google wymaga Responsive Web Design’u?

W skrócie: strony zgodne z RWD to strony dopasowujące swój wygląd do wielkości ekranu na którym są wyświetlane. Takie podejście do tworzenia stron przewija się już od dłuższego czasu, ale na dobrą sprawę przyjął się dopiero w 2013 roku. Aktualnie strony responsywne nie są już fajną nowinką, ale standardem który powinien występować na wszystkich aktualnie tworzonych stronach – ale tak nie jest. Wiele firm tworzących strony www jeszcze nie zaadoptowało tej techniki. A powinny, ponieważ strony niezgodne z RWD pozycjonują się znaczenie gorzej dla użytkowników wyszukujących informacje na urządzeniach mobilnych. W epoce wszechobecnych smartphonów nie jest to pożądane zjawisko.

2. Duże zdjęcia.Webdesign - duże zdjęcia lub tzw. heroe images

Jeden obrazek wart jest tysiąc słów – a duży obrazek jeszcze więcej.

Coraz więcej stron wykorzystuje ogromne, wysokiej jakości zdjęcia przykuwając uwagę internauty od razu po wejściu na stronę. W parze z takimi obrazkami idzie minimalistyczny design pozostałych elementów: menu często jest zawieszone nad obrazkiem lub wręcz zminimalizowane do postaci pojedynczego przycisku, obszerne teksty i bogata oferta są często umiejscowione w dalszej części strony, aby nie zaburzać pierwszego wrażenia po odwiedzeniu witryny. Ma być czytelnie i efektywnie. A jeszcze lepiej jeśli jest indywidualnie – zdjęcia ze stocków ustępują miejsca indywidualnym sesjom zdjęciowym na zlecenie klienta.

3. Atrakcyjna typografia, duże napisy.

Typografia w webdesignie - projektowaniu stron www

Czasy stosowania czcionek Arial i Times dawno już minęły. Obecnie jeszcze większy nacisk kładzie się na używanie starannie dopasowanych, przykuwających uwagę czcionek. Mówimy tutaj nie tylko o charakterystycznych napisach w roli nagłówków, ale również o typografii używanej w zasadniczym tekście na stronie.

4. Flat design, material design, minimalizm.

Flat design / material design

Minimalistyczne projektowanie polegające na odrzuceniu elementów, które nie są kluczowe w projekcie, zyskuje coraz większą popularność rewolucjonizując wygląd stron nawet największych serwisów internetowych. Ta popularność nie bierze się znikąd: Apple, Google i Microsoft skutecznie oswajają miliony użytkowników swoich smartphonów z takim podejściem stosując je w ramach wyglądu własnych systemów operacyjnych. iOS 7 wprowadził flat design do dziesiątek milionów iPhonów, a później Google trafił do jeszcze większej ilości użytkowników wprowadzając material design do najnowszych wersji Androida. Ci wielcy gracze rozpowszechniają nowe trendy w całej społeczności skupionej wokół technologii.

5. Przyciski “widmo”, czyli ghost buttons.

Ghost button w webdesignie

Kolorowe, starannie wyrysowane przyciski nadal znajdują zastosowanie, jednak w najbardziej zaszczytnych miejscach stron internetowych zasiadają tzw. “ghost buttons” czyli przyciski z przeźroczystym wnętrzem ograniczone tylko ramką i tekstem najczęściej w tym samym kolorze. Taki wygląd jest lekki w odbiorze, łatwo komponuje się z tłem i resztą strony oraz, jak wszystko co minimalistyczne, jest nowoczesny i kuszący.

6. Ikony.

Użycie ikon w projektowaniu stron internetowych

Ikony pozostają w zgodzie z postępującym trendem zastępowania tekstu obrazkami. Są czytelne, łatwo identyfikowalne i pozwalają na szybszą nawigację po stronie. w przypadku braku dostępu do odpowiednich zdjęć produktów lub usług mogą skutecznie zastąpić fotografię.

7. Nawigacja przyklejona do krawędzi ekranu.

Top menu, główne menu przyklejone dogórnej krawędzi ekranu

Coraz więcej projektantów decyduje się “przykleić” pasek z menu do górnej, a czasami bocznej lub dolnej krawędzi ekranu. Ma to sens w epoce długich, przewijanych stron – użytkownik cały czas ma dostęp do nawigacji strony bez konieczności wracania się przez wszystko, co już przeczytał na danej stronie.

73c7908f8688ff1bb0e7b1b6040afd008. Longpage’e i opowiadanie historii.

Rok 2015 to kolejny krok w  stronę ograniczania liczby kliknięć na rzecz przewijania. Internauci, przyzwyczajeni przez filozofię Facebooka i jego “niekończącej się strony”, chętniej przewijają treść niż klikają w jej zakładki. Takie podejście daje pewne plusy: możemy zaplanować historię, którą opowiemy użytkownikowi zakładając, że zacznie on przeglądanie strony od jej początku i będzie się przesuwał przez całą treść aż do końca. A spójna historia to większa szansa na dłuższe utrzymanie uwagi użytkownika i przekazanie mu pewnych informacji.

Jednak czy longpage musi być jednostornicowy? Wcale nie! Możemy użyc takiej konstrukcji tylko na stronie głównej i wykorzystać ją do pokazania przekroju oferty firmy. Pozostałe, obszerniejsze treści będą spokojnie czekały na klasycznych podstronach.

Użytkownik zainteresowany historią z pierwszej strony chętniej zgłębi temat na podstronach.

9. Układ kafelkowy lub tzw “siatka”.

Układ kafelkowy w webdesignie

Prezentacja dużej grupy zróżnicowanych treści coraz częściej odbywa się przy użyciu tzw. siatki lub kafelek przypominających osobne karteczki. Pinterest cały czas pozostaje wierny takiemu rozwiązaniu i jest to zrozumiałe przywiązanie: informacje są przejrzyście posegregowane, wizualnie oddzielone, ale zarazem duża ich ilość może pozostać skondensowana na niewielkiej przestrzeni bez utraty czytelności.

10. HTML 5 / CSS 3.

HTML 5 logo

Standardy programowania stron nie są widoczne dla laika na pierwszy rzut oka, jednak stanowią ogromną różnicę dla maszyn. Czysty, poprawny kod strony oparty o HTML 5 przekłada się na zdecydowanie lepsze pozycjonowanie strony w wyszukiwarce – roboty Google lubią przejrzystą strukturę! Już samo to jest wystarczającym argumentem, aby strona była napisana  w aktualnej wersji HTML. Ale wyszukiwarki to nie wszystko: nowości wprowadzone do HTML 5 pozwalają na większa interakcję użytkownika ze stroną oraz pozwalają na lepszą integrację serwisu www z urządzeniami mobilnymi i peryferyjnymi.

Większość stron posiada mnogość subtelnych, wkomponowanych w całość animacji, które zaczęliśmy uważać za standard i nie uświadamiamy sobie ich obecności

CSS 3 oraz jquery to osobne tematy związane z wyglądem stron. Jeszcze kilka lat temu jedyne animacje jakie widzieliśmy na stronach to agresywne flashowe banery reklamowe lub całe strony we flashu, które zarzynały nasze komputery. A dziś? Większość stron posiada mnogość subtelnych, wkomponowanych w całość animacji, które zaczęliśmy uważać za standard i nie uświadamiamy sobie ich obecności – do momentu gdy ich zabraknie. Menu już się po prostu nie pojawia – obecnie menu płynnie się wysuwa, często z dodatkowym efektem zmiany przeźroczystości lub wykrzywienia w perspektywie. Przyciski płynnie zmieniają kolor, zdjęcia zgrabnie wsuwają się na swoje miejsce, a komunikaty i formularze nie wyrzucają nagłych komunikatów, tylko pokazują atrakcyjne, ruchome plakietki. Internet żyje animacjami!

Podsumowanie

Powyższy przegląd dotyczy tylko najważniejszych trendów, a i tak zamienił się w długą listę nowinek. Niektóre z nich są obecne od pewnego czasu, inne pojawiły się dopiero na przestrzeni ostatniego roku. Jedno pozostaje pewne – internet się zmienia. Strony napisane 3 lata temu dzisiaj wydają się już przestarzałe, a internauci szybko wyłapują to, co zalatuje stęchlizną.

Jak jest z Waszymi stronami – opierają się próbie czasu?

Ta strona korzysta z plików cookies kliknij w ustawienia aby sprawdzić szczegóły.

Szanowni Państwo,

zgodnie z RODO- Rozporządzeniem Parlamentu Europejskiego i Rady (UE) 2016/679 z dnia
27 kwietnia 2016r. w sprawie ochrony osób fizycznych w związku z przetwarzaniem danych osobowych i w sprawie swobodnego przepływu takich danych oraz uchylenia dyrektywy 95/46/WE

Informujemy, że Administratorem Pani/Pana danych osobowych jest LIDER Marcin Skotnicki

Skotnicki ul. Zimnej Wody 1 / 6, 44 – 100 Gliwice tel. 539 974 335 e-mail kontakt@weblider.eu.eu
Dane osobowe, które nam Państwo przekazują, będziemy przetwarzać w następujących celach:
1.W celu niezbędnym do wykonania umowy, której jest Pan/Pani stroną, (zawarcie i wykonanie umowy lub podjęcia działań przed zawarciem umowy w celu jej zawarcia (przygotowanie i przedstawienie oferty), zgodnie z art. 6 ust. 1 lit b RODO.
2. W celu niezbędnym do wypełnienia obowiązku prawnego ciążącego na Administratorze zgodnie
z art. 6 ust. 1 lit c RODO.
3. Ponadto, zgodnie z art. 6 ust. 1 lit. f RODO, przetwarzamy dane osobowe w celu niezbędnym dla realizacji prawnie uzasadnionych celów Administratora (monitoring obiektu w celu zapewnienia bezpieczeństwa, marketing oferowanych przez nas produktów bądź usług, dochodzenie roszczeń).
4. Jeżeli przetwarzamy dane osobowe celu przesyłania informacji handlowych za pomocą środków komunikacji elektronicznej, np. reklam za pomocą poczty lub poprzez wykorzystanie telekomunikacyjnych urządzeń końcowych- wysyłanie wiadomości SMS o treści reklamowej, zgodnie z art. 6 ust. 1 lit.a RODO odbywa się to na podstawie odrębnie, dobrowolnie udzielonej nam zgody, którą można w każdym momencie wycofać.

Planowany okres przechowywania danych osobowych (art. 15 ust. 1 lit. D RODO)
Wszystkie dane osobowe będą usuwane zgodnie z wymogami archiwizacji danych bądź po wycofaniu zgody wyrażonej przez osobę, której dane dotyczą. Zgodnie z przepisami prawa, po osiągnięciu celu bądź wypełnieniu obowiązku prawnego Administratora zostaną one usunięte.

Prawa osoby, której dotyczą dane osobowe.
Informujemy iż w związku z przetwarzaniem Państwa danych osobowych przysługują Pani/Panu następujące prawa:
Posiada Pani/Pan prawo dostępu do treści swoich danych oraz prawo ich sprostowania, usunięcia ograniczenia przetwarzania, prawo do przenoszenia danych przetwarzanych w systemach informatycznych, prawo wniesienia sprzeciwu, prawo do cofnięcia udzielonej zgody w dowolnym momencie bez wpływu na zgodność z prawem przetwarzania (możliwość istnieje jeżeli przetwarzanie odbywa się na podstawie zgody, a nie np. na podstawie przepisów uprawniających administratora do przetwarzania tych danych).
Ponadto informujemy iż przysługuje Panu/Pani prawo wniesienia skargi do Prezesa Urzędu Ochrony Danych Osobowych, gdy uzna Pan/Pani, iż przetwarzanie danych osobowych Pana/Pani dotyczących, narusza przepisy ogólnego rozporządzenia o ochronie danych osobowych 679/2016 z dnia 27 kwietnia 2016 r.

Kategorie odbiorców danych /podmiotów przetwarzających dane osobowe
Odbiorcą Pani/Pana danych osobowych będą organy uprawnione na mocy przepisów prawa (w tym: Sądy, Policja, Prokuratura, organy egzekucyjne, ograny administracji ) lub inne podmioty przetwarzające dane osobowe w imieniu firmy LIDER Marcin Skotnicki.
– firmy windykacyjne, banki, operatorzy pocztowi, przewoźnicy
– firmy archiwizujące dokumenty, świadczące usługi techniczne, informatyczne
LIDER Marcin Skotnicki .nie będzie przekazywać Pani/Pana danych osobowych do państwa trzeciego lub organizacji międzynarodowej.

Gdy uzna Pan/Pani, iż firma LIDER Marcin Skotnicki. jako administrator danych, przetwarza je w sposób naruszający przepisy ogólnego rozporządzenia o ochronie danych osobowych z dnia 10 maja 2018 r., ma Pani/Pan prawo do wniesienia skargi do Prezesa Urzędu Ochrony Danych Osobowych.

Podanie danych osobowych w zakresie obowiązujących przepisów ustaw i rozporządzeń jest obowiązkowe, w pozostałym jest dobrowolne.

Pani/Pana dane nie będą przetwarzane w sposób zautomatyzowany, w tym profilowaniu.

Nazwa usługiCel wykorzystania usługiUstawienia
Cookies funkcyjneNie możesz wyłączyć tych plików cookies, ze względu konieczności ich do prawidłowego funkcjonowania strony.
Google AnalyticsStrona internetowa używa do zbierania danych demograficznych (zakres wieku, geolokalizację, płeć) z ustawień Google Analytics w celach analitycznych i statystycznych