20 Naraščajoči trendi spletnega oblikovanja, ki si jih morate ogledati v letu 2017
Minilo je še eno leto, oblikovalci pa gledajo v prihodnost. Veliko obetavne trende oblikovanja Leta 2017 sem se zavezala, da bodo izbruhnili veliko sprememb od takrat.
Torej, za to objavo sem izbral 20 najboljših trendov kar sem opazil vlečenje v letu 2017. Ti trendi oblikovanja lahko velja za katero koli spletno mesto, zato bodite pozorni na te tehnike, ko se premikamo skozi leto 2017 in naprej.
1. “Predstavljeno v” priponke
Startupi, blogi, projekti SaaS in celo mala podjetja zdaj uporabljajo “kot je prikazano v” priponke na svojih spletnih straneh. Te značke pogosto povezavo do člankov o glavnih dnevnikih HuffPo, Forbes, CNN, Fox in druge novice.
Cilj je, da preverite spletno mesto in graditi zaupanje z novimi obiskovalci. Osebi je lažje zaupati, ko vidijo, da je bilo v avtoritativnih publikacijah.
Pravzaprav veliko top blogov ceni izpostavljenost, zato res pomaga vsem vpletenim. Ta velika mesta pogosto objavite svoje logotipe na spletu lahko pa poiščete tudi pregledne PNG-je ali SVG-je samo s pomočjo Googlinga.
Prav tako je priporočljivo, da vas povezavo nazaj na izvirni članek omeniti vaše spletno mesto. To dokazuje Res ste omenili na spletnem mestu in ne samo, da si izmišljate zahtevke.
2. Krepko povezavo navzgor
Videl sem na ducate elegantnih navigacijskih menijev vsi se zanašajo na isto zasnovo. Ti nav povezave pisave in velikosti ampak ponavadi podobne funkcije, kot naprimer:
- Vse kape
- Krepko
- Enakomerno razporejeni
- Poravnano na desni kot
Domača stran Zazzle je odličen primer. Toda lahko to najdeš na številnih zagonskih spletnih straneh ker je a čist način za izmenjavo povezav ki jih je enostavno brati in preprosto brskati.
Ta trend večinoma povezujem podjetja in tehnološka podjetja lahko pa tudi prevladuje na blogih.
Zapomnite si naslednjič, ko boste videli ta trend, ker je povsod. In pričakujem, da bo še naprej rasla do leta 2017.
3. Blogi v slogu revij
Blogging je bil tak nišni koncept že v zgodnjih 2000-ih. Če ste v letu 2003 vodili spletni dnevnik, se je smatralo za ljubko malo hobi. V skoraj desetletju se je ta trend korenito spremenil. Zdaj lahko blogi zagotoviti dohodek za polni delovni čas, in začnejo videti veliko bolj kot digitalne revije.
Oglejte si prvotno obliko TechCrunch, ko se je prvič začela leta 2006. Izgleda, da je generični WordPress blog prav?
Zdaj si oglejte trenutno domačo stran Techcrunch v letu 2017:
Ne samo izgleda kot revija, tudi funkcije. TechCrunch vsak dan objavi desetine (če ne stotin) novih objav. So vir za dostop do novic za zagon.
Oblikovalski trendi v slogu revije so velika razlika. Domača stran uporablja a velika razstavljena zgodba, za vsako delovno mesto ima svojo sličico, in strani članka okrog naslova.
Ko pomislite, se TechCrunch ni veliko spremenil. Še vedno je “samo blog”. Toda zasnovan je in urejen kot revija, in to naredi razliko.
4. Video ozadja
Zvok samodejnega predvajanja je morda najbolj nadležen trend na spletu. Ampak presenetljivo, samodejno predvajanje videoposnetka (brez zvoka) je hitro rastoč trend. To lahko opazite na več deset poslovnih mestih, kjer je video ozadje prevzame celoten zaslon.
Zelo mi je všeč ta tehnika, ko se pravilno uporablja. Dokler bo video se nanaša na spletno mesto in ne ovira vsebine, Mislim, da je kul učinek za uporabo v glavi.
5. Gumni gumbi
Kot minimalizem se še naprej hrani V spletno oblikovanje se pojavljajo številni novi trendi. Eden takšnih trendov je Ghost tipk ki nimajo notranjega polnila, vendar imajo zunanjo mejo.
Večino časa ti gumbi kontrast z drugimi opozoriti. To lahko vidite na domači strani Instantmojo z zelenim gumbom za prijavo se nahaja zraven gumb duhov, ki se povezuje z demo v živo.
Druga spletna mesta so bila sprejeta slog čistega duha na njihove gumbe po vsem svetu. Dober primer je nova postavitev Bootstrap.
Mislim, da ghost gumbi delujejo na mestih, ki nagibati k minimalizmu. Morda ne bodo zelo primerni za vsako spletno stran, vendar vidim, da se njihova uporaba povečuje z vsakim letom.
6. Možnosti modalnega okna
Modalna okna so zelo moteča in ne morem si predstavljati, da bi jih želel uporabnik. Vendar pa dokazano je, da povečujejo prijave, in tržniki ne morejo prezreti tehnik, ki delujejo.
Zato mislim, da bodo modalna opt-in okna še naprej vzpenjati v letu 2017.
Niso moja najljubša stvar in nikoli jih ne dodam na svoje spletne strani. Ampak, če je cilj povečati prijavo, so modalna okna zanesljiv način, da se stvari spremenijo.
Novi vtičniki lahko celo ciljni izhodni namen ki sproži modal vsakič, ko uporabnik poskuša zapustiti spletno mesto. Drugi modali se pojavijo po x sekundah ali pa so nastavljeni tako, da se odprejo, ko se uporabnik premakne dovolj dol.
Ne glede na to, kako se modali sprožijo, kako so oblikovani ali kako se počutite glede njih, mislim, da bodo na dolgi razdalji.
7. Ilustracija in vektorska umetnost
Z novimi programi za oblikovanje vektorjev, kot sta Sketch in Affinity Designer, se je pojavil nov val ilustratorjev, ki se prebijajo v splet. Grafično oblikovanje in oblikovanje vmesnikov se nenehno združujejo z več multidisciplinarnimi oblikovalci kot kdajkoli prej.
To pomeni, da bomo videli veliko več ikon po meri in celostranske ilustracije v bližnji prihodnosti.
Številni ilustratorji so umetniki, zato mislim, da bomo videli bolj polno ozadje strani izdelan s programsko opremo za digitalno slikanje, podrobno predstavljen kot koncept art.
8. Fiksno premikanje stranskih trakov
Prvi val fiksne zasnove osredotočena na vrstice za krmarjenje. Vse to je preveč običajno, zlasti v odzivnih modelih, kjer je fiksna navbar posnema občutek domače mobilne aplikacije.
Toda v letu 2017 pričakujem še en lepljiv element-lepljivo stransko vrstico.
Skoraj vsak večji blog uporablja tovrstno lepljivo stransko vrstico. To ohranja vsebino v pogledu vedno poveča verjetnost, da bodo uporabniki interakcijo z vsebino stranske vrstice.
Plus z desetimi brezplačnimi vtičniki jQuery, ki jih lahko posnemite učinek lepljive stranske vrstice. To je lažje kot kdajkoli prej, da to nastavite na kateri koli spletni strani.
9. Kazalo vsebine strani
Nedavna študija primera je to ugotovila Dolgotrajna vsebina je boljša od kratkotrajne tako na lestvici kot na kakovosti zadrževanja uporabnikov. To ni vedno res, ker je na nekatere poizvedbe mogoče hitro odgovoriti.
Toda z veliko bolj dolgoletno vsebino na spletu je naravno videti v članke dodanih več kazalnikov. To boste videli na dolgih mestih za preglede ali v člankih, ki se razdelijo na navedene elemente.
Dodajanje kazala lahko izboljšati uporabniško izkušnjo in pomagali razdeli branje v manjše kose. Vsebina lahko tudi pomagali bolje uvrstiti vašo stran! Če Google ugotovi, da je vaša stran pomembna, boste morda dobite skok povezave v rezultatih iskanja.
Mogoče je res, da so tocke zdaj precej redke. Toda pričakujem, da se bo ta trend povečal v letu 2017 in mnogo let pozneje.
10. Svetle barvne oblike
Nisem prepričan, ali je ta trend nastal zaradi minimalizma ali kot odziv na Googlov materialni dizajn. Ampak sem naletel na desetine spletnih strani, ki jih uporabljajo svetle pastelne barve mešane z drugimi živimi odtenki ustvariti zelo domišljijski videz.
Domača stran Rentberry je odličen primer, ki se uporablja tudi ton prelivov. In ima celo prej omenjeno “Predstavljeno v” značke pod njo! Dva trenda na enem mestu.
Opazili boste, da so barve ne prežemajte celotne strani, in so utišane z drugimi odtenki bele in sive.
Dovolj sem jih videl živahne barvne sheme da verjamejo, da so v porastu.
11. Pomaknite se na animacije
Spletni oblikovalci poznajo drsenje in kako grozno je. Vendar nisem mislil s tem naslovom “poiščite animacije”. Sedaj sem videl veliko spletnih mest oglejte vsebino ko se pomaknete mimo določenega dela strani.
Ta trend je večinoma omejena na zagonske domače strani in podjetja SaaS ki želijo nekaj pizzazz v svojem oblikovanju.
Ne morem reči, ali je to posebej koristen trend. Vsekakor zgrabi oko ampak mislim, da ne ponuja veliko več kot estetika. Kljub temu se zdi, da se ta trend hitro širi in kdaj uporablja zmerno lahko je res lepo.
12. Aplikacije za eno stran (POV)
Aplikacije na eni strani so spletne strani zgrajena izključno z Ajax klici. JavaScript potegne vsebino iz strežnika in naloži ga dinamično, tako stran nikoli ne osveži.
Običajni primeri so spletna mesta, kot sta Gmail in Facebook. Toda z več JS tehnologije, Opazil sem, da je ves čas razvitih več POV. Vraga, celo CodePen se lahko šteje za SPA.
Z zmogljivimi knjižnicami, kot so React & Aurelia, bo v letu 2017 še lažje ustvariti SPA od začetka.
13. Preklopne vrstice za iskanje
Včasih je bilo to iskalno polje so bili vedno na vidiku nekje na spletni strani, bodisi v stranski vrstici ali v navigaciji. Toda v zadnjem času sem opazil veliko več iskalnih polj, ki jih dobim privzeto skrit, in mora biti vključen v pogled.
Zagotovo je priročen trend prihranite prostor na strani še vedno ohranjanje dostopne funkcije iskanja. Če niste prepričani, kam naj se v novo obliko postavi iskalni obrazec, lahko razmislite o uporabi preklopnega polja, povezanega z ikono povečevalnega stekla v navigaciji..
14. Sporočila Adblock
Ni mogoče zanikati dejstva, da blokiranje oglasov je v porastu. Edino vprašanje je, kako bodo založniki obvladali ta trend. Nekatera mesta vljudno dodajte sporočila v oglasne prostore kot Time.com. Na Hongkiatu boste opazili interni oglasi, da zapolnijo praznino ki se povezujejo naprej v spletno mesto.
Eden resnih trendov, ki jih vidim, je povečanje bloki vsebine oglasov. To je tehnika “blokirajte blokatorje oglasov”. Ta funkcija je že vzpostavljena na številnih velikih mestih, kot sta Business Insider in Forbes. Na žalost to škoduje tako uporabniku kot izdajatelju, vse to pa izhaja iz slabo kakovostnih oglaševalskih tehnik.
Konec koncev ni pomembno, koga krivite ali kje stojite v razpravi o blokiranju oglasov. Več ljudi namesti vtičnike adblock in pričakujem več izdajateljev, da se vrnejo nazaj.
15. Čiste ikone SVG
Grafika SVG ste že prodrli v splet, vendar se vsak dan povečujejo. In imam občutek, da bo leto 2017 veliko leto za SVG na spletu.
Najdete lahko na tisoče brezplačne ikone SVG na straneh, kot je Flaticon, če veste, kako iskati. Lahko pa tudi koda SVG v HTML, na primer z uporabo tega primera na CodePen.
Zato imajo oblikovalci način uporabe SVG-jev, razvijalci pa lahko tudi uporabljajo SVG-je. Sodobna podpora brskalniku izgleda dobro povsod, tako da ni težav z združljivostjo. Vse kar je potrebno je dovolj oblikovalcev priznavajo moč SVG in jih začnete uporabljati!
16. Adobe XD
Adobe ugasne polna beta različica Adobe XD leta 2016, in od takrat hitro raste. Trenutno je podpira Mac in Windows, in to je v fazi testiranja preden se popolnoma razvalja.
Lahko se zanašate na zamisel o vsakem programu, ki prehiteva Sketch, vendar je Adobe glavno programsko podjetje za ustvarjalno delo z razlogom. Plus Skica je še vedno samo Mac, medtem ko je Adobe želijo podpirati vse.
Trdno verjamem, da bomo v prihodnjem letu prebrali več o Adobe XD. Lahko postane go-to programska oprema za oblikovanje modelov uporabniškega vmesnika-tako lahko končno uporabimo Photoshop kot orodje za fotografsko manipulacijo (kot je bilo predvideno)..
Z vzponom nove programske opreme, pride desetine Vadnice in freebie GUI kompleti prav tako. Lahko najdete veliko Adobe XD freebies v Dribbble skupaj z dve novi XD-osredotočeni freebie strani Designmine in XD Guru.
17. Več menijev hamburgerjev
Ljubi ali ga sovraži hamburger je tu, da ostane. Obstaja veliko študij uporabnosti, ki nasprotujejo menijem, skritim iz pogleda. Toda z majhnim zaslonom in le toliko alternativami za zdaj ni boljše alternative.
Ikone hamburgerjev počasi postanejo prepoznavni simboli za menije nav. Tako kot pove tudi ikona povečevalnega stekla “Iskanje”, ikona hamburgerja s tremi palicami bo kmalu sinonim “meni”.
To že velja za najbolj tehnološko zdrave posameznike. Toda z vsakim letom več ljudi dobi pametne telefone in začne brskati po mobilnem spletu. In se učijo povežite ta hamburger z menijem nav brez konca na vidiku.
18. Ikone funkcij izdelka
O tem trendu sem pisal na Treehouse, vendar ga pred kratkim nisem omenil. Tudi v letu 2017 je ta trend bo ogromen. Verjetno je to najpogostejši način delite funkcije izdelka na domači strani.
Začnete izdelavo seznama funkcij za vaš izdelek. Izdelek je lahko vse od programa SaaS do teme WordPress ali celo fizičnega elementa.
Potem pa lahko tudi vi oblikovanje ikon po meri ali poiščite niz ikon predstavlja te funkcije. To je najbolje izogniti se splošnim značilnostim kot naprimer “zanesljivi” ali “hitro” ker večina ljudi pričakuje te stvari.
Namesto tega navedite funkcije to je pomembno. Če je to vrhunska tema za WP, lahko navedete, da je odzivna, koliko pripomočkov ima, ali kako meni deluje.
Te ikone funkcij delujejo kot vizualni pomagati prodati vsako funkcijo. Samo besedilo je težko zaužiti vendar je vizualno delo veliko lažje razumeti na prvi pogled.
19. Nadstandardni CTA-ji
Poziv k dejanjem tradicionalno po vsej spletni strani. Toda z obiskovalci porabijo manj časa na spletnih straneh, ključnega pomena je imeti močan CTA tik nad grebenom.
Ti pozivi k dejanjem so lahko gumbi, obrazci za prijavo ali drugi vnosi v spodbuditi ljudi k ukrepanju kot so prijava ali branje objave v spletnem dnevniku.
Ne morem vam povedati, kako oblikovati CTA ali kako ga optimizirati za konverzije. Ampak lahko rečem, da se zdi, da ta trend postavlja te CTA nad preklopom in v jasnem pogledu za vse obiskovalce.
20. Manjše vsebine
Monitorji so postali tako veliki, da jih je večina spletnih strani nastavite maksimalno širino. Bolje je prebrati stavke, če so široki 2000px v primerjavi s samo 700px širino.
Manjša vsebina je lažje za uživanje, in na koncu ustvarja boljše izkušnje na spletnih straneh, ki vsebujejo veliko vsebine.
Mislim, da več oblikovalcev to uresničuje in bo počasi zmanjšanje velikosti področij njihove vsebine. Raje maksimalno širino 750px, vendar bi lahko šel tako majhna, kot 600px ali manj.
Krajši odstavki z manj stavkov in manjše vsebine bo vedno povečati berljivost. Večje publikacije, kot je NY Times, lahko odstopajo od lastnih strukturnih smernic. Toda za preprost blog ali poslovno spletno stran se trend približuje daljša vsebina z manjšimi odstavki in področji vsebine.
Zavijanje
Obstaja veliko drugih trendov, ki jih nisem uspel pokriti na tem mestu, vendar mislim, da je teh 20 najbolj zanimivih. Ko gremo naprej v leto 2017, bi moralo biti jasno, kateri trendi eksplodirajo in kateri niso.
In če imate druge ideje ali predloge za prihajajoče trende oblikovanja, vas prosimo, da spodaj opustite komentar.
