Współczesne trendy w projektowaniu stron internetowych. Bezbarwny - guziki duchy

Stworzenie zwykłej strony internetowej nie jest tak prostym zadaniem, jak stworzenie skutecznego narzędzia marketingu internetowego o nowoczesnym designie. Piękna i dobrze zoptymalizowana strona internetowa wymaga dużo czasu, inwestycji, a nawet inspiracji. Jak zaprojektować stronę internetową, aby przyciągnąć więcej klientów? Dowiemy się tego w artykule.

Według Internet Live Stats na świecie istnieje ponad 1,2 miliarda stron internetowych. Co sekundę wartość ta zwiększa się o około 10 jednostek. Niezależnie od branży, w której działasz, Twoja witryna internetowa musi być na bieżąco zarówno pod względem technologicznym, jak i projektowym. W tym artykule skupimy się na wygląd strona internetowa - jak powinna wyglądać w 2017 roku. Czcionki, które są zbyt jasne, kolorowe i pretensjonalne, od dawna uważane są za przestarzałe. Ikony zastępują obrazy, aby ułatwić użytkownikom nawigację po pozycjach menu. Te fakty są jednak znane większości specjalistów zajmujących się marketingiem internetowym. Z tego artykułu dowiesz się jak to powinno wyglądać nowoczesny design witryny.

1. Projektowanie stron internetowych koncentruje się przede wszystkim na urządzeniach mobilnych.

Tak zwane podejście mobile-first do tworzenia stron internetowych istnieje już od ponad 5 lat. Choć nie jest to nowy trend, zdecydowanie warto go odnotować, ponieważ stał się koniecznością dla każdego właściciela firmy, jeśli chce zwiększyć sprzedaż za pomocą tego kanału marketingowego.

Co oznacza podejście mobile-first? Jest to tworzenie stron internetowych, które koncentruje się na responsywności mobilnej. Stosowanie projektowania responsywnego ma sens, zwłaszcza jeśli weźmie się pod uwagę oficjalne statystyki publikowane przez StatCounter, niezależną agencję analityki internetowej. Według niego udział korzystania z Internetu za pośrednictwem urządzeń mobilnych wynosi 51,3%. Z tego powodu Google zaprzestał wspierania swojej usługi wyszukiwania błyskawicznego. Ta funkcja była dostępna dla użytkowników komputerów stacjonarnych i oferowała wyniki wyszukiwania, gdy osoba właśnie wprowadzała zapytanie. Dzięki zwiększonemu ruchowi właściciele firm będą mogli uzyskać większą sprzedaż. Dlatego skupienie się na szerszej publiczności ma sens.

2. Ukryta nawigacja

Wielu z nas słyszało, że aby zwiększyć procent wykonania docelowej akcji przez użytkownika, należy zminimalizować liczbę wymaganych kliknięć. Im mniej kliknięć, tym wyższa konwersja. Pomimo tego, nowoczesne projektowanie stron internetowych często wiąże się z obecnością ukrytego wyskakującego menu, które pojawia się po kliknięciu w tzw. „hamburgera”. Rozwiązanie to opiera się na adaptacyjnym podejściu do projektowania, gdy konieczne jest takie ułożenie menu, aby wyglądało poprawnie na urządzenia mobilne.

Tradycyjna nawigacja witryny, która zawiera elementy umieszczone w górnej części strony, zajmuje zbyt dużo miejsca i ogranicza możliwość zwrócenia uwagi użytkownika na sensowną treść. Tworzenie ukrytej nawigacji ma jeszcze jedną zaletę, która pozwala stworzyć bardziej atrakcyjną i efektywną stronę główną.

3. Przestronny pierwszy ekran

Wyskakujące menu tworzy dodatkową przestrzeń na pierwszym ekranie strona główna. Pozwala to podkreślić główne atuty firmy, stosując większą czcionkę, atrakcyjniejsze i czytelniejsze ikony, np skuteczna atrakcja uwagę użytkownika. Era „im więcej informacji, tym lepiej” należy już do przeszłości. Ważne jest, aby użytkownik przeszedł płynną ścieżkę, której celem jest pomyślnie zrealizowana docelowa akcja. Więcej wolna przestrzeń zapewnia projektantom możliwość realizacji swoich najlepsze pomysły na stronę główną serwisu, co uczyni ten kanał marketingowy wyjątkowym i atrakcyjniejszym dla użytkowników. Najlepsze opcje projekty stron internetowych zawierają pierwszy ekran z obrazem tła o pełnej szerokości i kilkoma delikatnymi kolorami. Obszary nawigacyjne powinny być łatwo rozpoznawalne i czytelne dla użytkowników.

4. Wyznaczone obszary nawigacyjne

Ukryte menu i przestronny pierwszy ekran pozwalają zaprojektować witrynę w taki sposób, aby skupiała uwagę użytkowników na kilku kluczowych elementach nawigacyjnych, co pomoże im szybciej i łatwiej podejmować decyzje. Takie podejście zachęca użytkowników do poruszania się po menu, wykonywania potrzebnych kroków, bez marnowania czasu na wyszukiwanie żądany przycisk. Dzięki przestronnemu pierwszemu ekranowi możesz podkreślić kluczowe elementy, stosując większe czcionki i pozostawiając między nimi więcej odstępu, podkreślając w ten sposób najbardziej przydatne treści.

5. Tworzenie projektu strony internetowej w stylu Material Design Lite

Material Design stał się ważnym rozwinięciem tzw płaska konstrukcja, szeroko stosowany trend w ciągu ostatnich kilku lat. Projekt Androida powstał jako interfejs dla urządzeń mobilnych, ale obecnie całkowicie podbił także komputery stacjonarne. To wizualne podejście sprawia, że ​​użyteczność jest kluczowym elementem całego projektu. Materiał Projektowanie Lite(MDL) to następna generacja Material Design. Zawiera wytyczne, zestawy układów i ogólną strukturę z narzędziami, które pozwalają każdemu projektantowi szybko i łatwo stworzyć witrynę MDL przy użyciu wygodnego wyboru palet.

6. Duże ikony

Popularność ikon w projektowaniu stron internetowych tłumaczy się tym, że po trzech dniach człowiek zapamiętuje 65% informacji wizualnych i tylko 10-20% informacji pisanych lub mówionych. Dlatego ludzki mózg łatwiej przetwarza obrazy niż tekst. Warto zaznaczyć, że ikona musi odpowiadać tekstowi, do którego się odnosi, aby nie wprowadzać użytkowników w błąd. Znudzone obrazy ludzi z przesadną i sztuczną mimiką są przestarzałe. Ikony muszą być również wektorowe, aby wyświetlały się poprawnie na dowolnym urządzeniu. Możesz obejrzeć przykłady projektów stron internetowych w naszym serwisie i zapoznać się z naszą pracą.

Główne wymagania dotyczące używania ikon w projektowaniu stron internetowych:

• Ikona musi pasować do treści;
• Musi zawierać jasny przekaz;
• Musi to być wektor;
• Ikona powinna być łatwa do odczytania, niezależnie od tego, czy jest mała, czy duża.

Przejdźmy dalej ostatnie trendy w wyborze czcionek i kolorów witryny.

7. Proste czcionki i miękka paleta kolorów

Toksyczne kolory w projektowaniu stron internetowych wypadły z łask około piętnaście lat temu. Teraz projektanci przeszli na powściągliwe pastelowe odcienie, miękkie, nie krzykliwe kolory. Schemat 60-30-10 nie traci na znaczeniu: w nowoczesny projekt strony internetowej Dominują neutralne kolory od bieli do jasnoszarego, 30 procent przestrzeni wykorzystuje jaśniejszy ton, a tylko 10% jest pomalowane na bogaty kolor, tworząc w ten sposób wezwanie do działania.

Tworzenie stron internetowych wkroczyło w erę prostego piękna, w którym preferowane są duże i proste czcionki z kilkoma delikatnymi odcieniami. Jak można wytłumaczyć tę tendencję? Takie podejście ma sens, ponieważ skupia uwagę użytkowników wyłącznie na najbardziej ważne bloki Informacja.

Zaprezentowaliśmy lista podstawowa nowe trendy w projektowaniu stron internetowych. Tak naprawdę jest nas znacznie więcej, co sprawia, że ​​materiał jest zbyt obszerny na jeden artykuł. O najnowszych rozwiązaniach projektowych w tworzeniu stron internetowych na pewno będziemy nadal opowiadać na naszym blogu.

Nasz zespół chętnie pomoże Ci w tworzeniu projekt adaptacyjny strona, w której zostaną przedstawione główne trendy w projektowaniu stron internetowych i skuteczne technologie w celu osiągnięcia maksymalnej optymalizacji. Napisz do nas na a chętnie pomożemy!

Wśród projektantów panuje powszechne przekonanie, że trendy będą ważną częścią ich pracy. Być na bieżąco najnowsze aktualizacje uważa się za obowiązkowe. Wielu projektantów ocenia pracę innych przez pryzmat trendów, a oznaczanie niektórych prac tagiem #old może zostać odebrane jako obraza, tak jakby projekt nie uwzględniał najnowszych trendów i automatycznie stawał się mniej wartościowy.

Są jednak powody, aby podążać za trendami. Sprawdzanie witryn takich jak Awwwards, FWA lub CSS Design Awards może Cię zainspirować, a w rezultacie pomóc Ci wyjść poza swoje nawyki projektowe. Można poznać nowe wizualne światy, z którymi można się później (świadomie lub nie) zintegrować język graficzny. Obserwowanie pracy innych pomaga doskonalić własne umiejętności, a także być na bieżąco z najnowszymi technologiami.

W ciągu ostatniego roku lub dwóch dało się zauważyć, że wielu projektantów stara się odchodzić od prostych kompozycji. Pojawia się coraz więcej otwartych, pozornie chaotycznych, „połamanych” i „pociętych” prac projektowych. Dotychczasowe gloryfikowanie siatki traci na znaczeniu, a zasady ulegają celowej i świadomej zmianie. Treść zaczyna się poruszać, wydaje się poruszać, a jej części czasami nakładają się na siebie i przeplatają.

Ewolucja Canvas i WebGL odgrywa w tym procesie dużą rolę. Nowoczesne projekty często nieco zagmatwane, mniej intuicyjne niż minimalistyczne, ale z pewnością pozostawiają trwałe wrażenie na użytkownikach.

Co jeszcze nas czeka w projektowaniu stron internetowych w 2017 roku? Oto moje przewidywania.

Otwarta kompozycja

Do niedawna w świecie designu dominowały kompozycje „zamknięte”, symetryczne i statyczne. Od 2016 roku pojawiło się wiele witryn, które odeszły od tego stylu. Coraz większą popularnością cieszą się otwarte kompozycje, z dowolnie rozmieszczonymi elementami biegnącymi gdzieś poza ekranem – przykłady takich prac można zobaczyć na romainpsd.com, durimel.io czy booneselections.com. Rozmieszczenie elementów na tych stronach sprawia wrażenie, jakby nadal żyły za monitorem.

Asymetria

Rok 2016 złamał także panującą w branży od dłuższego czasu zasadę symetrii. przez długi czas. Wielu projektantów stworzyło asymetryczne układy, którym daleko do idealnego zrównoważenia po lewej i prawej stronie. Jako przykłady chciałbym pokazać Państwu znakomitą witrynę Culture.pl, chaotyczny Dada-data.net oraz wspomniane wcześniej durimel.io.

Różnorodność

Projektanci stworzyli bardziej dynamiczne kompozycje, w których występuje więcej przecinających się ukośnych linii (poigneedemainvirile.com, vanderlanth.io) lub bardziej złożone kształty (residente.com/en, helloheco.com, przewidywalnyświat.watchdogs.com).

Iluzja chaosu

W 2016 roku wielu projektantów świadomie i celowo zaczęło odchodzić od minimalistycznego designu. Była chęć Więcej wolności i mniej sztywne podejście do projektowania. Za tym kryje się oczywiście potrzeba zmian, ale też zwykłe poczucie nudy. W pewnym momencie każdemu znudzi się tworzenie prostych układów z prostych elementów.

Analizując jednak projekty z 2016 roku można zauważyć, że chaos tylko pozornie jest chaosem. Układy nadal opierają się na klasycznym kontraście kształtów, kolorów, faktur, rozmiarów itp. Zmienił się układ poszczególnych elementów i harmonia zależności między nimi. W dzisiejszych czasach coraz częściej, pomimo banalnej logiki, nagłówki, ikony czy bloki tekstu są przesuwane. Pomimo tego, że wchodzą w skład tego samego bloku tematycznego, są oddzielone i umiejscowione w przyzwoitej odległości od siebie. Nie są one wyrównane do tej samej krawędzi i mają różne podkłady.

Niektóre figury geometryczne „zawieszone w powietrzu” mają jedynie funkcję dekoracyjną (melanie-f). Jest to również typowe dla nakładających się elementów. Teksty częściowo pokrywają się ze zdjęciami, jak na e03.epicurrence.com i melville-design.com, lub obrazy nakładają się na siebie, jak można zobaczyć na olivierbernstein.com.

To także charakterystyczna technika przełamywania utartej minimalistycznej harmonii. Ogromne tytuły ostro kontrastują z delikatnymi i subtelnymi strukturami i kolorami.

Bogate tła i wzory

Coraz częściej pojawiają się tła i wzory, na których znajdują się drobne kreski, paski czy kropki.

Szczególnie powszechnym wzorem jest wzór siatki, który stanowi „ramę” dla innych elementów układu. Elementy te poruszają się paralaksy wzdłuż siatki i często są rozmieszczone chaotycznie.

Wzór siatki

Jedną z pierwszych witryn, na której pojawiła się taka siatka, był werkstatt.fr, który jednak nie zastosował charakterystycznych animacji.

Nieco inny sposób wykorzystania wzoru siatki pokazano na stronach klimov.agency, brand.uber.com i maisonullens.com. W takich przypadkach siatka pełni bardzo specyficzną funkcję – sprawia, że ​​ruchy elementów są logiczne. Pozwala to zracjonalizować niestandardowe rozwiązania i daje odpowiedź na pytania typu „dlaczego marginesy ilustracji nie pokrywają się z marginesami przycisku”? Tworzy to rytm, a jednocześnie usprawiedliwia jego naruszenie.

Dekoracyjne detale

Co tak naprawdę zmieniło się w Ostatnio, więc to jest podejście do szczegółów. Następuje stopniowe odchodzenie od minimalizmu. Istnieje wiele innych elementów, które pełnią jedynie funkcje dekoracyjne. „Latające” kształty geometryczne i odpowiadające im fragmenty. Liniowe, mizerne ikony odrywają się nieco od treści, które ilustrują. Podkreślenia i linie są przesunięte. Pojawiają się ziarnistości i usterki, jak na bigyouth.fr lub kikk.be.

Przyciski rzadziej są tworzone w postaci wyraźnych prostokątów z tekstem w środku. Często pojawiają się jako miękkie, przesunięte linie, takie jak te na dahllaw.dk lub yasuhiroyokota.com. Inną opcją przycisku jest spektakularne najechanie myszką na Canvas, tak jak na hpsoundincolor.com i cavalierchallenge.com.

Przemyślane koncepcje - płynne animacje pomiędzy sekcjami

Animacje na stronach internetowych nie są niczym nowym. Co więcej, nie można powiedzieć, że są one sprzeczne z podejściem minimalistycznym. Jednakże, podobnie jak Canvas, stanowią one ważną część większych możliwości projektowania stron internetowych. A nowe możliwości są zawsze kuszące, bo pozwalają zrobić coś innego, świeżego i oryginalnego.

Bogactwo animacji eliminuje ostry podział strony na sekcje. Strona zmienia się płynnie podczas przewijania. Treść pojawia się i znika za pomocą miękkich animacji. Sekwencje tych przejść są coraz bardziej skomplikowane. To nie są przypadkowe efekty pomiędzy blokami treści, ale przemyślana koncepcja, w której pojawia się każdy element odpowiedni czas(Nationalgeographic.com, stylenovels.com). Animacje są częścią witryny od samego początku, a nie tylko dodanym przypadkowym szczegółem.

Ciekawe animacje zdobią proste układy. Dodają nową wartość i czynią stronę wyjątkową. Stają się esencją całego projektu, jak na Ifly50 czy tennentbrown.co.nz. Animacje często tworzą piękną, elegancką strukturę na stronach internetowych: Cuberto.com, lookbook.wedze.com, skarv-fashion.com czy corentinfardeau.fr.

Zróżnicowana typografia

Zmieniające się trendy widać także w stosowanej czcionce. Do niedawna w całym Internecie dominowały proste, neogroteskowe czcionki, takie jak Helvetica, Roboto, Lato czy Open Sans. W tytułach częściej pojawia się nieco bardziej „dekoracyjna” neogroteska i to nie tylko prosta wersja jest zaznaczone dla pozostałej części tekstu. Czcionki szeryfowe praktycznie nie są używane.

W ciągu ostatnich 2 lat sytuacja zaczęła się zmieniać. Projektanci odważnie sięgają po różne rodzaje czcionek. Teraz chętniej pracują z kontrastami - łącząc czcionki szeryfowe i bezszeryfowe.

Dużo się dzieje w typografii używanej na stronach internetowych. Teksty są animowane, podzielone na poszczególne litery, a w tekstach umieszczane są różne efekty, obrazy i filmy.

Większe możliwości technologiczne i odważniejsze decyzje napędzają wzrost różnorodności typografii internetowej.

Czcionki geometryczne

Dużą popularnością cieszą się geometryczne czcionki bezszeryfowe, takie jak klasyczna Futura, ITC Avant Garde, Proxima Nova, czy te dostępne w bibliotece Google – Poppins czy Montserrat. Czcionki te są znacznie bardziej wyraziste niż „niewidzialny” neo-bezszeryfowy. Bardziej „agresywny” i wyrazisty charakter strony internetowej można uzyskać stosując większą grubość, jak w dość starej witrynie hugeinc.com, ale tutaj są nowsze przykłady: sekwencja.co.uk, startuplab.no czy www.protest.eu .

Czcionki szeryfowe

Bardzo często czcionki szeryfowe są używane nie tylko w tekście głównym, ale także w przypadku dużych nagłówków. Szczególnie często używane są dekoracyjne, takie jak te na duhaihang.com czy jennyjohannesson.com. Więcej popularne czcionki można nazwać tymi, które należą do Bodoniego lub Didota.

Czcionki o stałej szerokości („maszyna do pisania”)

Używaj czcionek proporcjonalnych, z którymi zwykle się kojarzy maszyny do pisania- innowacja. Teraz można je zobaczyć na takich stronach jak admirhadzic.com, cuberto.com czy designembraced.com.

Kontrastowa kombinacja czcionek

W 2016 roku powszechne było odchodzenie od miękkich, harmonijnych kombinacji czcionek na rzecz wyraźniejszego kontrastu. Wyraziste kombinacje zostały wzmocnione przez wysoki kontrast rozmiarów tekstu. Duże i dekoracyjne czcionki zestawiono z prostymi czcionkami geometrycznymi, tak jak geometryczne nagłówki zestawiono z czcionkami szeryfowymi w tekście treści.

Ogromna typografia jako część głównego obrazu

Bardzo fajną i powszechną rzeczą było użycie bardzo dużych rozmiarów tekstu na głównych obrazach. Stworzyło to bardzo silny kontrast między nagłówkami a resztą treści. Przykłady można zobaczyć na oursroux.com, femmefatale.paris lub monsieurcaillou.com.

Czasami jako ozdobę stosuje się na początku napisy, jak np. coretinfardeau.fr lub pielęgnowaredigital.com.

Uderzający przykład Wspomniana strona to jennyjohannesson.com, która wykorzystuje walory dekoracyjne czcionki szeryfowej Goku.

Dodatkowe efekty stosowane w typografii

Można zaobserwować silną integrację typografii z obrazami, filmami i animacjami. Poszczególne sekcje są ze sobą powiązane – typografia współdziała zarówno z tłem, jak i innymi elementami. Losowe umieszczanie typografii na ciemnym obrazie należy już do przeszłości. Dziś projektanci budują ciekawe relacje pomiędzy wszystkimi elementami, wplatają w tło typografię, animują ją itp.

Duże litery w tekstach

Kiedy zaczynałem swoją przygodę z projektowaniem stron internetowych, miałem stary zwyczaj używania czcionki o rozmiarze 10, który nabyłem, pracując w druku. Szybko jednak zorientowałem się, że w sieci optymalny czytelny rozmiar to 14.

Obecnie można zauważyć, że projektanci używają znacznie większych czcionek, zwłaszcza jeśli chodzi o czcionki szeryfowe.

Przejdź na ciemną stronę

W 2016 roku projektanci zastosowali różne kolory. Można jednak zauważyć tendencję do wybierania ciemnych tonów.

Trend tworzenia całkowicie białych stron internetowych staje się coraz mniej popularny i ustępuje miejsca szarym wariacjom, teksturom i wzorom. Obecnie dość powszechne jest tworzenie ciemniejszych miejsc, gdzie czerń lub jej gradacja wypełnia tło i tworzy nieco mroczny, groteskowy nastrój.

Mimo to trudno przewidzieć, jak tendencja ta będzie narastać w ciągu roku. Kolory są jednak częścią identyfikacji wizualnej marek, trudno więc oczekiwać od nich zasadniczej zmiany komunikacji w oparciu wyłącznie o popularność określonych trendów.

Podsumować

Rok 2017 obiecuje wiele ekscytujących perspektyw, ale na horyzoncie pojawiają się także pewne niebezpieczeństwa.

Osobiście obawiam się, że wielu projektantów stron internetowych może być nieco zbyt pewnych siebie, jeśli chodzi o pracę z Canvas. Dodaj do tego nowe trendy, a otrzymasz wiele efektownych i mało znanych stron internetowych dla szerokiego grona odbiorców.

Trochę mnie też niepokoi fakt, że wiele współczesnych dzieł nie będzie działać poprawnie na wszystkich przeglądarkach i urządzeniach mobilnych. Odniosłem wrażenie, że wróciliśmy do punktu wyjścia. Jesteśmy obecnie w sytuacji podobnej do czasów, gdy Flash, mimo że rządził Internetem, był obwiniany za brak responsywności i wysokie wymagania dotyczące łącza internetowego.

Przeraża mnie także fakt, że nowe trendy w kierunku „dekonstrukcji” nie będą możliwe do zastosowania w przypadku klientów komercyjnych lub po prostu nie będą pasować do ich profilu komunikacyjnego. (Strony internetowe instytucji rządowych i bankowych nie mogą być zaśmiecone).

Zastanawiam się, ile czasu zajmie, zanim nowe trendy zadomowią się na rynku komercyjnym. Warto zaznaczyć, że zdecydowana większość stron, które posłużyłem się jako przykłady, została stworzona dla agencji, projektantów i branży kreatywnej. Witryny te często ustalają własne zasady i zwykle wyprzedzają konkurencję w porównaniu z innymi branżami. Czasami trendy potrzebują dużo czasu, aby stać się popularne w niszy i przedostać się na rynek komercyjny. Następnie ich kształt jest nieco wygładzony, aby każdemu odpowiadał.

Mimo to uważam, że rok 2017 zapowiada się bardzo obiecująco, jeśli chodzi o projektowanie stron internetowych. Powiedzieć, że era minimalizmu dobiega końca, byłoby przesadą, ale zdecydowanie podlega on zmianom i rozwojowi.

Minimalizm stanie się bardziej złożony i szczegółowy. Strony internetowe w tym roku będą coraz częściej korzystać z Canvas. W przyszłych projektach zobaczymy dużo chaosu, różnorodności form i ekspresji. To dobra wiadomość dla projektantów, którzy mają dość minimalistycznych stylów projektowania Flat, Material czy Metro.

Każdego roku uczymy się czegoś nowego o projektowaniu i rok 2016 nie jest wyjątkiem. Artykuł, który napisaliśmy w zeszłym roku, odniósł taki sukces, że postanowiliśmy przedstawić pewne prognozy na 2017 rok, więc zaczynajmy!

Wyszedł nowy artykuł → ← Przeczytaj i zainspiruj się!

Na trendy w projektowaniu wpływają media, technologia, branża modowa, a ostatnio także użyteczność. Trend pojawia się powoli, stopniowo, przenikając wszystkie obszary designu, a następnie znika w dokładnie taki sam sposób. Większość trendów projektowych utrzymuje się nie dłużej niż rok lub dwa lata. Design w 2017 roku będzie kontynuacją trendów zapoczątkowanych w 2016 roku, z kilkoma nowymi zmianami. To uczucie jest dobrze znane i znajome i być może zauważyłeś je w ciągu ostatnich kilku lat. Główny wpływ pozostaje Material Design firmy Google, z niewielkimi zmianami.

Jakie trendy w projektowaniu stron internetowych czekają na nas w 2017 roku

01. Półpłaska konstrukcja

Od kilku lat na rynku projektowania stron internetowych najpopularniejsze jest projektowanie płaskie, jednak obecnie pod wpływem Material Design staje się ono coraz bardziej jednowymiarowe. To przejście zaczyna się od kilku jasnych cieni, dzięki czemu projekt jest półpłaski. Ewolucja płaskiego designu od stylu minimalistycznego przechodzi w kierunku nowych rozwijających się technologii. Płaska konstrukcja nadal istnieje, ale przeszła pewne ulepszenia.

Gładkie cieniowanie dodaje głębi i złożoności, nie psując wrażenia płaskiej konstrukcji. Ten Nowa cecha dołączyły do ​​płaskiego trendu i będą się nadal rozwijać w 2017 roku.

Projekt: Zasób | Narzędzie UI/UX dla usług sieciowych
Autorzy: Rusłan Łatypow; Grafika LS; Anton Miszyn; Walery Gurkow

Projekt: Playlista słuchacza

02. Poruszające fotografie (Kinematografy)

Kinografiki to nie to Animacje GIF, które widzimy wszędzie w Internecie. Kinografie to nieruchome obrazy z niewielkimi elementami ruchu. Ta technika sprawia, że ​​proste zdjęcie staje się bardziej realistyczne.

03. Więcej 3D

3D zdecydowanie zmierza w naszym kierunku i zobaczymy ten wpływ we wszystkich obszarach projektowania. Ponieważ technologie VR/AR szybko nabierają tempa, dziedzina ta rozwija się dość szybko.

Projekt: LUV.IT

Projekt: Otwarte nagrody roczne

Projekt: Air Max'17

Projekt: NIKE FC | Złote kule 3D w prawdziwym świecie

Projekt: Marka Better You

04. Animacje

Animacja jest coraz częściej obecna w projektowaniu stron internetowych, format może być dowolny - WebGL CSS, GIF, SVG lub wideo. Animacja była jednym z najważniejszych trendów w projektowaniu stron internetowych ostatniego roku, nie wahaj się jej używać.

Projekt: Nickelodeon Kids wybierają prezydenta

Projekt: Aplikacja wirtualnego trenera fitness AR

Projekt: ZH OURO – Rio 2016

05. Strony jednostronicowe/strony docelowe

W 2017 roku będziemy świadkami wzrostu liczby witryn typu one page ze względu na ich potencjał marketingowy i możliwość lepszego dotarcia do odwiedzających.

Jeśli potrzebujesz strony docelowej, możesz zamówić ją u mnie →

06. Kształty geometryczne, wzory, linie i okręgi

Trend ten rozpoczął się w 2016 roku i z pewnością będzie kontynuowany w 2017 roku. Możesz spersonalizować swoją witrynę, po prostu dodając nowoczesne kształty, płaskie lub z miękkim cieniem.

Projekt:

Projekt: Branding DRAP.agency

Projekt: Pfizer - Aktywni i 50+ dla Nowa York Timesa

07. Odważne kolory

Użyj jasnych kolorów, aby się wyróżnić. Materiał i płaska konstrukcja dobrze komponują się z jasnymi kolorami. możesz użyć paleta kolorów, prezentowane przez Google, aby wybrać i połączyć żądane kolory.

Projekt: Edris — logo zaprojektowane przez MiLo

Projekt: Renderowane - responsywna witryna demonstracyjna dla Adobe

Projekt: b2mach

08. Innowacyjne przewijanie i paralaksa

To świetny pomysł wizualny, który doda wyjątkowości każdej witrynie internetowej. Od paralaksy wielowarstwowej po paralaksę wideo — wszystko jest możliwe dzięki wtyczce D.ex Multilayer Parallax. Produkt ten został w całości opracowany przez studio Milothemes pod kierunkiem Loredana Papp i Mihai Baldean. Jest dostępny do kupienia na Envato Market / codecanyon.net

Ten Wtyczka WordPressa, co pozwala na tworzenie pięknych bloków paralaksy z więcej niż jedną warstwą. Bądź kreatywny i łącz warstwy w dowolnym stylu. Zrobiliśmy 12 różne przykłady w przewodniku po wtyczkach, aby ułatwić Ci pierwsze zapoznanie się ze wspaniałym światem paralaksy. Baw się warstwami!

09. Przejścia kolorów

Gradienty to obecnie jeden z największych trendów. Trend zaczął zyskiwać na popularności w 2016 roku i nadal szybko rośnie duże marki na przykład Instagram zdecydował się zmienić swoje logo i zdjęcia z jednego koloru na przejście wielokolorowe (gradient). Od logo po przyciski i nakładki ze zdjęciami – ten trend jest wszędzie.

10. Przeglądanie mobilne (responsywny projekt)

Lata 2015 i 2016 przyniosły znaczący wzrost wyświetleń z urządzeń mobilnych. Tablety i smartfony są obecnie preferowanym wyborem do przeglądania Internetu, wyprzedzając komputery stacjonarne i laptopy – i tendencja ta się utrzymuje. Każda witryna internetowa, która nie ma responsywne projektowanie stron internetowych muszę zaktualizować jak najszybciej!

Projekt: Animacja responsywnej strony internetowej

11. Niestandardowa grafika i ilustracje

Fotografia stockowa jest nadal dość popularna, ale w 2016 roku pojawił się nowy trend, który będzie się rozwijał w 2017 roku: wykorzystanie niestandardowych grafik i ilustracji. Jeśli chcesz mieć wyjątkową, piękną witrynę internetową, którą zapamięta każdy odwiedzający, współpracuj z projektantami cyfrowymi. Oznacza to mniej zdjęć stockowych i więcej oryginalnych, niepowtarzalnych obrazów.

12. Twórcze wykorzystanie przestrzeni neutralnej i siatki

W ostatnich latach projektowanie stron internetowych było bardziej skłonne do uporządkowanych, zorganizowanych kolumn i siatek, ale w 2016 roku mogliśmy zaobserwować znaczącą zmianę w kierunku nieregularnych warstw i ultranowoczesnych projektów.

13. Opowiadaj historie (opowiadanie historii)

Strony internetowe zaczynają teraz opowiadać historie, aby pozyskać klienta. Ludzie częściej zapamiętują historie niż czytanie prostych (suchych) informacji.

Więcej filmów na temat opowiadania historii z Business of Youth:

14. Stopniowe ładowanie treści (Lazy Loading)

Lazy Loading opóźnia ładowanie obrazów na długich stronach internetowych, dzięki temu informacje pojawiają się w określonym momencie podczas przewijania w dół, co skraca czas ładowania strony.

15. Podziel treść

Dzielenie treści jest obecnie popularne w responsywnym projektowaniu stron internetowych; polega na dzieleniu ekranu na 2 lub więcej części. Taki podzielony ekran witryny pokaże widzowi kilka równie ważnych komunikatów w jednym bloku witryny. Trend ten pojawił się w 2015 roku, ale w 2017 będzie nadal rósł i najprawdopodobniej zobaczysz go na wielu stronach.

16. Formularze pełnoekranowe

Nie ma potrzeby przechodzenia na inną stronę, aby wypełnić formularz, ponieważ nowe witryny korzystają z formularzy o pełnej szerokości, które dostosowują się do responsywności.

17. Filmy wszędzie

W ciągu ostatniego roku wzrosła liczba treści wideo, a ludzie stali się bardziej wymagający wysoka jakość wideo. Film na stronie internetowej może być krótki i automatycznie się powtarzać, przedstawiać produkt lub zakrojony na szeroką skalę projekt filmowy, który wciągnie widza w historię.

Projekt: Hillsong

18. SEO jest ważne! (SEO jest ważne)

SEO jest bardzo ważne dla witryny internetowej, więc piękna witryna bez dobrego SEO pozostanie outsiderem.

19. Ukryta nawigacja

Menu hamburgerowe wywołuje wiele dyskusji za i przeciw trudnościom znalezienia menu przez użytkowników, ale jedno jest pewne – ten trend utrzyma się i ludzie w końcu przyzwyczają się do takich menu.

20. Drobne szczegóły projektu

W tym roku bardzo ważne jest skupienie się na szczegółach. Drobne szczegóły, takie jak punkty nawigacyjne itp. Skupić się na Małe szczegóły sprawi, że praca zostanie ukończona.

Projekt: Barometa – Platforma Pracy Nowej Generacji

21. Trendy w projektowaniu logo

21.1. Minimalizm

Wszystkie duże marki zmierzają w stronę prostszych, minimalistycznych projektów i ten trend pozostanie.

21.2. Ręcznie rysowane

Ten trend jest w centrum uwagi od kilku lat, a ten styl jest świetny dla hipsterskich biznesów. Wykorzystuje się go do salonów fryzjerskich (fryzjerów), kawiarni, restauracji, przedmiotów artystycznych i rzemieślniczych.

21.3. Negatywna przestrzeń

To stary trend, ale w ciągu ostatnich kilku lat zaobserwowaliśmy, że nabiera on tempa i będzie nadal rósł w 2017 r., dlatego zdecydowanie warto przyjrzeć się mu bliżej.

21.4. Uprawa

Nie ma bardziej minimalistycznego niż ten trend. Pokazuje tylko to, co wystarczy wskazać w logo, aby rozpoznać firmę i nic więcej.

21,5. Geometria

Ten trend jest oldschoolowy, ale to jeden z tych stylów, które nigdy nie umrą.

21.6. Grafika liniowa

Trend ten jest popularny wśród przedsiębiorstw nowej generacji

Autorski: Sama Healy’ego; Andrea Schlaffer; Jacka Janiczaka

21.7. Wzory

Wzory są nowym trendem i to powtarzanie jest w niezwykły sposób aby Twoja firma zapadła w pamięć i wyróżniła ją na tle konkurencji. Ten oryginalny kierunek można wykorzystać także w prezentacji logo.

Autorzy: Nick Edlin; Stanisław Alejnikow; Lucasa Gil-Turnera

21.8. Animowane logo

Projektowanie ruchu jest dziś popularnym trendem i widzimy go we wszystkich obszarach projektowania.

Autorzy: Javier Miranda Nieto; Woor Co

21.9. Klasyczny

Styl vintage jest nadal w grze. Nawet jeśli trend ten cieszy się popularnością już od dłuższego czasu, wciąż ma coś do powiedzenia.

Autorzy: Roman Dodonov; Pomysły Mingo; Spróbuję dalej

21.10. Przejścia kolorów

W tym roku gradienty są wszędzie – a logo nie jest wyjątkiem.

21.11. Ilustracje w logo

Ilustracje to dobry sposób na stworzenie unikalnego i spersonalizowanego logo dla Twojej firmy. W tym roku cieszą się coraz większą popularnością.

Autorzy: Bodea Daniel; Jacka Janiczaka

21.12. Fotografia w logo

Połączenie obrazu i typografii jest obecnie bardzo popularne. Świetnie ze sobą współgrają i tworzą kontrast pomiędzy nimi.

22. Trendy typograficzne

22.1. Duża, odważna i piękna typografia

Typografia może być najważniejszym elementem w tworzeniu oszałamiającego projektu. W tym roku typografia będzie odważna (pogrubiona) i duża, z wyraźnymi nagłówkami.

Autorzy: Aleksander Łaguta

Autorzy: Quim Marin

Projekt: Seria Baugasm - pakiet 4

22.2. Gradienty/przejścia kolorów w typografii

Gradienty są dziś bez wątpienia trendem i znajdziesz je także w typografii.

22.3. Hierarchia wizualna

Hierarchia w typografii jest ważna w każdym kierunku projektowania. Rozmiar i szerokość czcionki mogą z łatwością wskazać, które słowa lub nagłówki mają priorytet, więc wykorzystaj ten czynnik podczas tworzenia tekstów. Trzeba też pamiętać, że można osiągnąć coś zrozumiałego hierarchia wizualna za pomocą rozmieszczenia tekstu i koloru.

22.4. Mała typografia

Bardzo mały tekst jest zwykle otoczony przeciwstawną przestrzenią kolorów, ale możesz stworzyć wizualną różnicę między kolorem lub obrazem, aby tekst się wyróżniał. Możesz także użyć animacji, aby wyróżnić swój tekst.

Autorzy: Sława Oleinik; Baha Samir; Dowcipny cyfrowy

Projekt: Seria Baugasm - pakiet 4

22,5. Animowana typografia

Animacja jest obecnie stosowana wszędzie, a typografia nie jest wyjątkiem. Jeśli korzystasz z oprogramowania sterującego ruchem, w tym roku nie możesz się pomylić.

Projekt: Gotham Pro Animowany krój pisma za darmo

22.6. Typografia spotyka się z fotografią

Połączenie tekstu i fotografii może dać doskonałe rezultaty. Sprawdź te wspaniałe przykłady.

22,7. Kształty geometryczne i typografia

Kształty geometryczne mogą dobrze współgrać z typografią, tworząc piękny projekt.

22.8. Parowanie czcionek

Użyj dwóch lub więcej czcionek razem. To nadal jest trend w 2017 roku.

———————————

Poświęcony projektowaniu stron internetowych i trendom cyfrowym w 2018 roku. Olga jest członkiem jury Awwwards i codziennie recenzuje setki nowych witryn opracowanych przez agencje i projektantów z całego świata. Dzięki temu jest na bieżąco z najnowszymi osiągnięciami i trendami w tworzeniu i projektowaniu stron internetowych.

W artykule opisano główne przesłania wykładu oraz pełna wersja znajdziesz go pod linkiem.

Interaktywny zwój

Nasz kursor jest oznaczony strzałką. Zamienia się w palec służący do klikania i mogą pojawić się kursory. Teraz kursor może być elementem. Przejście do strony jest podświetlone poniżej. Elementy poniżej mogą zmieniać się lub wchodzić w interakcję z kursorem.

Witryna Volcan jest ulubionym przykładem. Kursor w kształcie rombu staje się wskazówką tego, co Cię czeka po kliknięciu. Jest element interaktywny. Dzięki temu najechanie nie jest potrzebne; jego rolę pełni kursor.

Przykład interaktywnego zwoju na stronie Volcano

Nowy motyw do potyczek pomiędzy projektantami UI/UX - czy jest wygodny? Ale jeśli wszystko mądrze przemyślisz, może się to udać.

Maski SVG

Za ich pomocą możesz dokonać przejść kosmicznych. Nie są trudne w opracowaniu, ale dają projektantom wolną rękę. Witryna Richa Browna używa krzyża jako przejścia. Ale może to być dowolna forma.

Jeśli używasz Photoshopa, możesz to zrobić po prostu wycinając otwór w warstwie za pomocą maski. Lub nakładając na siebie 6 kwadratów. Dla naszego klienta dokonaliśmy przejścia z ekranu na ekran za pomocą tego czegoś. Otwarcie obrazka z formularza jest także maską SVG. Ale jeśli spojrzysz na układ, wygląda to jak statyczny obraz.

Płótno

To już jest trudne. Zdecydowanie potrzebujesz kogoś, kto rozumie matematyczne aspekty tego procesu. Niektóre rzeczy można wypożyczyć z bibliotek. Ale SVG nie synchronizuje się z kursorem. I oto jest.

Na przykład strona internetowa Climachill firmy Adidas.

Morfowanie za pomocą litery to Canvas. Przepełnienie gradientów to Canvas. I to jest popularne od kilku lat, ale szybko nie stanie się przestarzałe. Ponieważ niewiele waży i jest to grafika 2D, którą trudno odtworzyć. Odpowiedni dla tych, którzy chcą dużo „wow” na swojej stronie internetowej.

3D+WEBGL

Kierunek będzie się rozwijać. Jeśli nakręcisz nawet niewielki, ale wysokiej jakości film trwający 1 minutę, oznacza to minimum 10 osób w zespole. W 3D - jest to 1 projektant. A webgl jest programistą +1. 3D może być klasyczne, jak na stronie Globekit. Wygląda fantastycznie, niepowtarzalnie. Chociaż składa się w sumie z 6 slajdów.

Ale powtórzę: trzeba uważać z aplikacją. Jeden taki efekt wystarczy, aby strona była jasna, ale nie krzykliwa.

VR

W marcu 2017 roku pojawiła się pierwsza strona internetowa w technologii VR. Jest ich więcej. Niedawno zrobiliśmy pierwszy tor VR na stadionie piłkarskim. Mężczyzna zakłada maskę i wydaje mu się, że jest na torze wyścigowym.

Urządzenie do wirtualnych wyścigów marki Audi.

Niedawno spieraliśmy się, czy VR się przyjmie. Tak, ma przyszłość, ponieważ stało się łatwiejsze do wykonania. Portfolio wykonamy w VR tak, abyś mógł je przeglądać odwracając głowę, a gdy już utkwisz wzrok, możesz zabrać się do pracy.

AR

To wspaniale, że teraz możesz obejść się bez aplikacji. Wchodzisz na link w przeglądarce i musisz mieć znacznik, który będzie czytał pewne rzeczy. Pokazujesz ten znacznik, a on kończy rysowanie tego, co chcesz. Oznacza to, że najpierw robisz projekt w 3D, pokazujesz mu go, a on uzupełnia rzeczywistość rozszerzoną. Możesz go dostosować dla siebie.

PWA to funkcjonalność przeglądarki przypominająca aplikację. Jest dodawany jako ikona i wygląda jak aplikacja. Tak naprawdę otwiera się w przeglądarce i pozwala wysyłać powiadomienia do użytkownika, rejestrować je za pomocą formularza i odbierać treści offline.

Ramka

To gotowa biblioteka, w której znajdziesz wszystko, co dotyczy AR i VR. Można zobaczyć jak działają, obejrzeć je w akcji.

Dlatego wszystkim projektantom stron internetowych doradzam ukończenie studiów w 3D. Dzięki temu Twoja witryna będzie znacznie bardziej dynamiczna.

Google

Miej na nie oko. Nie stoją w miejscu. Istnieje coś takiego jak eksperymenty Google. Uwolnij się na kilka godzin, aby odkryć całe piękno. Google przeprowadza wiele eksperymentów, w które angażuje programistów i agencje. Ostatnim z nich jest wykorzystanie big data.

Niedawno Awwwards rozpoczął współpracę z Google. Oznacza to, że teraz nacisk zostanie położony na strony mobilne. Technologia zacznie być optymalizowana, aby była lżejsza. Google coraz bardziej interesuje się internetem mobilnym.

WebVj

Bardzo nowa sztuczka. Strona zbudowana jest w oparciu o dane. Jest jeden Japończyk, Masatatsu Nakamura, który podchodzi do tego szczególnie poważnie. Jego grafika jest w całości wykonana przez programistę, a nie projektantów. Ma to duże znaczenie w przypadku Eksperymentów Google.

Przykład grafiki Masatatsu Nakamury wykonanej przy użyciu WebVJ

Trendosiki

Najczęściej zadawanym pytaniem jest: „Jaki kolor/czcionka/wzór będzie modny w przyszłym roku?” Nazywam to „trendami”.

Obecnie nie da się zidentyfikować jednego popularnego zestawu czcionek schemat kolorów. Raczej pastelowe kolory zaczynają wykazywać pewien trend. Ale potem patrzysz na te jasne, wybuchowe miejsca i zdajesz sobie sprawę, że nie.

Radziłbym w każdym razie urozmaicić prezentację komponentu za pomocą wzorców. Dzięki temu treść będzie wyglądać na droższą i ciekawszą. Regularny, półprzezroczysty i jasny wzór już nada status Twojej witrynie. Ukośne linie, połamane elementy - to nie jest takie trudne i nie wymaga zaangażowania programisty.

Zastanówmy się, co to znaczy być popularnym, modnym i nowoczesnym w projektowaniu stron internetowych w 2017 roku. Aby to zrobić, przyjrzyjmy się głównym trendom w projektowaniu stron internetowych. Większość z nich wędruje z roku na rok i już stała się integralną częścią budowy nowoczesnych stron internetowych. Dzieje się tak zwłaszcza ze względu na rozwój technologii mobilnych, kanałów komunikacji i udoskonalanie urządzeń. Na przykład trend taki jak mobilność stron internetowych stał się obowiązkowy. Komercjalizacja Internetu narzuca także projektantom i twórcom stron internetowych rygorystyczne warunki. Jednocześnie niektóre trendy słabną i tracą na popularności, choć nadal pozostają dość aktywne. Pojawiają się także modne hobby, charakterystyczne dla krótkiego okresu. Na przykład w zeszłym roku były to ikony z długim cieniem przedstawianych obiektów. W tym roku popularne stały się wzory geometryczne, my też się im przyjrzymy. A więc uporządkujmy to.

1. Mobilny, responsywny projekt
Dziś być może najważniejszy i obowiązkowy trend. Strona powinna wyglądać równie dobrze na wszystkich rozdzielczościach monitorów, laptopów, ekranów smartfony mobilne i tablety. Nawiasem mówiąc, wyszukiwarki bardzo dokładnie monitorują stopień dostosowania witryny różne urządzenia i na tej podstawie określają swoje miejsce w wynikach wyszukiwania.

2. Aktywna typografia
To jeden z najpopularniejszych trendów już od kilku lat. Duże czcionki i typografia na stronie składają się z dwóch elementów. Po pierwsze estetyka - piękne linie, zaokrąglenia i napisy same w sobie są ozdobą i element dekoracyjny. Po drugie, jest to funkcjonalność - użytkowanie duża czcionka potrafisz jednoznacznie i dobitnie przekazać odwiedzającemu główną ideę.

3. Wideo panoramiczne
Naszą uwagę niewątpliwie od razu przykuwa pełnoekranowy film w tle strony. Ten dobre powitanie zainteresować gościa. Nowoczesny rozwój technologii ułatwia osadzanie filmów na stronach internetowych, co oznacza, że ​​projektanci będą coraz częściej sięgać po tę technikę. Jest jednak jedno zastrzeżenie: oglądanie filmu jest interesujące tylko za pierwszym razem; za drugim i trzecim razem staje się nudne. Dlatego ta technika jest skuteczna tylko w przypadku nowych gości.

5. Kinografie
Dobra alternatywa dla panoramicznych filmów wideo i świetne zdjęcia w tle. Kinografie to fotografie, na których występują drobne, powtarzalne ruchy. Zazwyczaj są prezentowane w formacie gif i dają widzowi złudzenie, że ogląda wideo. Więcej o kinografiach z duża ilość przykłady można znaleźć w wyborze

6. Płaska konstrukcja
Kolejny mocny trend ostatnich lat. Strony internetowe zaprojektowane w jednolitych kolorach są zazwyczaj schludne i przejrzyste. Ale ostatnio pojawił się nowy rodzaj płaskiej konstrukcji - Półpłaski. Dzieje się tak wtedy, gdy cały projekt jest wykonany w jednolitym kolorze i tylko jeden element ma cień, gradient lub teksturę. Z reguły tym elementem jest przycisk, któremu nadano głośność lub wyeksponowanie, aby przyciągnąć uwagę odwiedzających.

7. Mikrointerakcja na stronie
Obecnie wiele uwagi w projektowaniu stron internetowych poświęca się mikrointerakcji funkcjonalności i projektu witryny z odwiedzającym. Istotą tego jest to, że odwiedzający może wyraźnie zobaczyć rezultat swoich działań na stronie, czy to dostosowując ustawienia użytkownika, klikając link, potwierdzając operację, wchodząc w interakcję z aktywnymi ikonami, przyciskami, przełącznikami, licznikami i innymi elementami.

8. Animacja obiektów
Możliwości współczesnego HTML5 i CSS3 pozwalają na wykorzystanie dużego arsenału efekty wizualne Online. Dzięki temu interakcja ze stroną jest bardziej interesująca i ekscytująca dla odwiedzającego. Zatem w nowym roku zobaczymy także najbardziej nieoczekiwane interaktywne mikroruchy obiektów, zwykle reagujące na ruch myszy. Być może zobaczymy przykłady bardziej złożonych animacji.

9. Żywe schematy kolorów
Popularne, modne kolory roku 2017 sprzyjają jasności i nasyceniu. Ciekawe, oryginalne odcienie szkarłatu, musztardy, żółci, szmaragdu, głębokiego błękitu, a także czerwieni, fioletu i czekolady sprawią, że Twoja witryna wyróżni się i nabierze własnego, niepowtarzalnego stylu.

10. Przewijanie witryny
Ponieważ przewijanie serwisu jest idealne dla urządzeń mobilnych, jego obecność będzie znacząca w 2017 roku. Jedyną rzeczą jest to, że przewijanie nie pozostawia miejsca na interakcję użytkownika, dlatego istnieje pewne zmęczenie spowodowane niekończącym się ładowaniem treści. Być może trend zmieni się w stronę łączenia prostych elementów sterujących z przewijaniem.

11. Efekt paralaksy
Paralaksa to zmiana pozornego położenia obiektu względem odległego tła. W projektowaniu stron internetowych efekt ten jest używany podczas przewijania witryny, podczas przewijania obiektów i tła przy różnych prędkościach, co daje iluzję trójwymiarowości. Trend jest dość stabilny, dlatego strony z paralaksą będziemy widzieć nie raz.

12. Konstrukcja modułowa
Od pewnego czasu popularna jest konstrukcja modułowa, czyli interfejs karty składający się z samodzielnych bloków znaczeniowych. Ten trend jest bardzo dobry w przypadku urządzeń mobilnych, ponieważ bloki dobrze dopasowują się do dowolnej rozdzielczości ekranu. Jednak w dużych witrynach wyglądają one zupełnie tak samo i trudno je hierarchizować i strukturyzować.

13. Jednostronicowe
Strony jednostronicowe, strony docelowe i strony docelowe stały się integralną częścią współczesnego Internetu. Więcej o tym, czym jest strona docelowa, przeczytasz w artykule oraz. W 2017 roku na stronach docelowych większy nacisk zostanie położony na przycisk wzywający do działania – zamów, zadzwoń, zarejestruj się itp. Wszystko inne, co odwraca uwagę potencjalnego gościa, zostanie odcięte.

14. Reklama graficzna
Chciałbym jeszcze zwrócić uwagę na jedną rzecz, którą pamiętam z minionego roku i najprawdopodobniej tendencja ta utrzyma się w roku 2017. W związku z komercjalizacją Runetu i rozwojem handlu internetowego zapotrzebowanie na graficzne materiały promocyjne do celów reklamy i promocji znacznie wzrosła - banery, zwiastuny, kartki, ulotki.

15. Automatyzacja typowych procesów
Wszystkie standardowe rozwiązania i procedury na stronie są stopniowo zastępowane procesami zautomatyzowanymi, co eliminuje konieczność komunikacji z obsługą klienta lub konsultantami online. Pod tym względem rośnie popularność różnych aplikacji i rozszerzeń. Teraz możesz kupić produkt lub usługę, złożyć zamówienie, umówić się na spotkanie, zarezerwować miejsce, przelać pieniądze, wypełnić formularz lub przystąpić do testu - wszystko to można zrobić online za pomocą kilku kliknięć myszką.

16. Infografiki
Prezentacja graficzna w formie infografik jest nadal popularna i poszukiwana. Dołączenie do tekstu pięknego obrazu lub ikony w połączeniu ze stylowymi elementami projektu sprawia, że ​​infografika jest atrakcyjna estetycznie. Infografiki porównawcze są szczególnie przejrzyste i interesujące pod względem wizualnym – zawierają informacje dotyczące tego, co się stało, co się stało, tak, nie, zalety i wady, nakazy i zakazy itp. Za pomocą infografik możesz także opowiedzieć historię krok po kroku lub obrazowo przedstawić nudne statystyki.

17. Menu hamburgerowe
Menu hamburgera to wizualna ikona składająca się z trzech poziomych pasków, zwykle u góry w rogu witryny, po kliknięciu otwiera się lub wysuwa z boku pełne menu. Wielu ekspertów przewiduje, że ten trend wygaśnie, ponieważ większość niedoświadczonych użytkowników po prostu nie rozumie przeznaczenia tej ikony. Dlatego projektanci stron internetowych preferują uproszczoną nawigację. Niemniej jednak menu hamburgerów zobaczymy więcej niż raz na nowo utworzonych witrynach.

18. Ikony
Ikony, jako sposób prezentacji informacji i narzędzie wizualizacji, były i pozostają jednym z najpopularniejszych i ulubionych trendów wśród projektantów. Wystarczy umieścić odpowiednie ikony tematyczne w pobliżu bloków z tekstem – a teraz cały tekst nabiera logicznego i wizualnego porządku i struktury. Dlatego w nadchodzącym roku będziemy nadal aktywnie korzystać z ikon.

19. Układanie listów
Układanie liter to tekst w kwadracie. Tak naprawdę jest to przykład złożonego rozwiązania twórczego – trzeba przedstawić długi tekst na małej przestrzeni. Jednocześnie powinien wyglądać pięknie i oryginalnie. W tym roku też jest modne.

20. Pusty przycisk
Aby zaoszczędzić miejsce i przestrzeń, jakiś czas temu na urządzeniach mobilnych pojawił się pusty przycisk - duży napis z kwadratowym konturem wokół słowa. Taki przycisk daje przegląd tła znajdującego się za przyciskiem, a jednocześnie zachowuje swoją funkcjonalność jako pełnoprawnego przycisku. Ponadto jako element projektu taki przycisk wygląda stylowo i schludnie.

21. Unikaj zdjęć stockowych
Niektórzy eksperci zauważyli, że projektanci zaczynają odchodzić od zdjęć stockowych. Ponieważ nowoczesne urządzenia pozwalają szybko i sprawnie samodzielnie wykonać zdjęcie, dzięki czemu możesz uniknąć bezosobowości i jednolitości stocku i stworzyć własne wyjątkowe zdjęcie i stwórz swój własny, niepowtarzalny projekt.

22. Niezwykłe kąty na zdjęciu
Znajdowanie ciekawych ujęć na zdjęciach stało się dostępne dla każdego posiadacza smartfona z aparatem. Pod tym względem kreatywność przy tworzeniu zdjęć nie wchodzi w grę i możemy udekorować witrynę unikalnym zdjęciem o nietypowym kącie widzenia lub perspektywie.

23. Karuzela
Suwak karuzelowy, który wszedł w życie projektowe kilka lat temu, nadal jest popularny i przydatny przy projektowaniu stron internetowych. Za pomocą szerokiego suwaka wygodnie jest obracać główne wiadomości, a także teraźniejszość aktualne promocje, zbiory i inne istotne informacje, które odwiedzający widzi natychmiast po wejściu na stronę.

24. Samoodtwarzające się audio i wideo
Ale ten trend pochodzi z 2000 roku. Pamiętam, że wtedy modne było odtwarzanie dźwięku po wejściu na stronę internetową. I ten dla wielu. Nie mogę powiedzieć, że akompaniament audio mi się podoba, ale być może umiarkowane użycie będzie dyskretne. Cóż, dla mnie samoodtwarzające się wideo jest raczej hołdem dla reklamy. Cóż, plus chęć utrzymania uwagi odwiedzającego w kanale. Nie jest to najprzyjemniejszy trend, ale niezbędny z komercyjnego punktu widzenia.

25. Wzory geometryczne
Cóż, zakończymy naszą recenzję krótkotrwałym trendem w modzie w postaci różnych geometrycznych wzorów i wzorów. Stały się niespodziewanie popularne pod koniec ubiegłego roku. Cóż, to kolejny sposób, aby projekt Twojej witryny internetowej wyróżniał się i był niepowtarzalny.

Infografika „Trendy w projektowaniu stron internetowych 2017”
Mam do zaoferowania infografikę, która w przejrzysty sposób przedstawia wszystkie trendy i trendy w projektowaniu stron internetowych. Możesz pobrać obraz w dużym rozmiarze, korzystając z tego linku na DeviantArt. Strona na DeviantArt otworzy się w nowym oknie. Tam kliknij słowo Pobierz po prawej stronie obrazu i zapisz zdjęcie na swoim komputerze.