{"id":1876,"date":"2017-01-03T05:09:08","date_gmt":"2017-01-03T04:09:08","guid":{"rendered":"http:\/\/blog.webshark.hu\/?p=1876"},"modified":"2017-02-24T14:34:42","modified_gmt":"2017-02-24T13:34:42","slug":"2017-webdesign-trendek","status":"publish","type":"post","link":"https:\/\/blog.webshark.hu\/2017\/01\/03\/2017-webdesign-trendek\/","title":{"rendered":"Webdesign trendek 2017: weboldalak, web\u00e1ruh\u00e1zak, mobil, tipogr\u00e1fia, log\u00f3"},"content":{"rendered":"
Minden \u00e9v v\u00e9g\u00e9n \u00e9s elej\u00e9n elszaporodnak a weben a webdesign-trendekkel kapcsolatos j\u00f3slatok. Ezek persze a 2016-ban kialakult folyamatokra \u00e9p\u00edtenek, de egyben azt is jelzik, hogy mi v\u00e1rhat\u00f3 2017-ben.<\/strong><\/p>\n Megpr\u00f3b\u00e1lunk most egy viszonylag sz\u00e9les spektrumot fel\u00f6lelni – v\u00e1logatva a legk\u00fcl\u00f6nf\u00e9l\u00e9bb el\u0151rejelz\u00e9sekb\u0151l -, \u00edgy nem puszt\u00e1n weboldalak designj\u00e1val foglalkozunk, hanem, log\u00f3-designnal, mobillal, web\u00e1ruh\u00e1zakkal, tipogr\u00e1fi\u00e1val is. V\u00e1gjunk bele!<\/p>\n 2016-ban els\u0151sorban az volt jellemz\u0151, hogy az el\u0151z\u0151 \u00e9vek egyszer\u0171s\u00edt\u00e9se \u00e9s minimalizmusa ugyan megmaradt, azonban a tervez\u0151k megpr\u00f3b\u00e1ltak egy kicsit elmozdulni err\u0151l az alapr\u00f3l. 2017-ben v\u00e1rhat\u00f3an marad ez az ir\u00e1ny, a webdesign valamivel bonyolultabb lesz, mint eddig volt. Induljunk el az alapvet\u0151 dolgok fel\u0151l az apr\u00f3bb trendek fel\u00e9!<\/p>\n Az eszt\u00e9tik\u00e1r\u00f3l m\u00e9g ink\u00e1bb tol\u00f3dik el a hangs\u00faly a haszn\u00e1lhat\u00f3s\u00e1g ir\u00e1ny\u00e1ba. Egyre t\u00f6bb weboldal ismeri fel a fontoss\u00e1g\u00e1t a design-gondolkod\u00e1snak \u00e9s a UX kutat\u00e1soknak. A designerek a l\u00e1tv\u00e1ny helyett egyre ink\u00e1bb strat\u00e9gi\u00e1ban kezdenek gondolkodni. Mindez persze azzal j\u00e1r, hogy lesz n\u00e9h\u00e1ny olyan digit\u00e1lis term\u00e9k, amely elvesz\u00edti karakter\u00e9t, mik\u00f6zben egyre jobb \u00e9lm\u00e9nyt k\u00edn\u00e1l az embereknek.<\/p>\n Ez nem egy \u00fajdons\u00e1g, hiszen m\u00e1r \u00e9vek \u00f3ta a legfontosabb trendek k\u00f6z\u00f6tt szerepel. Ugyanakkor m\u00e9g mindig ez a legfontosabb: m\u00edg n\u00e9h\u00e1ny \u00e9ve a tervez\u0151k m\u00e9g a sz\u00e1m\u00edt\u00f3g\u00e9p monitor\u00e1b\u00f3l indultak ki egy weboldal megtervez\u00e9se sor\u00e1n, most m\u00e1r a mobil \u00e1ll az els\u0151 helyen. Kor\u00e1bban teljesen rendben volt, hogy a l\u00e1tv\u00e1ny el\u0151sz\u00f6r desktopra k\u00e9sz\u00fclt el, majd amikor ezt az \u00fcgyf\u00e9l leok\u00e9zta, akkor ebb\u0151l kiindulva hozz\u00e1csaptak egy mobilmegjelen\u00e9st is.<\/p>\n 2017-ben ez azonban m\u00e1r nem m\u0171k\u00f6dik, az \u00fcgyfelek is tudj\u00e1k, hogy a mobil v\u00e1lt a legfontosabb\u00e1. El\u00e9g csak arra gondolni, hogy a Google \u00e1t\u00e1ll a mobil indexre<\/a> \u00e9s, hogy m\u00e1r r\u00e9g\u00f3ta m\u0171k\u00f6dik a mobilbar\u00e1t algoritmus. \u00cdgy ha valaki j\u00f3 helyen akar szerepelni a keres\u0151ben, akkor figyelnie kell a mobilos megjelen\u00e9sre. S\u0151t, abb\u00f3l kell kiindulnia.<\/p>\n Nem egy \u00fajdons\u00e1g a flat 2.0, egy kor\u00e1bbi cikk\u00fcnkben m\u00e1r tal\u00e1lkozhattatok vele. \u00dagy n\u00e9z ki azonban, hogy tov\u00e1bbra is meghat\u00e1roz\u00f3 designtrend marad. A modern vizu\u00e1lis eszt\u00e9tika a kor\u00e1bbi flat \u00e9s a material design kever\u00e9ke, ahol egy egyszer\u0171 minimalista felhaszn\u00e1l\u00f3i fel\u00fcleten kifinomult bet\u0171t\u00edpusok, felt\u0171n\u0151 sz\u00ednek \u00e9s nagy felbont\u00e1s\u00fa k\u00e9pek jelennek meg.<\/p>\n Ha azt hiszed, hogy a webdesign egyre uniformiz\u00e1ltabb lesz, akkor t\u00e9vedsz. Sz\u00e1mtalan olyan weboldal van, mely szak\u00edt a hagyom\u00e1nyokkal, \u00e9s valami eg\u00e9szen eredetivel pr\u00f3b\u00e1lkozik. Megtehetik, hiszen a webdesign m\u00e1ra sokkal rugalmasabb\u00e1 v\u00e1lt, mint eddig b\u00e1rmikor. A webdesignerek sokszor a printb\u0151l vett \u00f6tletekkel feszegetik a hat\u00e1rokat, \u00edgy kialak\u00edtva \u00e9rdekes \u00e9s m\u0171v\u00e9szi megold\u00e1sokat.<\/p>\n <\/a><\/p>\n Mivel az emberek \u00e9rzelmes l\u00e9nyek, az \u00e9rzelmek meghat\u00e1roz\u00f3 szerepet j\u00e1tszanak a d\u00f6nt\u00e9seikben. Minden egyes weboldal megl\u00e1togat\u00e1sa valamif\u00e9le \u00e9rzelmet v\u00e1lt ki bel\u0151l\u00fck, m\u00e9g akkor is, ha ezt nem vett\u00e9k figyelembe a tervez\u00e9s sor\u00e1n. Az emocion\u00e1lis design csak annyiban k\u00fcl\u00f6nb\u00f6zik a hagyom\u00e1nyos webdesingt\u0151l, hogy megpr\u00f3b\u00e1l \u00e9rzelmi kapcsolatot kialak\u00edtani az emberekkel.<\/p>\n Az ilyen designn\u00e1l gyakran tal\u00e1lkozunk egy kedves l\u00e9nnyel, aki seg\u00edt minket a weboldalon vagy applik\u00e1ci\u00f3ban. Ilyen a bagoly a Duolingon\u00e1l vagy a majom a Mailchimpn\u00e9l. Nekik egyedi szem\u00e9lyis\u00e9g\u00fck van, \u00edgy k\u00f6nnyebben kapcsolatba tudnak ker\u00fclni a l\u00e1togat\u00f3kkal. A pozit\u00edv hozz\u00e1\u00e1ll\u00e1suk hat\u00e1s\u00e1ra az emberek sz\u00edvesebben hozz\u00e1k nyilv\u00e1noss\u00e1gra, p\u00e9ld\u00e1ul egy megoszt\u00e1ssal, hogy kapcsolatba ker\u00fcltek vel\u00fck.<\/p>\n A hero k\u00e9pek \u00e9s a teljes-kijelz\u0151s intr\u00f3k kor\u00e1t \u00e9lj\u00fck, \u00e9s ez v\u00e1rhat\u00f3an m\u00e9g sok\u00e1ig \u00edgy is marad. A l\u00e1tv\u00e1nyos k\u00e9pek most m\u00e1r mindenf\u00e9le weboldalon megjelennek, ott is, ahol eddig tal\u00e1n nem gondoltunk a haszn\u00e1latukra. Nem v\u00e9letlen a n\u00e9pszer\u0171s\u00e9g, hiszen ezek a teljes kijelz\u0151s nyit\u00f3k\u00e9pek m\u00e9lyebb benyom\u00e1st keltenek a l\u00e1togat\u00f3ban, m\u00e9lyebben bele\u00e9getik a retin\u00e1j\u00e1ba a m\u00e1rk\u00e1t. Ezek a k\u00e9pek sokak sz\u00e1m\u00e1ra annyira l\u00e9nyeges elemm\u00e9 v\u00e1lnak, hogy olykor m\u00e9g a navig\u00e1ci\u00f3s elemeket vagy a call to action gombokat is kiszor\u00edtj\u00e1k a weboldalr\u00f3l. Ami tov\u00e1bb fokozhatja a hat\u00e1sukat, az a cinemagraph, az anim\u00e1ci\u00f3k vagy a h\u00e1tt\u00e9rvide\u00f3k alkalmaz\u00e1sa<\/a>.<\/p>\n <\/a><\/p>\n A ’70-es, ’80-as \u00e9vek k\u00f6sz\u00f6nnek vissza a sz\u00ednek \u00e9s a bet\u0171t\u00edpusok v\u00e1laszt\u00e1s\u00e1n\u00e1l, a geometrikus form\u00e1k alkalmaz\u00e1s\u00e1n\u00e1l, a duotone sz\u00edn-kialak\u00edt\u00e1sn\u00e1l<\/a>.<\/p>\n <\/a><\/p>\n <\/p>\n A tartalom alap\u00fa navig\u00e1ci\u00f3 a zavar\u00f3 t\u00e9nyez\u0151k elt\u00e1vol\u00edt\u00e1s\u00e1ra \u00e9p\u00fcl, hogy azok ne vonj\u00e1k el a felhaszn\u00e1l\u00f3 figyelm\u00e9t az inform\u00e1ci\u00f3kr\u00f3l. Ez a t\u00edpus\u00fa navig\u00e1ci\u00f3 k\u00fcl\u00f6n\u00f6sen j\u00f3l m\u0171k\u00f6dik egy\u00fctt a k\u00e1rtya alap\u00fa webdesignnal<\/a>,\u00a0mert a k\u00e1rty\u00e1k seg\u00edtenek abban, hogy em\u00e9szthet\u0151 form\u00e1ban mutassunk meg nagy mennyis\u00e9g\u0171 tartalmat a felhaszn\u00e1l\u00f3knak.<\/p>\n A tartalom alap\u00fa navig\u00e1ci\u00f3t kieg\u00e9sz\u00edti a hossz\u00fa g\u00f6rget\u00e9s, mely egy el\u00e9g j\u00f3 megold\u00e1s egyes tartalmak \u00e1ttekit\u00e9s\u00e9re. M\u00edg kor\u00e1bban probl\u00e9m\u00e1k voltak a felhaszn\u00e1l\u00f3k g\u00f6rget\u00e9si hajland\u00f3s\u00e1g\u00e1val, a mobilok egyre ink\u00e1bb elfogadott\u00e1 teszik. A hossz\u00fa g\u00f6rget\u00e9s leegyszer\u0171s\u00edti a navig\u00e1ci\u00f3t azzal, hogy cs\u00f6kkenti a kattint\u00e1sok sz\u00e1m\u00e1t.<\/p>\n Tal\u00e1n meglep\u0151 lesz, de az is egy webdesign trend, hogy extr\u00e9m gyors weboldalak k\u00e9sz\u00fclnek. K\u00fcl\u00f6n\u00f6sen, hogy olyan nagy a n\u00e9pszer\u0171s\u00e9ge az AMP-nek<\/a>, melye \u00e1ltal vill\u00e1mgyorsan t\u00f6lt\u0151dnek be a weboldal-tartalmak. Ezekkel kell versenyezni a mobil tal\u00e1lati list\u00e1kon, m\u00e1r ha nincs k\u00fcl\u00f6n AMP-s oldalad.<\/p>\n A weboldalsebess\u00e9get illet\u0151en van min jav\u00edtani a vizsg\u00e1latok szerint<\/a>, \u00e9s \u00e9rdemes megc\u00e9lozni a Google \u00e1ltal kor\u00e1bban javasolt 1,5, de ink\u00e1bb az 1 m\u00e1sodperc alatti \u00e9rt\u00e9keket, melyek persze els\u0151re lehetetlennek t\u0171nnek egy \u00e1tlagos oldal sz\u00e1m\u00e1ra.<\/p>\n A mikrointerakci\u00f3kban ma m\u00e1r semmi \u00fajdons\u00e1g nincs, azonban a designerek egyre jobban megtanulj\u00e1k, hogyan haszn\u00e1lj\u00e1k a mikrointerakci\u00f3kat.\u00a0Ez\u00e1ltal javul a weboldalak hat\u00e9konys\u00e1ga \u00e9s kev\u00e9sb\u00e9 vonj\u00e1k el a figyelmet a tartalomr\u00f3l. Egy villanykapcsol\u00f3 megnyom\u00e1s\u00e1t\u00f3l egy Facebook-l\u00e1jkig sz\u00e1mtalan mikrointerakci\u00f3 vesz k\u00f6r\u00fcl<\/a> minket, melyeket \u00e9szre sem vesz\u00fcnk. Egy j\u00f3l megtervezett mikrointerakci\u00f3 meghat\u00e1roz\u00f3 lehet a weboldaladon, mert b\u00e1r egyszer\u0171, nagyon hat\u00e9kony. Egy gomb sz\u00edn\u00e9nek a v\u00e1ltoz\u00e1sa mutatja, hogy lenyomtad, egy hang jelzi, hogy \u00fczeneted \u00e9rkezett. Az egyre kifonomultabb\u00e1 v\u00e1l\u00f3 mikrointerakci\u00f3k kiteljes\u00edtik a felhaszn\u00e1l\u00f3i \u00e9lm\u00e9nyt \u00e9s felkeltik az \u00e9rdekl\u0151d\u00e9s\u00fcnket.<\/p>\n <\/a><\/p>\n <\/p>\n A minimalista megjelen\u00e9ssel egy\u00fctt tov\u00e1bb terjedt 2016-ban a hamburger men\u00fc, \u00e9s hab\u00e1r sok UX-designer gy\u0171l\u00f6lete t\u00e1rgya, ennek ellen\u00e9re m\u00e9g vel\u00fcnk marad egy darabig. Ugyanakkor egyre t\u00f6bb olyan weboldallal tal\u00e1lkozunk majd, amely m\u00e1s\u00a0megold\u00e1st\u00a0ad a minimalista navig\u00e1ci\u00f3 megjelen\u00e9s\u00e9re: terjednek a f\u00fcgg\u0151leges sz\u00f6veges men\u00fck a weboldalak sz\u00e9l\u00e9n (mint itt, asztali megjelen\u00e9sn\u00e9l<\/a>), a ragad\u00f3s men\u00fck az kijelz\u0151 alj\u00e1n \u00e9s az interaktivit\u00e1s (ahogy p\u00e9ld\u00e1ul megjelenik ezen az oldalon<\/a>).<\/p>\n Egyre t\u00f6bben ismerik fel a t\u00f6rt\u00e9netekben rejl\u0151 potenci\u00e1lt az online marketingben. Ami a webdesignt illeti, akadnak m\u00e1r olyan landing oldalak, melyek teljes eg\u00e9sz\u00e9ben egy-egy t\u00f6rt\u00e9netet mes\u00e9lnek el. Egy j\u00f3 t\u00f6rt\u00e9netnek vizu\u00e1lisan \u00e9s \u00e9rzelmileg is vonz\u00f3nak kell lenni az emberek sz\u00e1m\u00e1ra, hogy megalapozza a kapcsolatot vele, \u00e9s azt, hogy mik\u00e9nt \u00e9rezzen az adott term\u00e9k ir\u00e1nt. Sz\u00e1mos ilyen weboldalba futhattunk bele az elm\u00falt h\u00f3napok sor\u00e1n, nem is akarjuk sorolni \u0151ket, szinte kiker\u00fclhetetlenek \u00e9s v\u00e1rhat\u00f3an egyre t\u00f6bb lesz bel\u0151l\u00fck. Ezek interakt\u00edv utaz\u00e1sba r\u00e1ntj\u00e1k be a l\u00e1togat\u00f3t, aki ez\u00e1ltal m\u00e9lyebben meg\u00e9rti a c\u00e9g \u00fczenet\u00e9t.<\/p>\n Ha sok d\u00f6nt\u00e9st kell hozniuk, akkor az emberek belef\u00e1radnak a d\u00f6nt\u00e9sekbe, \u00edgy nem k\u00e9pesek feldolgozni megfelel\u0151en az inform\u00e1ci\u00f3kat, n\u0151 a hib\u00e1z\u00e1s lehet\u0151s\u00e9ge \u00e9s a csal\u00f3dotts\u00e1g. A designnak ez\u00e9rt a d\u00f6nt\u00e9s terh\u00e9t le kell venni a felhaszn\u00e1l\u00f3 v\u00e1ll\u00e1r\u00f3l, \u00e9s mintegy el\u0151re megj\u00f3solva az ig\u00e9nyeit cs\u00f6kkentenie kell a kognit\u00edv terhel\u00e9s\u00e9t. Az el\u0151rel\u00e1t\u00f3 rendszerek a felhaszn\u00e1l\u00f3i \u00e9lm\u00e9nyt a l\u00e1togat\u00f3 preferenci\u00e1i \u00e9s m\u00faltbeli viselked\u00e9se alapj\u00e1n \u00e9p\u00edtik fel. A gyakorlatban ez \u00fagy n\u00e9z ki, hogy ha valaki valamit v\u00e1s\u00e1rolt egy web\u00e1ruh\u00e1zban kor\u00e1bban, akkor annak alapj\u00e1n javasol a rendszer sz\u00e1m\u00e1ra tov\u00e1bbi term\u00e9keket, amikor \u00fajra a web\u00e1ruh\u00e1zban j\u00e1r.<\/p>\n A netet m\u00e1ra eluralt\u00e1k azok az \u00fagynevezett \u201chero\u201d k\u00e9pek, melyek bebor\u00edtj\u00e1k az eg\u00e9sz kijelz\u0151t a weboldalra \u00e9rkez\u00e9skor. Mivel egyre fontosabb\u00e1 v\u00e1lik az egy\u00e9ni megjelen\u00e9s \u00e9s a megk\u00fcl\u00f6nb\u00f6ztethet\u0151s\u00e9g, ez\u00e9rt a stock vagy csak sablonos fot\u00f3kat lev\u00e1ltj\u00e1k az egyedi l\u00e1t\u00e1sm\u00f3dot t\u00fckr\u00f6z\u0151 grafik\u00e1k. Az ilyen k\u00e9zzel rajzolt illusztr\u00e1ci\u00f3k sokkal jobban megragadnak a l\u00e1togat\u00f3kban, akik \u00e1ltaluk m\u00e9lyebb benyom\u00e1sokat szereznek a weboldalr\u00f3l. \u00c9rdemes teh\u00e1t ebbe az ir\u00e1nyba mozdulni, m\u00e9g ha els\u0151re furcs\u00e1nak is t\u0171nik a fot\u00f3k lecser\u00e9l\u00e9se.<\/p>\n A k\u00e9zzel rajzolt ikonok az\u00e9rt nagyszer\u0171ek, mert megjelen\u00e9s\u00fck \u00e9les kontrasztot k\u00e9pez egy tiszta \u00e9s szab\u00e1lyos tipogr\u00e1fi\u00e1val. Nagyon j\u00f3l haszn\u00e1lhat\u00f3k call to action gombokn\u00e1l, hiszen felt\u0171n\u0151 megjelen\u00e9s\u00fck r\u00e9v\u00e9n jav\u00edthatj\u00e1k a weboldalakon a konverzi\u00f3s ar\u00e1nyt.<\/p>\n A lazy loading<\/a> l\u00e9nyege, hogy nem egyszerre t\u00f6lt\u0151dik be egy weboldal minden eleme, hanem fokozatosan, ahogy a felhaszn\u00e1l\u00f3 g\u00f6rget lefel\u00e9 az oldalon. Az el\u0151nyei nyilv\u00e1nval\u00f3k, k\u00fcl\u00f6n\u00f6sen az olyan oldalak sz\u00e1m\u00e1ra, melyeken sok a tartalom. Mivel egyre fontosabb lesz a weboldalak sebess\u00e9ge, \u00e9s ebbe beletartozik a sebess\u00e9g \u00e9lm\u00e9ny\u00e9nek fokoz\u00e1sa is, \u00edgy v\u00e1rhat\u00f3an egyre t\u00f6bb olyan oldalt l\u00e1thatunk majd, mely ezt a technol\u00f3gi\u00e1t felhaszn\u00e1lva \u00e9p\u00fcl fel.<\/p>\n Egyre t\u00f6bb szimetrikusan elrendezett weboldallal tal\u00e1lkozhatunk a weben, ahol a l\u00e9nyeg k\u00f6z\u00e9pen kap helyet. Ha siker\u00fcl j\u00f3l kialak\u00edtani egy ilyen designt, akkor a hat\u00e1s dr\u00e1mai lehet. Term\u00e9szetesen ez a megold\u00e1s nem m\u0171k\u00f6dik minden weboldal eset\u00e9ben, kevesebb tartalom eset\u00e9n lehet jobban alkalmazni.<\/p>\n Egy m\u00e1sik n\u00e9pszer\u0171 megjelen\u00e9s, ha kett\u00e9osztjuk a weboldalunkat. Ezzel a megold\u00e1ssal m\u00e1r 2015 legelej\u00e9n foglalkoztunk<\/a>, \u00fagyhogy nem mondhat\u00f3 rendk\u00edv\u00fcli \u00fajdons\u00e1gnak, ennek ellen\u00e9re k\u00e9ts\u00e9gtelen, hogy trend lett bel\u0151le, \u00e9s marad is 2017-ben. Ezek a legjobban akkor m\u0171k\u00f6dnek, amikor a jelent\u0151s whitespace-t l\u00e1tv\u00e1nyos sz\u00ednekkel \u00e9s tipogr\u00e1fi\u00e1val kombin\u00e1ljuk.<\/p>\n <\/a><\/p>\n A material design<\/a> ind\u00edtotta \u00fatj\u00e1ra az egym\u00e1st \u00e1tfed\u0151 s\u00edkok trendj\u00e9t, melyek a m\u00e9lys\u00e9get hivatottak kifejezni. Nem most kezd\u0151d\u00f6tt teh\u00e1t a diadal\u00fat, azonban ez a megjelen\u00e9s n\u00e9pszer\u0171bb, mint valaha. Nem v\u00e9letlen, hiszen hat\u00e9konyan haszn\u00e1lhat\u00f3, k\u00fcl\u00f6n\u00f6sen, ha kontrasztos sz\u00edneket \u00e9s m\u00e9ly \u00e1rny\u00e9kokat is bevet\u00fcnk mell\u00e9.<\/p>\n Eddig is n\u00e9pszer\u0171ek voltak a sz\u00edn\u00e1tmenetek a weboldalakon, azonban ezen siker\u00fclt mostanra egy kicsit csavarni, \u00e9s m\u00e1r nem egyszer\u0171 sz\u00edn\u00e1tmenetekr\u0151l besz\u00e9l\u00fcnk, hanem ezen bel\u00fcl k\u00f6l\u00f6nb\u00f6z\u0151 form\u00e1k megjelen\u00e9s\u00e9r\u0151l. Hogy mire is gondolunk? Valami ilyesmire:<\/p>\n <\/a><\/p>\n A flat \u00e9s a minimalizmus<\/a> \u00e9vei ut\u00e1n megjelentek ism\u00e9t az \u00e1rny\u00e9kok a webdesignban, \u00e9s \u00fagy t\u0171nik, hogy n\u00e9pszer\u0171s\u00e9g\u00fck csak fokoz\u00f3dik. Ugyanakkor a designerek megpr\u00f3b\u00e1lnak mindig \u00faj \u00e9s eredeti megjelen\u00e9sekkel k\u00eds\u00e9rletezni, \u00edgy most m\u00e1r nem egyszer\u0171 \u00e1rny\u00e9kokr\u00f3l van sz\u00f3, hanem ezeket sz\u00ednekkel vegy\u00edtik \u00e9s \u00f3ri\u00e1sira ny\u00fajtj\u00e1k. Ez\u00e1ltal kiemelked\u0151bb\u00e9 v\u00e1lnak az \u00e1rny\u00e9kol\u00f3 elemek, \u00e9s maga a design is felt\u0171n\u0151bb\u00e9 v\u00e1lik.<\/p>\n Hab\u00e1r chatbotok m\u00e1r r\u00e9g\u00f3ta l\u00e9teznek, jelent\u0151s fejl\u0151d\u00e9sen mentek kereszt\u00fcl. Egyre t\u00f6bb weboldalon lehet tal\u00e1lkozni chatbotokkal vagy olyan appokkal, melyek k\u00fcl\u00f6nf\u00e9le feladatokat hajtanak v\u00e9gre. P\u00e9ld\u00e1ul felhaszn\u00e1l\u00f3i t\u00e1mogat\u00e1st k\u00edn\u00e1lnak, esetleg rendelni lehet valamit a seg\u00edts\u00e9g\u00fckkel.<\/p>\n Mi\u00e9rt v\u00e1ltak olyan n\u00e9pszer\u0171v\u00e9? Mert a vel\u00fck folytatott interakci\u00f3 hasonl\u00edt a val\u00f3di besz\u00e9lget\u00e9sekhez. A besz\u00e9lget\u00e9s pedig egy nagyon term\u00e9szetes kommunik\u00e1ci\u00f3s forma az emberek sz\u00e1m\u00e1ra. Ez\u00e1ltal a chatbotok haszn\u00e1lata is \u00f6szt\u00f6n\u00f6s \u00e9s k\u00f6nny\u0171 sz\u00e1mukra. Legal\u00e1bbis k\u00f6nnyebb lehet, mint gombokat nyomogatni, vagy \u00f6sszetett men\u00fckben kiigazodni egy felhaszn\u00e1l\u00f3i fel\u00fcleten.<\/p>\n A chatbotokban rejl\u0151 lehets\u0151gekr\u0151l itt<\/a> \u00edrtunk kor\u00e1bban, m\u00edg a chatbotok kommunik\u00e1ci\u00f3j\u00e1nak kialak\u00edt\u00e1s\u00e1r\u00f3l<\/a> itt olvashatod bejegyz\u00e9s\u00fcnket.<\/p>\n Ahogy a webdesignban, \u00fagy a tipogr\u00e1fia ter\u00fclet\u00e9n is \u00e1lland\u00f3ak a v\u00e1ltoz\u00e1sok. Neh\u00e9z is k\u00f6vetni \u0151ket az \u00e1lland\u00f3 m\u00e9diazajban. De l\u00e1ssuk, hogy milyen f\u0151 ir\u00e1nyok rajzol\u00f3dtak ki mostan\u00e1ban!<\/p>\n L\u00e1that\u00f3an egyre n\u0151 a n\u00e9pszer\u0171s\u00e9g\u00fck a geometrikus bet\u0171t\u00edpusoknak. Olyan nagy nevek haszn\u00e1lj\u00e1k, mint a Pepsi, a Virgin Atlantic \u00e9s az Adidas. Ezzel az egyszer\u0171 megjelen\u00e9ssel k\u00f6zvet\u00edtik az \u0151szintes\u00e9g \u00e9rz\u00e9s\u00e9t \u00e9s megb\u00edzhat\u00f3s\u00e1got a m\u00e1rk\u00e1val kapcsolatban. Olyan \u00faj fontok jelentek meg ebben az \u00e9vben, mint az FS Lucas, a Publica Sans vagy az ESPN saj\u00e1t fontja. De mint minden esetben, itt is fontos, hogy a megfelel\u0151 bet\u0171t\u00edpust a megfelel\u0151 kontextusban alkalmazzuk. Ahogy p\u00e9ld\u00e1ul a Jova.<\/p>\n <\/a><\/p>\n Ahogy n\u0151 a k\u00fcl\u00f6nb\u00f6z\u0151 mobileszk\u00f6z\u00f6k sz\u00e1ma, \u00fagy igyekszik a legt\u00f6bb tech c\u00e9g saj\u00e1t bet\u0171t\u00edpusokat kialak\u00edtani. Ilyen volt az Amazon Bookerly-je, mely az\u00e9rt sz\u00fcletett, hogy cs\u00f6kkentse a szem f\u00e1radts\u00e1g\u00e1t olvas\u00e1s k\u00f6zben. Az Apple el\u0151\u00e1llt a San Francisc\u00f3val, m\u00edg a Google folytatta a Product Sans terjeszt\u00e9s\u00e9t. De nem csak a tech c\u00e9gek alkottak maguknak saj\u00e1t bet\u0171t\u00edpusokat, hanem p\u00e9ld\u00e1ul Hillary Clinton sz\u00e1m\u00e1ra is l\u00e9trehozt\u00e1k a Unityt, m\u00edg a Buzzfeed \u00e9s a Font Bureau a BF Tiny Handet, ami Donald Trump jellegzetes k\u00e9z\u00edr\u00e1s\u00e1t ut\u00e1nozza.<\/p>\n Aki ezek ut\u00e1n neki\u00e1llna saj\u00e1t bet\u0171t\u00edpust gy\u00e1rtani, k\u00f6nnyebb helyzetben van, mint n\u00e9h\u00e1ny \u00e9ve, hiszen olyan \u00faj \u00e9s alapvet\u0151 eszk\u00f6z\u00f6k jelentek meg, mint a Prototypo vagy a FontArk. Az egyedi bet\u0171t\u00edpusok trendje v\u00e1rhat\u00f3an 2017-ben is folytat\u00f3dik, k\u00fcl\u00f6n\u00f6sen akkor, ha az Adobe Project Faces is v\u00e9gre kil\u00e9p a fejleszt\u00e9si szakaszb\u00f3l.<\/p>\n A reszponz\u00edv design m\u00e1r nyilv\u00e1n senkinek sem \u00fajdons\u00e1g, az azonban tal\u00e1n igen, hogy beker\u00fclt a mainstreambe a reszponz\u00edv tipogr\u00e1fia is. A l\u00e9nyege, hogy biztos\u00edtani kell az olvashat\u00f3s\u00e1got az eszk\u00f6z\u00f6k \u00e9s kijelz\u0151m\u00e9retek sz\u00e9les sk\u00e1l\u00e1j\u00e1n. Hogy ez hogy m\u0171k\u00f6dik a gyakorlatban? A Benton Modern oldal\u00e1n megtekinthet\u0151<\/a> a b\u00f6ng\u00e9sz\u0151ablak m\u00e9ret\u00e9nek v\u00e1ltoztat\u00e1s\u00e1val.<\/p>\n A reszponz\u00edv tipogr\u00e1fia azonban m\u00e9g gyerekcip\u0151ben j\u00e1r, egy fejl\u0151d\u0151 ter\u00fclet, \u00edgy nincsenek is olyan szab\u00e1lyai m\u00e9g, melyeket k\u00f6vetni lehetne. Tov\u00e1bb nehez\u00edti a helyzetet, hogy nem csak arr\u00f3l sz\u00f3l, hogy alkalmazkodni kell mindenf\u00e9le kijelz\u0151m\u00e9retekhez, hanem m\u00e1s m\u00f3dokon is befogadhat\u00f3v\u00e1 kell tenni a sz\u00f6vegeket. Tov\u00e1bbi r\u00e9szletek itt tal\u00e1lhat\u00f3k<\/a>.<\/p>\nWebdesign trendek 2017-ben<\/h2>\n
Nagyobb hangs\u00faly a UX-en<\/h3>\n
Mobile-first design<\/h3>\n
Flat design 2.0<\/h3>\n
Absztrakci\u00f3<\/h3>\n
Emocion\u00e1lis design<\/h3>\n
Nagyfelbont\u00e1s\u00fa k\u00e9pek<\/h3>\n
Retro<\/h3>\n
Tartalom alap\u00fa navig\u00e1ci\u00f3 \u00e9s hossz\u00fa g\u00f6rget\u00e9s<\/h3>\n
Tov\u00e1bb gyorsul\u00f3 weboldalak<\/h3>\n
Mikrointerakci\u00f3k \u00e9s funkcion\u00e1lis anim\u00e1ci\u00f3k<\/h3>\n
Interakt\u00edv navig\u00e1ci\u00f3<\/h3>\n
Interakt\u00edv t\u00f6rt\u00e9netmes\u00e9l\u00e9s<\/h3>\n
A felhaszn\u00e1l\u00f3i ig\u00e9nyek el\u0151rejelz\u00e9se<\/h3>\n
Rajzolt illusztr\u00e1ci\u00f3k<\/h3>\n
K\u00e9zzel rajzolt ikonok<\/h3>\n
Lazy loading<\/h3>\n
K\u00f6z\u00e9pre rendezett vagy kett\u00e9osztott tartalmak<\/h3>\n
Egym\u00e1sra helyezett\u00a0s\u00edkok<\/h3>\n
Form\u00e1k + sz\u00edn\u00e1tmenetek<\/h3>\n
Nagy, sz\u00ednes \u00e1rny\u00e9kok<\/h3>\n
Chatbotok<\/h3>\n
Trendek a tipogr\u00e1fi\u00e1ban<\/h2>\n
Geometrikus bet\u0171t\u00edpusok<\/h3>\n
Egy\u00e9ni bet\u0171t\u00edpusok<\/h3>\n
Reszponz\u00edv tipogr\u00e1fia<\/h3>\n
V\u00e1ltoztathat\u00f3 fontok<\/h3>\n