20 Rising Web dizaina tendences skatīties 2017. gadā

Vēl viens gads ir pagājis, un dizaineri gaida nākotni. Daudzi daudzsološas dizaina tendences pagājušajā gadā es aptvēru 2016. gada dizaina tendences un mēs esam redzējuši daudzas izmaiņas kopš tā laika.

Tātad, par šo amatu es esmu izvēlējies top 20 tendences ka es esmu ievērojis vilces iegūšana 2017. gadā. Šīs dizaina tendences var pieteikties uz jebkuru vietni, tā, lai mēs pārvietotos pa 2017. gadu un pēc tam, turiet acis par šīm metodēm.

1. “Tiek piedāvāts” nozīmītes

Startup, blogi, SaaS projekti un pat mazie uzņēmumi tagad izmanto “kā attēlots” nozīmītes to tīmekļa vietnēs. Šīs nozīmītes bieži vien ir saite uz rakstiem par galvenajiem emuāriem piemēram, HuffPo, Forbes, CNN, Fox un citi jaunumi.

Mērķis ir apstiprināt vietni un veidot uzticību ar jauniem apmeklētājiem. Ikvienam ir vieglāk uzticēties vietnei, kad viņi redz, ka tas ir bijis minētas autoritatīvās publikācijās.

Patiesībā daudzi top blogi novērtē ekspozīciju, tāpēc tas tiešām palīdz visiem iesaistītajiem. Šīs lielās vietas bieži publicēt savus logotipus tiešsaistē bet jūs varat arī atrast caurspīdīgus PNG vai SVG, vienkārši apmeklējot apkārt.

Tāpat jums ir ieteicams saite atpakaļ uz sākotnējo rakstu pieminējot jūsu vietni. Tas pierāda jūs tiešām pieminējāt vietnē, un jūs ne tikai aizpildāt prasības.

2. Bold all-caps navigācijas saites

Esmu redzējis desmitiem gludu navigācijas izvēlņu visi paļaujas uz šo pašu dizainu. Šīs nav saites ir dažādi bet viņi parasti ir līdzīgas iezīmes, piemēram:

• Visi vāciņi
• Treknrakstā
• Vienmērīgi izvietoti
• Saskaņots ar labo stūri

Zazzle mājas lapa ir lielisks piemērs. Bet jūs varat to atrast daudzās startēšanas vietnēs jo tas ir a tīrs veids, kā koplietot saites kas ir viegli lasāmi un viegli pārlūkojami.

Es galvenokārt saistīšu šo tendenci ar uzņēmumiem un tehnoloģiju dibinātājiem bet tas var būt izplatīts arī blogos.

Atzīmējiet nākamo reizi, kad redzat šo tendenci, jo tā ir visur. Un es ceru, ka tā turpinās augt arī 2017. gadā.

3. Žurnālu stila emuāri

Emuāri bija tik nišas koncepcija jau 2000.gadu sākumā. Ja 2003.gadā darbojies blogs, tas tika uzskatīts par gudru mazo hobiju. Jau nedaudz vairāk nekā desmit gadus šī tendence ir radikāli mainījusies. Tagad blogi var būt nodrošināt pilna laika ienākumus, un viņi sāk izskatās daudz vairāk kā digitālie žurnāli.

Paskatieties atpakaļ uz oriģinālo TechCrunch dizainu, kad tas pirmo reizi tika uzsākts 2006. gadā. Šķiet, ka tas ir vispārējs WordPress blogu?

Tagad paskatieties uz pašreizējo Techcrunch mājaslapu 2017. gadā:

Tas ne tikai izskatās kā žurnāls, tas arī darbojas kā viens. TechCrunch katru dienu publicē desmitiem (ja ne simtiem) jaunu amatu. Viņi ir # 1 sākuma avots, lai uzzinātu par jaunumiem.

Žurnālu stila dizaina tendences ir ļoti atšķirīgas. Mājas lapa izmanto a liela stāsta sadaļa, katram ziņojumam ir savs sīktēls, un rakstu lapas centrējiet ap virsrakstu.

Kad jūs domājat par to, TechCrunch nav daudz mainījies. Tas joprojām ir “tikai emuārs”. Bet tas ir projektēts un pārvaldīts kā žurnāls, un tas padara visu atšķirību.

4. Video foni

Skaņas automātiskā atskaņošana varbūt ir visvairāk kaitinoša tendence tīmeklī. Bet pārsteidzoši, automātiska atskaņošana (bez skaņas) strauji augoša tendence. To var pamanīt desmitiem uzņēmumu vietņu, kurās ir video fons pārņem visu ekrānu.

Man patiešām patīk šī tehnika, kad tā tiek pareizi lietota. Kamēr video attiecas uz vietni un neaizkavē saturu, Es domāju, ka tas ir foršs efekts, ko izmantot jūsu galvenē.

5. Spoku pogas

Kā minimālisms web dizains, rodas jaunas tendences. Viena šāda tendence ir spoku pogas kam nav iekšējās aizpildīšanas, bet tām ir ārējā robeža.

Lielāko daļu laika šīs pogas pretstatā citiem pievērst uzmanību. To var redzēt Instantmojo mājaslapā ar zaļo pierakstīšanās pogu atrodas blakus spoku poga, kas savieno dzīvu demonstrāciju.

Citas vietnes ir pieņēmušas tīri spoku dizaina stils to pogām. Lielisks piemērs šeit ir jaunais Bootstrap izkārtojums.

Es domāju, ka spoku pogas darbojas vietnēs virzīties uz minimālismu. Tie var nebūt piemēroti katrai vietnei, bet es redzu, ka to lietošana katru gadu pieaug.

6. Modāla loga opcijas

Modālie logi ir ļoti kaitinoši, un es nevaru iedomāties, ka kāds lietotājs to vēlētos. Tomēr ir pierādīts, ka tie palielina pierakstīšanos, un tirgotāji nevar ignorēt metodes, kas darbojas.

Tāpēc es domāju, ka modālie izvēles logi būs turpināt kāpt 2017. gadā.

Viņi nav mana mīļākā lieta, un es nekad tos nepievienoju savām tīmekļa vietnēm. Bet, ja mērķis ir palielināt pierakstīšanos, tad modālie logi ir drošs veids, kā iegūt lietas.

Jauni spraudņi var pat mērķa izejas nodoms kas izraisa modālu kad lietotājs mēģina atstāt vietni. Citi modāli parādās pēc x sekundēm vai ir iestatīti, lai atvērtu, kad lietotājs pārvietojas pietiekami tālu.

Neatkarīgi no tā, kā tiek aktivizēti modāli, kā viņi ir izstrādāti, vai kā jūs jūtaties par tiem, es domāju, ka viņi būs garā ceļā.

7. ilustrācija un vektora māksla

Ar jaunām vektora dizaina programmām, piemēram, Sketch un Affinity Designer, ir jauns ilustratoru vilnis, kas ielauzās tīmeklī. Grafiskais dizains un interfeisa dizains nepārtraukti apvienojas ar daudznozaru dizaineriem, nekā jebkad agrāk.

Tas nozīmē, ka mēs redzēsim daudz vairāk pielāgotu ikonu un visu lapu ilustrācijas tuvākajā nākotnē.

Daudzi ilustratori praktizē māksliniekus, tāpēc es domāju, ka mēs redzēsim vairāk pilnas lapas fonu izgatavots ar digitālo krāsošanas programmatūru, kas sniegta detalizēti kā konceptuālā māksla.

8. Fiksētie ritināšanas sānjoslas

Pirmais fiksētā dizaina vilnis koncentrējas uz navigācijas joslām. Tie ir pārāk izplatīti, jo īpaši atsaucīgajos dizainos, kur fiksētā navigācijas josla atkārto dzimtās mobilās lietotnes sajūtu.

Bet 2017. gadā es ceru redzēt vēl vienu lipīgu elementu-lipīga sānjosla.

Gandrīz katrs nozīmīgākais emuārs izmanto šāda veida lipīgo sānjoslu. Tā saglabā saturu visu laiku un palielina lietotāju varbūtību mijiedarbojas ar sānjoslas saturu.

Plus ar desmitiem bezmaksas jQuery plugins, kas var atkārto lipīgo sānjoslas efektu. Tas ir vieglāk nekā jebkad iepriekš to iestatīt jebkurā tīmekļa vietnē.

9. Satura rādītājs lapā

Nesenā pētījumā tika konstatēts, ka garformāta saturs ir labāks par īso formu gan klasifikāciju, gan lietotāju saglabāšanas kvalitāti. Piešķirot to ne vienmēr ir taisnība, jo dažiem vaicājumiem var ātri atbildēt.

Bet tīmeklī ir daudz garāka satura, tas ir dabiski redzēt vairāk satura, kas pievienotas rakstos. To redzēsiet ilgās pārskatīšanas vietnēs vai rakstos, kas iedalās uzskaitītajos vienumos.

Varat pievienot satura rādītāju uzlabot lietotāju pieredzi un palīdzēt izjaukt lasījumu mazākos gabalos. Saturs var būt arī palīdzēt jūsu vietnes rangam labāk! Ja Google uzskata, ka jūsu lapa ir vērtīga, jūs varētu iegūt lēcienu saites meklēšanas rezultātos.

Varētu būt taisnība, ka TK pašlaik ir diezgan ierobežoti. Bet es ceru, ka šī tendence uzplaiks 2017. gadā un pēc daudziem gadiem.

10. Spilgti krāsaini dizaini

Es neesmu pārliecināts, vai šī tendence parādījās no minimālisma vai kā reakcijas uz Google materiālo dizainu. Bet es esmu stumbled uz desmitiem tīmekļa vietnes, kas izmanto spilgtas pasteļkrāsas, kas sajauktas ar citiem spilgtiem toņiem radīt ļoti izdomātu izskatu.

Rentberry mājas lapa ir lielisks piemērs, kas arī izmanto tonnas slīpumu. Un tas pat ir iepriekš “Tiek piedāvāts” pazīmes, kas atrodas zem! Divas tendences vienā vietnē.

Jūs pamanīsiet, ka krāsas neizmantojiet visu lapu, un tie ir izslēgti ar citiem baltas un pelēkas toņiem.

Esmu pietiekami daudz no tiem dinamiskas krāsu shēmas uzskatīt, ka viņi pieaug.

11. Ritiniet animācijas

Tīmekļa dizaineri zina par slīdēšanu un cik briesmīgi tas ir. Tomēr tas nav tas, ko es domāju ar nosaukumu “ritiniet animācijas”. Es tagad esmu redzējis daudzas vietnes animēt saturu kad atrodaties dažu lapas daļu.

Šī tendence ir galvenokārt attiecas tikai uz starta mājas lapām un SaaS uzņēmumiem kas vēlas, lai viņu dizainā būtu daži pizzazz.

Es nevaru pateikt, vai tā ir īpaši noderīga tendence. Tas noteikti tas greifers aci bet es nedomāju, ka tas piedāvā daudz vairāk par estētiku. Tomēr tā ir tendence, kas, šķiet, izplatās ātri un kad lieto taupīgi tas var būt patiesi veikls.

12. Vienas lapas lietotnes (ĪAT)

Vienlapu lietojumprogrammas ir tīmekļa vietnes tikai ar Ajax zvaniem. JavaScript velk saturu no servera un ielādē to dinamiski, tā lapa nekad atsvaidzina.

Bieži piemēri ir vietnes, piemēram, Gmail un Facebook. Bet ar vairāk JS tehnoloģiju, Es pamanīju, ka arvien vairāk un vairāk ĪAT attīstījās. Heck, pat CodePen var uzskatīt par ĪAT.

Ar spēcīgām frontendu bibliotēkām, piemēram, React & Aurelia, 2017. gadā būs vēl vieglāk izveidot SPA no nulles.

13. Pielāgojami meklēšanas joslas

Tas agrāk bija meklēšanas lauki vienmēr bija redzami kaut kur tīmekļa lapā vai nu sānjoslā, vai navigācijā. Bet pēdējā laikā es esmu ievērojis daudz vairāk meklēšanas lauku noklusējuma, un tam jābūt mainīts skatā.

Protams, ērta tendence ietaupīt vietu lapā vēl joprojām meklēšanas funkcijas pieejamības saglabāšana. Ja neesat pārliecināts par to, kur meklēt veidlapu ievietot jaunā dizainā, varat apsvērt iespēju pārslēgt lauku, kas saistīts ar palielināmā stikla ikonu navigācijā.

14. Adblock ziņas

Nav noliegt to, ka reklāmu bloķēšana pieaug. Vienīgais jautājums ir, kā izdevēji rīkosies ar šo tendenci. Dažas vietnes pieklājīgi pievienot ziņas reklāmu telpās kā Time.com. Uz Hongkiat jūs pamanīsiet iekšējās reklāmas, lai aizpildītu tukšumu kas tālāk saista vietni.

Viena nopietna tendence, ko es redzu, ir pieaugums adblock satura bloki. Tā ir metode “bloķēt reklāmu bloķētājus”. Šī funkcija jau ir ieviesta daudzās lielās vietās, piemēram, Business Insider un Forbes. Diemžēl tas kaitē gan lietotājam, gan izdevējam, un tas viss izriet no sliktas kvalitātes reklāmas metodēm.

Galu galā, tas nav svarīgi, kas jūs vainojat, vai kur jūs atrodaties reklāmu bloķēšanas debatēs. Vairāk cilvēku instalē adblock spraudņus, un es ceru vairāk izdevēju virzīt atpakaļ.

15. Pure SVG ikonas

SVG grafika jau ir iekļuvuši tīmeklī, bet viņi katru dienu palielinās. Un man ir sajūta, ka 2017. gads būs milzīgs gads SVG tīmeklī.

Jūs varat atrast tūkstošiem bezmaksas SVG ikonas tādās vietnēs kā Flaticon, ja jūs zināt, kā meklēt. Bet jūs varat arī kodēt SVG HTML, piemēram, izmantojot šo piemēru CodePen.

Tātad, dizaineriem ir veids, kā izmantot SVG, un izstrādātājiem ir arī veids, kā izmantot SVG. Moderns pārlūka atbalsts izskatās labi visur, tāpēc nav saderības problēmu. Viss, kas nepieciešams, ir pietiekami daudz dizaineru atpazīt SVG spēku un sākt tos izmantot!

16. Adobe XD

Adobe izlaida pilna Adobe XD beta versija 2016. gadā un kopš tā laika strauji pieaudzis. Tā pašlaik ir atbalsta gan Mac, gan Windows, un tas ir testēšanas fāzē pirms to izvilkšanas.

Jūs varat izvairīties no idejas par jebkuru programmu, kas pārspēj skici, bet Adobe ir galvenais radošo darbu programmatūras uzņēmums, kas ir iemesls. Plus skice joprojām ir tikai Mac, kamēr Adobe ir vēlas atbalstīt ikvienu.

Esmu pārliecināts, ka nākamajā gadā mēs lasīsim daudz vairāk par Adobe XD. Tā var kļūt par lietojumprogrammu UI maketus-lai mēs beidzot varētu izmantot Photoshop kā foto manipulācijas rīku (kā paredzēts).

Ar jaunas programmatūras pieaugumu nāk desmitiem konsultācijas un freebie GUI komplekti arī. Jūs varat atrast daudz Adobe XD freebies Dribbble kopā ar divas jaunas XD orientētas freebie vietnes Designmine un XD Guru.

17. Vairāk hamburgeru izvēlņu

Mīlu to vai ienīst to šeit ir hamburgers. Ir daudz izmantojamības pētījumu iebilst pret izvēlnēm, kas paslēptas no skata. Bet ar nelielu ekrānu un tikai tik daudzām alternatīvām tagad nav labākas alternatīvas.

Hamburger ikonas ir lēni kļūstot par atpazīstamiem simboliem navigācijas izvēlnēm. Tāpat kā palielināmā stikla ikona “Meklēt”, 3 bāru hamburgeru ikona drīz būs sinonīms “izvēlnē”.

Tas jau ir taisnība attiecībā uz lielāko daļu tehniski gudru personu. Bet ar katru gadu vairāk cilvēku saņem viedtālruņus un sāk pārlūkot mobilo internetu. Un viņi mācās saistīt šo hamburgeru ar navigācijas izvēlni bez gala.

18. Produkta funkciju ikonas

Es rakstīju par šo tendenci Treehouse, bet nesen to neesmu pieminējis. 2017. gadā šī tendence ir būs milzīgs. Tas, iespējams, ir visizplatītākais veids, kā koplietojiet produkta funkcijas mājaslapā.

Jūs sākat ar iezīmju saraksta izveidošana jūsu produktam. Produkts var būt jebkas no SaaS programmas līdz WordPress tēmai vai pat fiziskam objektam.

Tad jūs varat arī veidot pielāgotas ikonas vai atrast ikonu kopu lai attēlotu šīs funkcijas. Vislabāk ir izvairīties no vispārējām iezīmēm piemēram, “uzticama” vai “ātri” jo lielākā daļa cilvēku sagaida šo lietu.

Tā vietā saraksta funkcijas kas faktiski ir svarīgi. Ja tā ir augstākā līmeņa WP tēma, varbūt uzskaitiet, ka tā ir atsaucīga, cik daudz logrīku tā nāk ar vai kā darbojas izvēlne.

Šīs funkcijas ikonas strādā kā vizuāli palīdzēt pārdot katru funkciju. Vienīgais teksts ir grūti patērēt bet vizuāli ir daudz vieglāk saprast īsumā.

19. Pārsniedzot CTA

Uzaicinājums uz rīcību tradicionāli visā tīmekļa vietnē. Bet ar apmeklētājiem mazāk laika pavadīt tīmekļa vietnēs, ir ļoti svarīgi, lai būtu spēcīgs CTA tieši virs pārsega.

Šie aicinājumi uz rīcību varētu būt pogas, izvēles formas vai citas ievades vadīt cilvēkus rīkoties piemēram, pierakstoties vai lasot blogu.

Es nevaru pateikt, kā veidot CTA vai kā to optimizēt reklāmguvumiem. Bet es varu teikt, ka tendence šķiet, ka šīs CTA tiek ievietotas virs pārsega un skaidrā skatā visiem apmeklētājiem.

20. Mazākas satura jomas

Monitori ir palielinājušies tik lieli, ka vairumam tīmekļa vietņu ir jābūt iestatiet maksimālo platumu. Ir daudz grūtāk lasīt teikumus, kad tie ir 2000px plati, salīdzinot ar tikai 700px platumu.

Mazāks saturs ir vieglāk patērēt, un galu galā rada a labāka pieredze ar saturu saistītās tīmekļa vietnēs.

Es domāju, ka vairāki dizaineri to saprot un lēnām samazināt to satura jomu. Es dodu priekšroku maksimālajam platumam 750px, bet jūs varētu iet līdz pat 600px vai mazāk.

Īsāki punkti ar mazāk teikumu un mazākas satura jomas vienmēr palielināt lasāmību. Galvenās publikācijas, piemēram, NY Times, var atšķirties no savām strukturālajām pamatnostādnēm. Bet vienkāršam emuāram vai biznesa vietnei tendence virzās uz priekšu garāks saturs ar mazākiem punktiem un satura apgabaliem.

Ietīšana

Ir daudzas citas tendences, ko es nespēju aptvert šajā amatā, bet es domāju, ka šīs 20 ir interesantākās. Kad mēs virzāmies uz priekšu 2017. gadā, vajadzētu būt skaidrai, kādas tendences ir eksplodējošas un kuras nav.

Un, ja jums ir citas idejas vai ieteikumi par gaidāmajām dizaina tendencēm, nekautrējieties atstāt komentāru tālāk.