15 veebidisaini suundumusi 2012. aastaks
Seni on 2011. aasta toonud kaasa hämmastavaid muudatusi disaini ja Interneti-tehnoloogias. Veebiarendus on muutunud õppimiseks üsna sujuvamaks objektiks, rääkimata lugematutest avatud lähtekoodiga raamatukogudest, mis on protsessi lihtsustamiseks kasulikud. Ja siiski tundub, et ülemaailmne disainikogukond ei ole rätikust kaugel.
Ma tahan tutvustada 15 ideed, mis on viimase aasta jooksul väga kiiresti kasvanud. Need suundumused hõlmavad veebi- ja graafika kujundamise tehnikaid, mis tõenäoliselt mängivad suurt rolli 2012. aastal. Te olete ilmselt näinud mõnda neist esindatud paljudes teie lemmiksaididel Internetis.
Õnneks on nende funktsioonide rakendamise meetodid üha lihtsamini mõistetavad ja koodis palju õhemad.
1. Reageeriv liidese disain
Keskmine kasutaja kogemus on veebisaidi kavandamisel kõige olulisem aspekt. Sa tahad, et leheküljeelemendid reageeriksid klaviatuuri / hiire sisestusele kiiresti ja käituksid ootuspäraselt. Mõned näited võivad sisaldada külg-väljapääsu menüüsid, rippmenüüsid ja hüpikaknaid.
Sealhulgas kuulsad JavaScript-raamatukogud, nagu MooTools ja jQuery, on nende funktsioonide animeerimine ja veelgi rohkem muutunud lihtsamaks. Enamik tänapäeva brausereid toetavad seda koodi ja isegi lagunevad, kui skriptid pole saadaval. Lõppkokkuvõttes soovite, et kasutaja tunneks end mugavalt disaini kõikjal suhtlemisel.
Samamoodi peaksite arvestama vormi sisendit ja andmete kontrollimist. Paljudel registreerimislehtedel saate iga sisendpiirkonna kaudu töötamisel väikesed vastused. Võite automatiseerida kehtivate e-posti aadresside, dubleerivate kasutajanimede ja isegi paroolide sisendite kontrollimist. See säästab aega kasutaja lõpus ja annab mugavuse kogu registreerimisprotsessi vältel.
2. Puuteekraani mobiilseadmed
Viimase paari aasta jooksul on ilmnenud, et nutitelefonid saavad isegi mitte-tech entusiastide seas toetust. Kuid alles alates 2011. aastast oleme näinud mobiilsete saitide ja mobiilipõhiste mallide plahvatust.
IPhone'i ja iPadi seadmete populaarsus koos Android-toega telefonidega tähendab, et külastajad suhtlevad oma lehtedega puutetundliku käsuga. See peab muutuma iga disainimudeli realistlikuks kaalutluseks. Mobiilse veebi disaini suundumused on näidanud, et täiesti eraldi mobiiliteema loomine annab sageli parima tulemuse. Sel moel saate hoida oma dünaamilist sisu oma põhiplaanil paigas, pakkudes mobiilikasutajatele saidi kitsamat versiooni.
3. Tonnid tasuta!
Kes võib öelda, et nad ausalt ei saa tasuta allalaadimisi? Veebidisainerid on juba aastaid oma sisu võrgus jaganud, kuid alles hiljuti on see muutunud digitaalsete kunstnike seas väga populaarseks. On olnud vähe kogukondi, mis on ehitatud spetsiaalselt veebipõhiste ja graafiliste disainerite jaoks tasuta allalaadimiseks.
Kaks minu isiklikku lemmikut on Download PSD ja Designmoo, mida mõlemad värskendavad tihti tippkvaliteediga liikmed. Lisaks on Hongkiat Freebies arhiivis palju magusaid hüvesid. Igal ajahetkel, enne kui see on sõna otseses mõttes kunagi olnud lihtne tasuta veebiliideseid, skeeme, logosid, bännereid ja praktiliselt mis tahes muud tüüpi PSD / AI-faili laadida!
Mõned peened allalaadimised
Allpool on vaid mõned jahedad freebies, et vaadata 2011. aasta algusest välja. Ja kui arvate, et sellel loendil on suurepäraseid faile, siis oodake kuni 2012. aastani.!
Mini-veebi kasutajaliides
Dark Mini Music Player
Libistavad sildid
Tume foto liugur
Otsingukastid
Logige sisse / logige sisse
Logi sisse Modal Box
Puhas sisselogimisvorm
Hinnakujunduse tabelid
Minimaalsed laadimisribad
Manuse hüpik
4. HTML5 ja CSS3 standardid
Mõlemad uued disainilahenduste arhetüübid on kogu 2011. aasta jooksul pidevalt kasvanud. Semantilised veebidisainerid on oodanud aastaid, et CSS-i ainult disainilahendused ümardatud nurkade ja varjude varjata. Lisaks on W3C teinud palju edusamme kõige populaarsemate brauserite toetuse hankimisel.
Ma näen ainult häid asju HTML5 / CSS3 veebiarenduse tuleviku jaoks. Esialgsed disainerid on tänases valdkonnas sageli tähelepanuta jäänud, kuid nad on kogu koostamisprotsessi jaoks väga tähtsad. Püüa mitte pigistada ennast üheski "märgis", mis põhineb teie poolt teadaolevatel ja igapäevaselt kasutatavatel tehnikatel. Pakume HTML5 / CSS3 kodeerimise jaoks algajatele mõeldud juhendit, kui tunnete vajadust järele jõuda.
Nende uute standardite järgimine muudab JavaScript ja jQuery arendamise nii palju lihtsamaks. Arendajad on juba oma HTML5 / CSS3 projekti koodi avaldanud ja jaganud võrgus ning kui asjad jätkuvad, märgime kindlasti, et järgmisel aastal läheb palju rohkem.
5. Paelad ja bännerid
Kuigi see disainitehnika pole täpselt nii “uus” see ei ole kunagi hiljuti peavoolu läbinud. Olete ilmselt näinud nurgalindide, bänneri navigeerimisribade ja väikeste lintmärkide näiteid. Need suundumused on tõenäoliselt plahvanud, kuna üksikasjalikud õpetused kogunesid tohutult, mida võib leida kogu Google'i kaudu.
Veebidisainerid on tänapäeval rohkem pädevad oma blogide esitamiseks teabe jagamiseks. Nüüd on disainerite vahel lihtne levitada lihtsaid tehnikaid, et dubleerida kõige populaarsemaid efekte. Seal on isegi tasuta PSD-sid, mida saate alla laadida, et säästa oma jõupingutusi.
6. Premium WordPressi teemad
WordPress 3.0 lõplik väljaanne sisaldas hulgaliselt kauaoodatud funktsioone, nagu kohandatud postituste tüübid ja unikaalsed artikli pildid. Kuid kõige sügavamad muutused, mida olen näinud, on pärit WordPressi arenduspoodidest, mis on spetsialiseerunud premium WP teemadele.
Pärast sellise teema ostmist on paigaldusprotsess sarnane mis tahes teisele. Samas on nüüd võimalik lisada teemasse ka kohandatud pistikprogrammide funktsionaalsus, laste teemad, uued admin menüüd ja terve hulk muid funktsioone! WooThemes, ElegantThemes ja Rocket Teemad on vähe kaubamärke, mis paistavad mind mujalt välja. Nende kvaliteet on laitmatu ja ma tunnen, et nende arendajad lähevad kaugemale, et luua parimad mallid ja kõige intuitiivsemad administraatori menüüd.
2012. Aastal saab ma ette kujutada, et WordPress muutub veelgi lihtsamaks. See tähendab, et vabaneb rohkem kvaliteetseid teemasid ja käivitatakse hämmastavamad blogid.
7. Online-ajakirjad
Rääkides WordPressi teemadest, peaksime avama ka kiiresti vastuvõetud online-ajakirjade edu. Need veebilehed ei erine üldisest WordPressi blogist, välja arvatud üldine struktuur ja lehekülje paigutus. Neid suuremaid pilte saate märkida oma kodulehe esitluse ja saidile kirjutavate autorite kogumise abil.
Kuna ajakirjad hakkavad võrgus liikuma, saavad nad paljude kirjanike sissetulekuallikaks. Selline teema nagu „veebidisain” on suunatud väiksemale nišile kui näiteks mängimine või majandus. Kuid asjaolu, et me näeme rohkem disainiajakirju võrgus kui trükis, näitab, kus maailm võib lähiaastatel suunata.
8. Easy Drop Shadows
CSS3 tahkuna on disaineritel nüüd lihtsam kui varjata vari kõikjal lehel. Kasti teksti ja kasti-stiilis elementidele on antud vastavad omadused, et muuta selgepiirilised varjud.
Teksti-varju süntaks on väga lihtne meelde jätta ja järgida piki vari. Kui pildid on nende efektide tegemisel tarbetud, võivad veebiarendajad keskenduda nende põhiideede laiendamisele.
9. Dünaamiline tüpograafia
Fondid on suur osa valdkonnast, mis hõlmab veebidisaini traditsioone. Kõige tähelepanuväärsemad fondid, sealhulgas Arial, Helvetica, Gruusia ja Trebuchet MS, on juba aastaid olnud. Kuigi nad jätkavad veebistandardites sügavat eesmärki, on täiustatud veebilehe tüpograafia jaoks palju alternatiivseid võimalusi.
Näiteks vajab Typekit ainult paar rida koodi, mis tuleb lisada teie dokumendipeale. Pärast seda saate määrata, millised fontide nimed CSS-i lisada ja lisada. Parim osa sellest tehnikast on see, et see tugineb peamiselt JavaScriptile, nii et lõppkasutaja ei pea fonte paigaldama.
Teine võimalus on Google Web Fonts, mis käituvad sarnaselt Typekitile. Soovitan huvitatud disaineritel tutvuda CSS3 @ font-face meedia päringuga, kuna teile antakse palju rohkem loovust. Seda koodi saab kasutada a .ttf või .otf font-fail oma veebiserverist ja lisage see kasutatavaks stiilitabeliks! Nii palju alternatiivseid süsteeme, mida kasutatakse dünaamiliste fontide loomiseks, loodan, et 2012. aastal on selles valdkonnas innovatsiooni ja disaini talent..
10. Pildigalerii Slaidiseansid
JQuery järgmise populaarsusega olen leidnud rohkem ja rohkem pilte slaidiesitlustest, mis on veebilehtede paigutamiseks langenud. Galeriid on ideaalsed, et näidata kiiresti sisemise lehe sisu. See võib olla portfelli kirjete, fotode, blogipostituste kogum koos kuvatavate piltidega, demo ekraanipiltidega jne.
Kui arvestate paljude ainulaadsete libistavate ja pleegivate animatsioonidega, ei ole teie kodulehe jaoks kunagi olnud lihtne koostada kiiret slaidiesitust. Ma olen kindel, et 2012. aastal näevad need suundumused üsna kiiresti, mitte ainult disainerite vahel. Veebipõhised veebirakendused ja tarkvarafirmad on kasutanud slaidiseansi juhitud õpetustena ekraanipiltide ja ainulaadsete funktsioonide kuvamiseks.
11. Modaalsed hüpikaknad
Ma arvan, et modaalkastid on Internetile ikka veel üsna uued, arvestades, et nad on juba aastaid ilmunud töölaua- ja mobiilirakendustes. Ümbersuunamisakna eesmärk on pakkuda kasti sisu (näiteks kasutaja registreerimine või sisselogimine) praeguse lehe ülaosale, laadimata uuele lehele.
Paljud avatud lähtekoodiga pildigalerii skriptid kasutavad valguskasti tüüpi, kus taust pimestab hüpikaken. Ma tunnen seda funktsiooni tõesti alati, kui seda näen, kuigi paljud on seda veel vastu võtnud. Ja kuigi modaalsed kastid on seksikad ja klanitud, võivad need olla ka väga keerulised ja töökorras.
Oma veebisaitide ideede saamiseks vaadake mõningaid populaarsemaid sotsiaalse uudiste jagamise kogukondi. Reddit ja Digg on esimesed kaks, mis tulevad meelde, kuna nad mõlemad funktsioonivad registreerimis- / sisselogimismoodulit, millel on tüüpiline paigutus. Lisaks on Google'i kasutajaliidese efektidel suur hulk modaalset funktsionaalsust.
12. Inspireerivad nimekirjad
Nimekirjade kogud on ilmunud juba veebi disaini algusaegadest. Kui me uude sajandisse kolisime, hakkasid disainerid kasutama HTML-i tellitud ja korrastamata nimekirju navigatsioonimenüüdes. Kuid tänapäeval saab nimekirju kasutada ja neid kasutatakse palju rohkem.
Enamikus blogi teemadest leian, et kogu külgriba on täis nimekirju! Rääkimata disaineritest, kes on oma artiklikirjeldustes loovutanud vinge CSS-stiile. Me käsitlesime inspireerivaid nimekirjasid teisel ametikohal käesoleva aasta alguses, mis võib anda sellele küsimusele rohkem teavet. Ootan 2012. aastani, et ootan mõningaid tõeliselt loomingulisi näiteid, mis võivad olla paralleelselt Flowappi kohandatud ülesannete ja ülesannetega.
13. Loodud kujutise pisipildid
Veebimaailmas oleme nõus, et sisu on kuningas. Kuid enamik disainereid nõustub ka sellega, et tühja teksti leht muutub igav reaalseks. Pilte saab lisada, et ekstra vürtsi, kui tead, kuidas neid õrnalt puista. Üks selline meetod on dünaamiliste pisipiltide kasutamine iga lehe või artikli eelvaate esitamiseks.
Tänased blogid võtavad jätkuvalt kasutusele pildi suundumust, nii et miks mitte kasutada genereeritud pisipilte ka oma teemale? Need juhivad sageli tähelepanu artikli pealkirjale ja aitavad lõhkuda lehekülje täis tekstilinkidega.
Teise näitena pakub Dribbble igale disainipildile pisipiltide nimekirja. Sellises tabeli reast stiilis paigutuses on iga pisipildi pilguheit ülimalt kerge ja kerige, et leida otsitavat. See taktika on tõestanud kogu disaini kogukonna tähelepanu! Er, vähemalt Dribbble'i liikmed kõige paremini. Võin ainult eeldada, et 2012. aasta näeb nende mineviku näidete põhjal edasi neid ideid.
14. Liiga suured ikoonid
See ainulaadne trend tuleneb Mac OS X ikoonide kujunduse populaarsusest. Kuna programmeerijad hakkasid oma Maci rakenduste veebisaite käivitama, oleme liiga tihti näinud kaubamärgis esindatud tohutuid suurusi. Sellest tulenevalt on see suundumus ka iOS-i arendajate kaudu tõstatatud ja nüüd on see mugav moodsas disainikultuuris.
On raske ennustada, kuidas need suundumused 2012. aasta jooksul liikuma hakkavad. Ühest küljest võivad need ikoonid olla kohmakad ja vajavad rohkem ruumi. Ometi ei ole me isegi lähedal iOS / OSX-i rakenduste puudusele ja disainerid on ikka veel piksel-täiuslike ikoonide specs. Rääkimata sellest, et veebidisainerid sisaldavad nüüd ka ülimõõdulisi ikoone peaaegu igas lehekülje brändimises! See on hea viis, kuidas nabida oma külastaja otsest tähelepanu ja luua oma ettevõttele nimi.
15. Liialdatud hüperlingid
Ankurlingid on kindlasti ükskõik millise veebisaidi viie kõige olulisema elemendi sees. Need on ilmselgelt kaugele jõudnud alates 1990ndatest aastatest ning populaarsed disainisuunad on kasvanud vaid eksponentsiaalselt. Tundub, et liigume ajastusse, kus ülimuslik disain on ülimuslik.
Vaadake mõningaid linki näiteid Patterntapilt, et näha, kas hüpata ja silma kinni püüda. Hüperlingi disaini jaoks on nii palju uskumatuid ideid nii standard- kui ka hoverefektides. CSS3 ümarad nurgad, teksti varjud ja kohandatud fontide perekonnad lisavad segusse veelgi suuremaid ideid! Üks minu lemmiknäiteid on SimpleBits, mis kasutab lühikest dünaamilist animatsiooni iga oma blogikirje kohta.
Järeldus
Need ideed on vaid mõned populaarsemad suundumused, mida olen 2011. aasta jooksul esile toonud. Suured veebidisainid on alati fookusest ja kasutajate kavatsustest peamine prioriteet. On ebatõenäoline, et need filosoofiad muutuvad 2012. aastal erinevaks, kuid kuidas me kujundame paigutusi ja olemasolevaid andmeid on alati muutumas. Anna meile teada oma mõtted või küsimused kommentaaride arutelualal.
